vue部署的时候请求404

2024-10-21

解决vuejs应用在nginx非根目录下部署时访问404的问题

以往部署vuejs应用都是直接在nginx的location为/下直接部署,这次遇到要将vue应用部署在/vuejs-admin的非根下,使用以往部署方案直接访问就会404,这时修改步骤如下: 1.修改项目router配置,如下: 这里一是要修改router模式为history,另一个就是修改base地址为要访问的/vuejs-admin的地址,注意前后都有斜线 2.修改build下静态资源路径前缀同上一部,这里要修改assetsPublicPath为/vuejs-admin/地址 3.执行v

vue打包后，接口请求404的完美解决方案

在开发环境中,和后台对接为了解决跨域问题,使用了代理,也就是vue的proxyTable,但是打包放到生产环境中去时,接口请求不到,404,原因是开发环境的代理并不能用到生产环境,但是直接在请求接口是使用服务器地址,可以成功,但是会造成cookie丢失而失去权限验证我脑海里出现有两种办法,一是使用代理,如何解决接口路径请求404的问题,二是直接写请求路径,如何解决cookie丢失的问题之前因为cookie丢失,后台忙活了很长时间,好不容易才解决的,加之开发环境下并不会丢失,所以我的想法是继续

Vue 使用 axios post请求后台数据时 404

今天遇到Vue 使用 axios post请求后台数据时 404 使用postman 就能获取到网上找了大半天终于找到了解决方法,传送门:https://www.jianshu.com/p/b10454ed38ba

vue 部署404

https://www.cnblogs.com/kevingrace/p/6126762.html 在nginx部署https://www.jianshu.com/p/7017143e3f7a 在apache 部署 vue 部署官方文档 https://cli.vuejs.org/zh/guide/deployment.html#%E9%80%9A%E7%94%A8%E6%8C%87%E5%8D%97

Vue.js使用-http请求

