在做專案過程中,使用Vue-element-admin作為前端,ThinkPHP5作為後端框架進行開發,會遭遇跨域問題,本文給出ThinkPHP5解決跨域

1.CORS的概念

    CORS（Cross-Origin Resource Sharing 跨源資源共享），當一個請求 url 的協議、域名、埠三者之間任意一與當前頁面地址不同即為跨域。

2. 跨域點

當瀏覽器檢查到有跨域的問題，會對訪問的介面做一個判斷，如果是簡單的介面，則直接訪問，如果是複雜的介面，則需要先發送一個 option 請求，如果路由裡面沒有定義該介面的 option

 3. 解決方案

header('Access-Control-Allow-Origin: *');
header("Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept");
header('Access-Control-Allow-Methods: GET,POST');

 一般瀏覽器在檢查到跨域問題時，會有兩次請求，第一次是 option，如果返回 200，然後才會正式去訪問介面。所以需要在有跨域的地方，都加上一個對 option

對於ThinkPHP5來說,在其 application 目錄下，有一個 tags.php 檔案，這個能保證載入全域性的函式。將 CORS 跨域處理檔案的路徑定義到 app_init 下，這就能保證，tp5 框架在初始化就載入這個跨域處理函式。  

• 在 application->tags.php 檔案中新增如下程式碼：

// 應用初始化
'app_init'     => [
  'app\\api\\behavior\\CORS'
],
 

• 新建檔案 application->api->behavior->CORS.php

<?php

namespace app\api\behavior;

use think\Response;

class CORS
{
    public function appInit(&$params)
    {
        header('Access-Control-Allow-Origin: *');
        header("Access-Control-Allow-Headers: token,Origin, X-Requested-With, Content-Type, Accept");
        header('Access-Control-Allow-Methods: POST,GET');
        if (request()->isOptions()) {
            exit();
        }
    }
}

本文轉載自https://www.ruoxiaozh.com/blog/article/59