前台关于跨域的警告A cookie associated with a cross-site resource at .........,代理服务器

来源:csdn博客 分类: 文章浏览史 发布时间:2020-10-21 11:25:18 最后更新:2020-10-21 浏览:125
转载声明:
本文为摘录自“csdn博客”,版权归原作者所有。
温馨提示:
为了更好的体验,请点击原文链接进行浏览
摘录时间:
2020-10-21 11:25:18

A cookie associated with a cross-site resource at …

解决该警告的方法:
在配置文件中添加配置如下:

 "proxy": {
  "/api": {
    "target": "http://112.125.26.100:8000/",
    "changeOrigin": true,
    "pathRewrite": { "^/api" : "" }
  }
}

添加之后,当识别到 /api 就会跳转到target指向的网址。

例如:后台接口是http://123.123.23.123:8000/index/user,
请求的时候:/api/index/user 就可以了

changeOrigin 有跨域情况,配置true;
pathRewrite 如果你的实际接口中没有/api,则需要配置该属性,在最终请求的时候消除/api

如果配置到正式环境,这个跨域就没有必要了。所以建议判断当前的环境来决定是否需要该代码。所以

let  isDev = process.env.NODE_ENV;  //当前的环境
...
proxy: {
  "/api": {
     target: "http://112.125.26.128:8000/",
     changeOrigin: isDev==='development'?true:false,
     pathRewrite: { "^/api": "" }
   }
 }
  ...

另外的请求时候的API地址同样需要判断:

const isDev = process.env.NODE_ENV;
let APIHost  = '';
if(isDev==='development'){
   APIHost = '/api';
}else{
  APIHost = 'http://112.125.26.128:8000/';
}

结果:
开发环境(本地环境):
在这里插入图片描述
生产环境(正式环境):
在这里插入图片描述
如此都不会有跨域的警告出现

php技术微信