前端使用proxy进行反向代理解决跨域

利用devServer解决跨域 (也就是代理服务器)

1、首先在根目录下面建一个 vue.config.js ,里面配置如下

module.exports = {
    devServer: {
        proxy: {
            '/api': {
               target: 'http://www.chenfuguo.cn:3000', // 需要跨域的目标路径(真实访问的路径)
               changeOrigin: true,
               pathRewrite: { 
                     //路径重写
                    '^/api': ''
                }
            }
        }
    }
}

2、在src/http/index.js下,把跟路径改为 /api

import axios from "axios";

const http = axios.create({
    // baseURL: 'http://www.chenfuguo.cn:3000',
    baseURL: '/api',
})

export default http

最后将项目重启一下即可 

猜你喜欢

转载自blog.csdn.net/weixin_59739381/article/details/132152561