淘先锋技术网

首页 1 2 3 4 5 6 7
最近我在开发一个网站,需要前端通过ajax调用后端php的api接口。但是发现后端返回的数据是null,经过调查发现是因为PHP没有正确实现CORS规范,导致前端的POST请求被拒绝了。 CORS(Cross-origin resource sharing)是一个浏览器的安全策略,它限制了客户端跨域请求资源的能力。简单来说,如果前端代码从一个域名(比如example.com)请求api接口,而这个接口在另一个域名(比如api.example.org)上,那么浏览器会发出跨域请求,遵循CORS规范。这个规范要求服务器在响应请求时,设置一些响应头,告诉浏览器可以接受哪些跨域请求。 以POST方法为例,在PHP中可以使用以下代码实现CORS: ```php header('Access-Control-Allow-Origin: *'); header('Access-Control-Allow-Methods: POST'); header('Access-Control-Allow-Headers: Content-Type'); ``` 其中,Access-Control-Allow-Origin指定了浏览器允许的源(域名),这里的*表示所有源都可以;Access-Control-Allow-Methods指定了允许的HTTP方法;Access-Control-Allow-Headers指定了允许的请求头。需要注意的是,这些响应头需要在API接口的php文件中添加,而不是在HTML页面中。 为了更好地理解这个过程,我们可以举一个例子。假设我们有一个前端页面,它的URL是http://example.com/index.html,我们需要发送POST请求到http://api.example.org/api.php,并且在请求头中带有Content-Type: application/json和Authorization:Bearer xxx。 前端的代码可以写成这样: ```javascript fetch('http://api.example.org/api.php', { method: 'POST', headers: { 'Content-Type': 'application/json', 'Authorization': 'Bearer xxx' }, body: JSON.stringify(data) }).then(res =>res.json()) .then(json =>console.log(json)) .catch(err =>console.error(err)); ``` 而在api.php文件中,我们需要添加以下代码: ```php header('Access-Control-Allow-Origin: http://example.com'); header('Access-Control-Allow-Methods: POST'); header('Access-Control-Allow-Headers: Content-Type, Authorization'); ``` 这样就可以在服务端支持CORS规范,让浏览器正常地发送跨域POST请求了。 当然,上面的例子只介绍了POST请求中的CORS规范。如果你需要支持其他HTTP方法(比如GET、PUT、DELETE),需要在响应头中设置Access-Control-Allow-Methods的值为相应的方法名称。 综上,PHP中实现CORS规范是一个非常简单的过程,只需要在API接口的php文件中设置一些响应头即可。如果你的前端代码需要跨域请求API接口,务必注意添加这些响应头,否则浏览器会拒绝发送跨域请求,导致API请求失败。