Vue前端配置代理实现跨域请求

跨域的解决方法:
        *设置让服务器允许跨域
        *前端配置代理实现跨域请求

本文介绍前端配置代理实现跨域请求:

 在项目config文件夹下的index.js文件里设置代理配置表

// 代理配置表,在这里可以配置特定的请求代理到对应的API接口
    proxyTable: {
      '/api': { // 匹配所有以 '/api'开头的请求路径
        target: 'http://localhost:4000', // 代理目标的基础路径
        // secure: false,  // 如果是https接口,需要配置这个参数
        changeOrigin: true, // 支持跨域
        pathRewrite: { // 重写路径: 去掉路径中开头的'/api'
          '^/api': ''
        }
      }
    },

【注意】上面的target是你需要跨域到的目标,并不是前端服务器的地址!这么说吧,4000端口是服务器端口,一般前端服务器默认是8080端口!你现在因为端口不同需要跨域,所以要指定跨域的地址!

上述配置好之后,发送请求时,请求前缀不再是http://local:4000,而是/api。同时记得重启项目,因为项目配置文件改变了!

猜你喜欢

转载自blog.csdn.net/FullStackDeveloper0/article/details/85004667