如何在本地主机上的 reactjs 中使用 ajax答案

【问题标题】：How to use ajax in reactjs on localhost如何在本地主机上的 reactjs 中使用 ajax
【发布时间】：2017-11-16 13:08:48
【问题描述】：

以下是我的代码：使用本地网址时出现错误

“无法加载http://localhost/reactjs/my-app/lib/ajax.php：对预检请求的响应未通过访问控制检查：请求的资源上不存在“Access-Control-Allow-Origin”标头。来源'@ 987654322@' 因此不允许访问"

但是当我使用诸如“https://jsonplaceholder.typicode.com/todos”之类的实时网址时，它工作正常。

$.ajax({
url: 'http://localhost/reactjs/lib/ajax.php',
//url: 'https://jsonplaceholder.typicode.com/todos',
 type: 'GET',
dataType: 'jsonp',
//contentType: "application/json; charset=utf-8",
//jsonp: "json_callback",
crossOrigin: true,
//cors: true,
//data: {user_name:username, user_type: usertype, password: password,mode: 'Login' },
success: function(data){
alert(data);
},
error: function(error){
console.log(error);
 }
});

【问题讨论】：

标签： ajax reactjs

【解决方案1】：

您正在调用不同的主机，这就是您遇到 CORS 问题的原因。您的应用程序正在 localhost:3000 上运行，并且您正在 localhost 上调用您的服务。

您可以按照 Vivek 的建议进行操作（如果它是不同的主机），或者您只需要引用正确的端口（如果两个应用程序都在 localhost:3000 上）。

请注意，您不必在 ajax 中编写绝对 url。相反，如果它在同一个主机上，你可以写/reactjs/lib/ajax.php。

【讨论】：

我怎样才能在同一个端口上制作这两个端口，因为我是 reactjs 新手，我尝试了 Vivek 所说的但没有奏效。
上面运行代码的服务器的url(host)是什么？这与 React 无关...
Reactjs 运行在：localhost:3000 Php：localhost/reactjs/lib/ajax.php
那么 Vivek 的解决方案是正确的，您应该遵循它。

【解决方案2】：

在 php 端添加这个：

header('Access-Control-Allow-Origin: *');

header('Access-Control-Allow-Methods: GET, POST');

header("Access-Control-Allow-Headers: X-Requested-With");

这个网址http://localhost/reactjs/my-app/lib/ajax.php应该是http://localhost/reactjs/lib/ajax.php

【讨论】：

已添加，但在使用 localhost 时仍会收到“SyntaxError: Unexpected token :”
我的 reactjs 文件夹是 wamp/www/reactjs/my-app 和我的 php 代码在 wamp/www/reactjs/lib/ajax.php
如果您在同一主机上，则无需设置此标头...请在下面查看我的答案