Question

我在React中使用了来自api的数据但是我收到了这个错误：

无法加载 https://xxxx/api/yyyy?results=1000：回复预检请求没有通过访问控制检查：否＆＃39;访问控制允许来源＆＃39;标题出现在请求的上资源。起源＆＃39; http://localhost:8000＆＃39;因此是不允许的访问。

我在Chrome中启用了跨源资源共享，但我面临同样的错误

这是路线

Route::group(['middleware'=>'cors:api'],function(){
Route::get('/xxxx','yyyyController@yyyFunction');
});

这是cors中间件

public function handle($request, Closure $next)
   {
       return $next($request)
       ->header('Access-Control-Allow-Origin', '*')
       ->header('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS')

       ->header('Access-Control-Allow-Headers', 'Content-Type, Content-Range, Content-Disposition, Content-Description')
       ->header('Connection', 'close')
       ->header('Cache-Control', 'max-age=2592000')
       //->header('Transfer-Encoding', 'chunked')

       ;
   }

Answer 1

如果您从浏览器调用API但此端点尚未定义CORS，则浏览器将阻止请求并显示错误，如您的问题。您可以参考此文档以了解有关CORS

的更多信息

Answer 2

试试这对我有用。

*** reactjs使用axios

const data = { 'id': 'xx', 'article': 'dd' };
const url = 'http://localhost:8080/path'
const options = {
  method: 'POST',
  data: qs.stringify(data),
  url,
};
axios(options)
  .then(function (response) {
    console.log(response);
  }).catch(function (error) {
    console.log(error);
  });

希望获得帮助。

No＆＃39; Access-Control-Allow-Origin＆＃34;？

2 个答案: