CORS 错误 - 无法使用 React.js 从 JIRA 获取 Rest api

Question

我正在处理 react.js 项目，我必须从 JIRA rest api 获取数据并使用 react.js 显示它。当我直接从浏览器访问 API 时，API 工作正常，但是当我尝试使用 react.js 获取时，它会导致以下错误。

CORS 策略已阻止从源“http://localhost:3000”获取“API”的访问权限：请求的资源上不存在“Access-Control-Allow-Origin”标头。如果不透明的响应满足您的需求，请将请求的模式设置为“no-cors”以获取禁用 CORS 的资源。

注意：

我尝试了模式：“no-cors”，甚至安装了 npm cors lib，但它们并没有解决问题。

React.js 代码

import React, { Component } from 'react';

class App extends Component {

  constructor(props)
  {
    super(props);
    this.state = {
      items: [],
      isLoaded: false,
    }
  }

  componentDidMount()
  {


    fetch('API which i cant display but works 100% fine . please ignore') 
      .then(res => res.json())
      .then(json => {
        this.setState({
          isLoaded: true, 
          items: json,
        })
      })
      .catch(e => { console.log("error: ",e) }); 
  }

  render()
  {
    var { isLoaded, items } = this.state;
    console.log("Hello ", items);

    if (!isLoaded)
    {
      return <div>Loading..</div>
    }
    else {
      
      
      return (
        <div className="App">
          Id : item.id
          <ul>
            {items.map(item => (
              <li key={item.id}>
                Name: {item.name}
                Email: {item.email}
              </li>
            ))};
            </ul>
        </div>
      );
      
    }
  }
}

export default App;

Answer 1

您可能需要在 JIRA 中将您的端口和本地地址列入白名单。

Answer 2

您的浏览器安全可能会阻止您的请求。尝试以非安全模式打开浏览器。

在 macOS 上：

open -a Google\ Chrome --args --disable-web-security --user-data-dir