Micronaut 微服务中的 CORS答案

【问题标题】：CORS in Micronaut MicroserviceMicronaut 微服务中的 CORS
【发布时间】：2020-02-21 20:22:22
【问题描述】：

我正在从事一个小型学校项目，该项目涉及从反应前端访问使用 Java 中的 Micronaut 构建的微服务。当我最初将我的微服务部署到谷歌云时，我可以从 Postman 远程访问它，但是，当我尝试从 react 前端访问它时，我收到以下错误：

代码：

sendOtp(phoneNumber) {
    fetch(apiRequest, {
      method: 'POST',
      body: JSON.stringify({
        phoneNumber: 'phoneNumber',
      }),
      headers: {
        "Content-type": "application/json; charset=UTF-8"
      }
    }).then(response => {
        return response.json()
      }).then(json => {
        this.setState({
          otpResponse:json
        });
      });
  }

错误：

CORS 策略已阻止从源“X”在“X”处获取的访问权限：对预检请求的响应未通过访问控制检查：请求中不存在“Access-Control-Allow-Origin”标头资源。如果不透明的响应满足您的需求，请将请求的模式设置为“no-cors”以获取禁用 CORS 的资源

我稍微研究了一下 CORS，发现我需要将以下内容添加到我的 application.yml 文件中：

micronaut:
    server:
        cors:
            enabled: true

我还在我的帖子请求中添加了https://cors-anywhere.herokuapp.com，因为这是我在网上找到的解决方法。

但是，我对此仍有一些疑问：
1。为什么我可以从 Postman 访问这个微服务，但不能从 React 前端访问？
2。使用https://cors-anywhere.herokuapp.com 是一种安全的解决方法吗？他们有任何安全问题吗？
3。这个问题是 React/Web 页面独有的吗？如果我想从其他应用程序访问此微服务，是否需要启用 CORS？

谢谢，任何帮助将不胜感激！

【问题讨论】：

标签： java rest cors microservices micronaut

【解决方案1】：

为什么我可以从 Postman 访问这个微服务，但不能从 React 前端访问？

因为 CORS 与您的 Postman 请求无关。

使用https://cors-anywhere.herokuapp.com 是一种安全的解决方法吗？他们有什么安全问题吗？

通常你不想这样做。您希望配置 CORS 以允许来自前端的请求。

这个问题是 React/Web 页面独有的吗？如果我想从其他人访问此微服务，是否需要启用 CORS 应用程序？

不，它不是 React 独有的。您是否需要启用 CORS 才能从其他应用程序访问此服务取决于这些应用程序是什么。如果它们是在来自不同来源的浏览器中运行的 JS 应用程序，是的。如果它们是向您的 API 发出请求的客户端应用程序，则不会。

查看https://docs.micronaut.io/1.2.5/guide/index.html#cors 的Allowed Origins 部分。您将需要配置您的 React 应用程序的来源。

希望对你有帮助。

【讨论】：

感谢您的帮助！