Vue.js使用-ajax使用 1.为什么要使用ajax 前面的例子,使用的是本地模拟数据,通过ajax请求服务器数据. 2.使用jquery的ajax库示例 new Vue({ el: '#app', data: { searchQuery: '', columns: [{name: 'name', iskey: true}, {name: 'age'},{name: 'sex', dataSource:['Male', 'Female']}], peoples: [] }, ready: f

解决微服务网关Ocelot使用AddStoreOcelotConfigurationInConsul后请求404问题

一个小插曲,最近研究 netcore 微服务网关,在使用AddStoreOcelotConfigurationInConsul将配置存到consul后,任何经过网关的请求都出现404,并且没有任何有用的异常信息打印.这里先简单讲讲这个问题是如何发生的,及如何解决. 之前在 ASP.NET Core 2 学习笔记(三)中间件提到过大部分扩展的Middleware都会用一个静态方法包装,如:UseMvc().UseRewriter()等,而微服务网关Ocelot 包装了两个静态的异步方法 UseO

vue axios配置发起请求加载loading请求结束关闭loading

axios带有请求拦截器,避免在每个请求里面加loading重复操作,可以封装进去,在请求开始时加载loading层,请求结束关闭,loading层用vux的loading加载 axios.js import axios from 'axios' import Vue from 'vue' // 超时时间 axios.defaults.timeout = 15000; // axios.defaults.withCredentials=true; // http请求拦截器 axios.inter

vue实践---vue配合express实现请求数据mock

mock数据是前端比较常见的技术,这里介绍下vue配合express 实现请求数据mock. 第一步: 安装 express : npm install express -D 第二步: 简历需要mock的数据,在src下新建mock文件夹,文件里面新建两个文件data1.json和data2.json,如下: data1.json内容如下: { "name": "yanyalong", "title": "测试", &quo

vue中比较完美请求的栗子（使用 axios 访问 API）

vue中比较完美请求的栗子(使用 axios 访问 API) 官网地址:https://vuejs.bootcss.com/v2/cookbook/using-axios-to-consume-apis.html 实例: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" co

vue实现跨域请求的设置

vue实现跨域请求,需要在vue.config.js里添加以下设置 proxy: { '/service/rest': { target: 'http://localhost:8080/autotable/service/rest', ws: true, changeOrigin: true, pathRewrite:{ '^/service/rest':'' } } } 其中 ,将changeOrigin设置为true,就不会存在无法跨域请求的问题了. 然后就可以直接在下面引用axios调用了

Vue.js之Ajax请求

Vue.js同React.Angular,可以说号称前端三巨头. 前段时间,有个哥们说,Vue.js现在出2.0版本了.可是我现在还是在用1.0的. Vue.js一直都没有好好系统的学习,包括目前公司虽然是在用Vue,但是让我感觉用的有些偏了.比如Vue.js明明就有异步交互,但是我用的却还是jQuery的ajax,说到这也不是歧视jQuery,只不过觉得没有用到刀刃上.总觉得怪怪的. 今天贴一段代码,关于Vue.js的Ajax请求,希望能给朋友们带来帮助. 下面代码,测试完全没问题,只不过ur

vue resource 携带cookie请求 vue cookie 跨域

vue resource 携带cookie请求 vue cookie 跨域 1.依赖VueResource 确保已安装vue-resource到项目中,找到当前项目,命令行输入: npm install vue-resource --save 在主方法添加过滤 Vue.http.interceptors.push(function(request, next) {//拦截器 // 跨域携带cookie request.credentials = true; next() }) 以下是针对每个请

springboot访问请求404问题

新手在刚接触springboot的时候,可能会出现访问请求404的情况,代码没问题,但就是404. 疑问:在十分确定代码没问题的时候,可以看下自己的包是不是出问题了? 原因:SpringBoot 注解 @SpringBootApplication 默认扫描当前类的同包以及子包下的类: 如:启动程序Application.java 在包名 cn.com.egova下,则会查找所有 cn.com.egova包下的文件以及该包的所有子包(包括子包的子包)里面的文件.

nginx反向代理部署springboot项目报404无法加载静态资源

问题:nginx反向代理部署springboot项目报404无法加载静态资源(css,js,jpg,png...) springboot默认启动端口为8080,如果需要通过域名(不加端口号)直接访问springboot服务就需要nginx配置反向代理到8080端口 nginx配置host主机的过程就不在这讲了,重点解决反向代理静态资源无法访问 nginx反向代理配置 server { listen 80; #listen [::]:80; server_name wms.shiyayun.cn;

Vue之优化封装请求方法

Vue之优化封装请求方法对于代码中的请求操作 1.接口请求可能需要重用 2.实际工作中,接口非常容易变动, 改起来很麻烦! 我们建议的做法是把所有的请求都封装成函数然后统一的>###组织到模块中进行管理这样做的好处就是:管理维护更方便,也好重用封装请求本身! loginIn() { // 对于代码中的请求操作 // 1.接口请求可能需要重用 // 2.实际工作中,接口非常容易变动, 改起来很麻烦! // 我们建议的做法是把所有的请求都封装成函数然后统一的组织到模块中进行管理 // 这样做的

nignx部署Vue单页面刷新路由404问题解决

官网说明: https://router.vuejs.org/zh/guide/essentials/history-mode.html#%E8%AD%A6%E5%91%8A 在linux下搭建nginx测试网页的时候,正常打开可以访问,当刷新后页面出现404 not found的问题说明: vue-router 默认 hash 模式 —— 使用 URL 的 hash 来模拟一个完整的 URL,于是当 URL 改变时,页面不会重新加载. 如果不想要很丑的 hash,我们可以用路由的 histo

Vue 部署单页应用，刷新页面 404/502 报错

在 Vue 项目中,可以选择 hash或者 history.pushState() 实现路由跳转.如果在路由中使用history模式: export default new Router({ mode: 'history', base: __dirname, scrollBehavior, routes: [index, blog, project, about, list] }) 那么,当我们 npm run build 完成并部署到服务器后,刷新某个路由下的页面,会出现 404 或者 502

vue部署后刷新404问题

为什么会404NotFound Internet Information Services (IIS) 第一步:安装 IIS UrlRewrite 第二步:配置重写URL规则在你的网站根目录中创建一个 web.config 文件,内容如下: <?xml version="1.0" encoding="UTF-8"?> <configuration> <system.webServer> <rewrite> <r

vue部署服务器以及解决部署到apache路由出现404

最近在开发cms的时候使用Vue.js框架,利用vue-route.vue-cli结合webpack编写了一个单页路由项目,自己在服务器端配置apache.部署完成后,访问没问题,从页面中点击跳转就会报错,就会出现404现象!在本地开发中是没有这个问题的,调试的时候一切都是正常的. 步骤一: 在config/index.js文件里的assetsPublicPath改成你放在服务器的文件路径里,根目录就是:/ 如果是放在某个文件夹,例: /vuep/ 步骤二: 在自己的路由配置中加入base属

ISS部署网站--HTTP 错误 404.17 - Not Found 请求的内容似乎是脚本，因而将无法由静态文件处理程序来处理。

1.控制面板>程序和功能>打开或关闭Windows功能 > Internet信息服务 > 万维网服务 > 应用程序开发功能 > ASP.NET(看这个是否选上): 2."处理程序映射"中缺少ASP.NET 4.0的映射,需要添加映射.操作方法:在管理员身份打开命令行,运行以下命令: C:\Windows\Microsoft.NET\Framework\v4.0.30319\aspnet_regiis.exe -i 3.如果运行再次出现"由于

nginx部署vue前端，刷新出现404或者500错误的解决方案

在nginx配置文件的server下加上 try_files $uri $uri/ /index.html; 不加的话是404,路径错误是500,这里的路径只要照着/index.html就行,不用加上具体部署的位置

vue部署的时候请求404

热门专题