请求中不存在“Access-Control-Allow-Origin”标头

Question

我已经阅读了很多关于此的主题，但它仍然不起作用，我正在失去理智。

我有一个带有 Spring Api 的 Angular6 应用程序，当我调用它时，我一直遇到这个错误：

Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

然而我觉得我做了一切：

这是我对 Angular App 中的 api 的调用：

getGamesFromServer() {

  const httpOptions = {

    headers: new HttpHeaders({

      'Access-Control-Allow-Origin':'*'

    })

  };

  this.httpClient

    .get<any[]>('http://localhost:8080/api/rest/v1/game/progress', httpOptions)

    .subscribe(

      (response) => {

        console.log(response);

        this.games = response;

        console.log(this.games);

        this.emitGameSubject();

      },

      (error) => {

        console.log('Erreur ! : ' + error);

      }

    );

}

这是调用的java方法：

@RequestMapping(method = GET, value = "/progress")

@ResponseBody

public Response findAllAndProgress() {

    return Response.status(Response.Status.OK)

            .entity(gameService.findAllAndProgress())

            .header(ACCESS_CONTROL_ALLOW_ORIGIN, "*")

            .build();

}

我还启动了 chrome 并激活了 --disable-web-security 选项，我还下载了一个 chrome 扩展以允许 CORS 请求，但它没有用

Answer 1

在 Java 上，在您的 api 上添加以下这一行@CrossOrigin(origins&nbsp;=&nbsp;"http://localhost:4200")您还可以从 Angular 端代理您的请求。Angular 为您提供可以代理请求的内置服务器。以下步骤：在项目的根目录中添加 proxy.config.json 文件。在 proxy.config.json 文件中添加以下代码{ "/api/": { "target": { "host": "localhost", "protocol": "http:", "port": 8080 }, "secure": false, "changeOrigin": true, " logLevel": "调试" } }在 package.json 中找到脚本下的 start 并替换为以下内容：ng serve --proxy-config proxy.config.json使用以下代码编辑您的角度代码：this.httpClient .get('/api/rest/v1/game/progress', httpOptions) .subscribe( (response) => { console.log(response); this.games = response; console.log(this.games ); this.emitGameSubject(); }, (error) => { console.log('Erreur ! : ' + error); } );

Answer 2

在根目录下创建 proxy.conf.json 文件，内容如下：{&nbsp;&nbsp; "/api/*": {&nbsp; &nbsp; "target": "http://localhost:8080",&nbsp; &nbsp; "secure": false&nbsp; }}在 package.json 文件中，您必须将启动脚本从 更改ng serve为ng serve --proxy-config proxy.conf.json