11、前后端CORS跨域配置

CORS（Cross-orgin-resource）：跨域资源共享，打破从任何一台电脑的浏览器向服务器发送请求的限制、

服务端配置

打开Program，配置跨域服务

//配置跨域服务
builder.Services.AddCors(options =>{
    //配置策略
    options.AddPolicy("cors", p =>
    {
        //允许跨域
        p.AllowAnyOrigin()
        .AllowAnyMethod()
        .AllowAnyHeader();
    });
});

 

接着在跳转的中间件后面加上策略

//策略在请求管道中使用的，所以我们要以中间件的方式添加到请求管道
//每个请求进来会运行中间件，配置效果才会生效
app.UseCors("cors");

客户端配置

打开vue.config.js,通过代理（中间商）的方式去访问

 devServer: {
    //代理方式
    proxy: {
      //以api开头的资源通过代理去获取
      "/api": {
        target: "https://localhost:7015/api/",//服务器请求地址【在后台文件Properties/launchSettings.json下】
        secure: false,//HTTPS需要配置这个参数
        changeOrigin: true,//请求头host属性,false发真实本机ip,true时会把host设置成target的地址
        pathRewrite: {
          "^/api":""//路径重写，如果不替换target可能就会多一个api,例如:https://localhost:7015/api/api
        }
      }
    }
  }

 跨域配置完成！