vue发布到nginx下请求后台404问题及解决

 更新时间:2024年03月12日 08:55:23   作者:liulang1905  
这篇文章主要介绍了vue发布到nginx下请求后台404问题及解决方案,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教

vue发布到nginx下请求后台404

先说下我的问题,在vue开始的时候配置了跨域代理,开始时没有问题,但是build 发布到nginx中时访问后台就404了,下面给出我的处理方法

先展示下错误的时候

这里是我登录的时候调用后端接口404没有资源

查看请求地址,发现我在vue里配置的代理地址没有生效,直接将我代理的那个前缀拼了上来,后又拼上了我需要请求的接口

个人分析原因

因为我这里需要跨域请求,在开发时配置了代理,但是在开始是使用的是 npm run 可能用的是node.js发布的就直接生效了 ,现在是用的nginx发布而本事配置的代理在这就失效了。

所以问题很简单就是尝试以下配置nginx代理是否可以解决问题,百度了以下nginx配置代理如下 

这里我们在nginx中的conf文件夹下的nginx.conf中添加配置

之后我们重启nginx 如果关闭不彻底,可以使用这个语句,在cmd直接执行

taskkill /f /t /im nginx.exe

启动之后正常了

最后改完发现这个请求地址和我之前分析的那个给我拼接的代理前缀好像没得毛关系。。

但是确实是nginx代理的问题

总结

以上为个人经验,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • Vue中的动态路由匹配路由问题

    Vue中的动态路由匹配路由问题

    这篇文章主要介绍了Vue中的动态路由匹配路由问题,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-12-12
  • vue打包上传服务器刷新404问题的两种方案

    vue打包上传服务器刷新404问题的两种方案

    这篇文章主要给大家介绍了关于vue打包上传服务器刷新404问题的两种方案,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2021-04-04
  • Vue计算属性中reduce方法实现遍历方式

    Vue计算属性中reduce方法实现遍历方式

    这篇文章主要介绍了Vue计算属性中reduce方法实现遍历方式,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2023-03-03
  • element ui富文本编辑器的使用效果与步骤(quill-editor)

    element ui富文本编辑器的使用效果与步骤(quill-editor)

    富文本编辑器在任何项目中都会用到,在Element中我们推荐vue-quill-editor组件,下面这篇文章主要给大家介绍了关于element ui富文本编辑器的使用效果与步骤(quill-editor)的相关资料,需要的朋友可以参考下
    2022-10-10
  • Props传参v-for后TS报错对象类型是unknow的解决方案

    Props传参v-for后TS报错对象类型是unknow的解决方案

    这篇文章主要介绍了Props传参v-for后TS报错对象类型是unknow的解决方案,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧
    2024-03-03
  • vue-cli浏览器实现热更新的步骤

    vue-cli浏览器实现热更新的步骤

    这篇文章主要介绍了vue-cli-浏览器实现热更新,最常用的是webpack-dev-server,它是一个小型的Node.js Express服务器,它使用webpack-dev-middleware来服务于webpack的包,本文结合实例代码介绍的非常详细,需要的朋友参考下吧
    2024-03-03
  • Vue3(二)集成Ant Design Vue

    Vue3(二)集成Ant Design Vue

    上一篇文章我们介绍了利用Vue3 创建Vue CLI 项目(一),接下来就来看看Vue3集成Ant Design Vue 的相关资料,需要的小伙伴可以参考一下文章的具体内容
    2021-10-10
  • 详解vue项目中调用百度地图API使用方法

    详解vue项目中调用百度地图API使用方法

    这篇文章主要介绍了vue项目中调用百度地图API使用方法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-04-04
  • vue获取路由详细内容信息方法实例

    vue获取路由详细内容信息方法实例

    获取路由详细内容信息是我们日常开发中经常会遇到的需求,下面这篇文章主要给大家介绍了关于vue获取路由详细内容信息的相关资料,文中通过示例代码介绍的非常详细,需要的朋友可以参考下
    2022-12-12
  • vue用复选框实现组件且支持单选和多选操作方式

    vue用复选框实现组件且支持单选和多选操作方式

    这篇文章主要介绍了vue用复选框实现组件且支持单选和多选操作方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
    2024-04-04

最新评论