Vue Axios Nginx 配置代理

一、Axios

#配置下我们访问的Url前缀
Axios.defaults.baseURL = '/api'

二、Vue - vue.cofig.js 文件配置开发环境代理

proxy: {
      '/api': {
        target: 'http://domain.name.com', #根据自己情况配置
        changeOrigin: true,
        pathRewrite: {
          "^/api": "/api"
        }
    },
}

三、Nginx

server {
        listen 80;
        server_name www.domain.name.com;
        location /{
            root happymall;
            index index.html;
        }    
        location /api {
            proxy_pass http://domain.name.com; #根据自己情况配置
            add_header 'Access-Control-Allow-Credentials' 'true';
            add_header 'Access-Control-Allow-Origin' '*'; 
        }
    }

四、请求Demo

axios.post("/login").then(res=>{
    console.log(res)
}).catch(err=>{
    console.log(err)
})
这里的请求实际是: `http://domain.name.com/api/login` 
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容