最近我在开发一个网站,需要前端通过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请求失败。