情景：

     uni-app使用vue框架開發混合APP，雖然APP或者小程式沒有跨域，但希望就是寫完這個既有H5，又有APP，小程式等，所以能通過後端解決跨域最好。但是不知道是vue的原因還是什麼，在PHP介面基類中添加了header頭完全不起作用。官方給出的方法也有，具體可以看https://uniapp.dcloud.io/api/request/request。

    

分析：

 1. 以前的做法是在介面新增以下部分就可以解決ajax的跨域(雖然也用過jsonp)。

// 指定允許其他域名訪問  
        // header('Access-Control-Allow-Origin:*');
        // // 響應型別  
        // header('Access-Control-Allow-Methods:*');
        // // 響應頭設定  
        // header('Access-Control-Allow-Headers:*');
 

 

2.  新增後請求，報錯“Access to XMLHttpRequest at 'http://www.unxxx.com/api/v1.user/login' from origin 'http://192.168.2.121:8000' has been blocked by CORS policy: Request header field token is not allowed by Access-Control-Allow-Headers in preflight response.”；自定義的請求頭token不被允許。因為介面請求需要帶上token，把token放在自定義請求頭上再傳到PHP。

 

3. 於是就將token改為普通引數方式傳遞，但依然報錯，Access to XMLHttpRequest at 'http://www.xxxxxx.com/api/v1.user/login' from origin 'http://192.168.2.121:8000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource。

 

4. 以上可以看出就是普通跨域報錯了，然後看一下瀏覽器的請求響應報文。

 

5. 發現返回過來的頭部資訊完全不是自己在介面上指定的，抱著試一試的念頭，把跨域請求放到了TP5.1的入口檔案\public\index.php，竟然就可以正常請求了，目前我也不清楚原因是什麼。

 

待續

後面就可以加域名白名單等等。坑雖然避開了，但是問題並沒有解決 ，如果大家有知道原因的可以加我微信一起談論。

 

相關推薦