解决跨域方案

后端解决

1.cors 优先使用

2.jsonp(只能解决get请求)

import jsonp from 'jsonp'
jsonp(url,option,(err,data)=>{    
       //这里的url就是完整的请求地址，需要包括请求参数
       if(!err){
         resolve(data)  //请求成功  data是响应回来的数据
       }else{
         reject(err)  //失败
       }

前端解决

3.webpack配置代理:webpack proxy(打包后webpack没有了)

module.exports = {
  devServer: {
       Proxy: {
            '/api': {
                target: 'https://bytmall.ukelink.net',
                pathRewrite: {
                    '^/api/interfaces': 'interfaces',
                    '^/api/frame': 'frame',
                },
                changeOrigin: true  //target是域名的话,需要这个参数
            },
            'api2': {
                ...
            }
        }
      }
   }

配置中主要的参数说明:
1.’/api’捕获api的标志,如果api中有这个字符串,就开始匹配代理

 例如: 访问"/api/frame/web/cms/common"会被代理转发到请求https://bytmall.ukelink.net/api/frame/web/cms/common

 注:以"/"开头,表示该请求基于从服务器的根路径,如果没有指定请求基地址,我们开发环境看到的请求路径是http://localhost:8080 + /api/frame/web/cms/common

2.'target’代理的api地址,就是需要跨域的地址

3.'pathRewrite’路径重写,会修改最终请求的api路径

4.nginx反向代理(中间件) 运维配置

5.webpack plugin -->webpack-dev-middleware

6.修改谷歌浏览器(新版本)

右击浏览器属性

加上:chrome.exe --disable-site-isolation-trials --disable-web-security --user-data-dir=“D:\temp” 等于号后面自定义一个路径