时间戳

首页 > 解决方案 > Fetch() 函数导致资源被 CORS 阻塞

javascript - Fetch() 函数导致资源被 CORS 阻塞

问题描述

应用程序.js：

import React from 'react';
import './App.css';

class App extends React.Component {

  state = {
    character : {}
  };

  componentDidMount() {
    fetch("https://jobs.github.com/positions.json?description=basf")
      .then(data => console.log(data));
    console.log("Hello World");
  }

  render() {
    return (
      <div className="App">
        <h2>Hello World</h2>
      </div>
    );
  }
}

export default App;

错误信息 -

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

获取失败

你能告诉我如何解决这个问题并获得所需的数据吗？我正在使用 Github Jobs API 并显示此消息。

标签： javascriptreactjs

解决方案

您需要使用 no-cors 标头

 fetch("https://jobs.github.com/positions.json?description=basf", {
      mode: "no-cors" // 'cors' by default
    }).then(data => console.log(data));

看看这个代码框

我希望这个答案对你有帮助:)

推荐阅读