记vue.js在axios跨域时后台人员（PHP）需要注意的坑

今天刚刚把写好的代码传到服务器后，前端测试反馈说不管怎么传递参数，我这边返回给他的都是缺少参数。

 

然而我发现这里的有两次调用接口的操作，永远是第一次参数丢失，第二次成功。

 

点开第一次失败的接口，header中信息如下。

 其中request method为OPTIONS，面向百度编程得知

 

具体关于OPTIONS和GET/POST的问题可以看看这篇文章：HTTP访问控制（CORS）。

于是修改原来的跨域请求头，原用于允许跨域的代码为：

       header('Access-Control-Allow-Origin: *');
       header("Access-Control-Allow-Credentials: true");
       header("Access-Control-Allow-Headers: Content-Type,Access-Token");

 后改为

        header('Access-Control-Allow-Origin: *');
        header("Access-Control-Allow-Credentials: true");
        header("Access-Control-Allow-Headers: Content-Type,Access-Token");
        header("Access-Control-Expose-Headers: *");
        header('Access-Control-Allow-Methods:POST,GET,OPTIONS,DELETE');

        //当接收到Method为OPTIONS的请求时退出程序，等待第二次正式请求 。
        if(strtoupper($_SERVER['REQUEST_METHOD'])== 'OPTIONS') exit()

 

最后顺便附上laravel设置允许跨域访问的解决方案