部署均值堆栈项目时出现问题。存在CORS阻止每个请求的问题

Question

我正在部署Mean-Stack项目，在部署时，收到CORS策略错误，说...

CORS策略阻止了从源http://localhost:4200在http://XXX.XXX.X.XX:4000/user/postUserAuth处访问XMLHttpRequest：对预飞行请求的响应无法通过权限改造检查：当请求的凭据模式为“包含”时，响应中的访问控制允许源标头的值不能是通配符“*”。由XMLHttpRequest发起的请求的凭据模式由with凭据属性控制

我们怎样才能允许所有的请求到达Express服务器并解决这个问题？

服务器我们使用的角度是精简服务器。

// Used this in Express 
    app.use(cors((
    {
    'origin':'*',
    'credentials':true,
    'preflightContinue':true,
    'optionSuccessStatus':204
    }
    )));

    //Server is logging this 
     "OPTIONS /user/postUserAuth HTTP/1.1" 200 4 "http://localhost:4200/login


    //Angular service class
    export class LogincontrollerService {
      private address = APIEndpoint;
      _LoginURL=this.address+"/user/postUserAuth";
      constructor(private _http: HttpClient) { }

      // function to for sending request to server with data. 
      getLogin(data){
      return this._http.post<any>(this._LoginURL,data,{
        withCredentials:true
      });
    }

    }

Answer 1

方法1:在< code>cors选项中指定url，而不是< code>*:

const corsOptions = {
    origin: 'http://localhost:4200',
    credentials: true,
    preflightContinue:true,
    optionSuccessStatus:204

}
app.use(cors(corsOptions));

注意:这是安全性的一部分。如果您希望允许凭据，则您的访问控制允许来源不能使用< code>*。您必须指定确切的协议域端口*

方法2：使用以下middileware解决CORS（如果您不想允许凭据）：

app.use(function (req, res, next) {

    // website you wish to  allow to connet    
    res.setHeader('Access-Control-Allow-Origin','http://localhost:4200/');

    // request method you wish to allow
    res.setHeader('Access-Control-Allow-Methods','GET, POST, OPTION, PUT, PATCH, DELETE');

    // request headers you wish to allow 
    res.setHeader('Access-Control-Allow-Headers','X-Requested-With,content-type,Authorization');   

    // set to true if you need the website to include  cookies  in the  request  sent 
    // to the API (eg. in case you can see sessions )
    res.setHeader('Access-Control-Allow-Credentials','false');

    // pass to the next layer of middleware
    next();

});