vue项目在开发模式时,使用的axios调用的后台接口,而使用axios调用后台接口,需要在vue.config.js中配置proxy代理,否则会出现请求头错误,而设置了proxy代理后,vue项目打包proxy代理就会失效,因为proxy代理并不会一起打包到dist文件夹下,网上的说法都是配置不同环境新建env文件及更换baseurl等,但是我发现这种做法在vue3.11版本中并不适用,直接根据打包环境更换baseurl还是会导致项目出现请求头问题,也有可能是我配置有问题,但我确实无法通过那些方法解决,所以改用nginx服务器发布,通过对nginx目录中conf文件夹下nginx.conf文件设置反向代理,完全可以不用更改vue项目的后台接口地址,以下是vue项目中关于后台接口及反向代理的代码:
App.vue:
<template>
<div id="app">
<div id="nav">
<router-link to="/">Home</router-link> |
<router-link to="/about">About</router-link>
</div>
<router-view/>
</div>
</template>
<style>
#app {
font-family: 'Avenir'<