首页 > 解决方案 > Angular 6 中没有“Access-Control-Allow-Origin”标头

问题描述

我收到 Access-Control-Allow-Origin 错误。

从源“ https://localhost:44322 ”访问“ https://localhost:44301/api/XXXX/GetAllXXXX ”处的 XMLHttpRequest已被 CORS 策略阻止:对预检请求的响应未通过访问控制检查:否请求的资源上存在“Access-Control-Allow-Origin”标头。

在此处输入图像描述

下面是我传递给 api 调用的标题。

getAllItems<T>(): Observable<T> {
const options = { headers: this.getRequestHeaders() };
return this.http.get<T>(this.getAllItemUrl, options);

}

protected getRequestHeaders(): HttpHeaders {
let headers = new HttpHeaders({
  'Content-Type': 'application/json',
  'Accept': `application/json, text/plain, */*`,
  'App-Version': '1',
});
return headers;

}

我是否缺少任何可以在这里连接我的 API 的东西?

标签: angularasp.net-web-api

解决方案


您需要将 CORS 添加到后端服务。如果它是一个基于快递的服务,你可以有这样的东西

const express = require('express');
const app = express();


var allowCrossDomain = function(req, res, next) {
    res.header('Access-Control-Allow-Origin', "*");
    res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE');
    res.header('Access-Control-Allow-Headers', 'Content-Type');
    next();
}

app.use(allowCrossDomain);

推荐阅读