Share thinkphp withCredentials cross-domain problem solving ideas-ThinkPHP-php.cn

The following is the thinkphp tutorial column to introduce you to thinkphp withCredentials cross-domain problem solving ideas. I hope it will be helpful to friends in need!

I won’t go into details here about what cross-domain is. The main topic here is thinkphp5.1. Let’s talk about the general solution idea

First of all, because the front-end is written by myself, in the axios configuration, I set the following

withCredentials: true // Send cookies during cross-domain requests

// 创建一个axios
const service = axios.create({
  baseURL: URL , 
  withCredentials: true, // 跨域请求时发送cookie
  timeout: 5000 // request timeout
})

Copy after login

In In the backend configuration,

header("Access-Control-Allow-Origin: *");

Copy after login

is configured, so such an error

Access to XMLHttpRequest at 'http://store.ink/admin/me?sid=lbn3mpacfb3k1mbehnk9qh8kf3' from origin 'http://vue-admin-web.ink' has been blocked by CORS policy: The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.

Copy after login

is thrown, which means that when withCredentials is set to true, Origin is not allowed to be *, origin must be set to the source address

, that is, when http://a.com requests http://b.com, http:/ /a.com must set the origin to http://b.com to pass

Finally refer to the configuration as follows

 $origin = $_SERVER['HTTP_ORIGIN'] ?? '*';
        header("Access-Control-Allow-Origin: $origin");
        header('Access-Control-Allow-Credentials: true');
        header('Access-Control-Allow-Headers: Authorization, Content-Type, If-Match, If-Modified-Since, If-None-Match, If-Unmodified-Since, X-Requested-With');
        header('Access-Control-Allow-Methods: GET, POST, PATCH, PUT, DELETE');
        header('Access-Control-Max-Age: 1728000');

Copy after login

Of course, this can also be done when it is *

header("Access-Control-Allow-Origin: *");
        header('Access-Control-Allow-Headers: Authorization, Content-Type, If-Match, If-Modified-Since, If-None-Match, If-Unmodified-Since, X-Requested-With');
        header('Access-Control-Allow-Methods: GET, POST, PATCH, PUT, DELETE');
        header('Access-Control-Max-Age: 1728000');

Copy after login

First define a middlewarephp think make:middleware CrossDomain

<?php
namespace app\http\middleware;

use think\Response;


class CrossDomain
{
    public function handle($request, \Closure $next)
    {
        $origin = $_SERVER[&#39;HTTP_ORIGIN&#39;] ?? &#39;*&#39;;
        header("Access-Control-Allow-Origin: $origin");
        header(&#39;Access-Control-Allow-Credentials: true&#39;);
        header(&#39;Access-Control-Allow-Headers: Authorization, Content-Type, If-Match, If-Modified-Since, If-None-Match, If-Unmodified-Since, X-Requested-With&#39;);
        header(&#39;Access-Control-Allow-Methods: GET, POST, PATCH, PUT, DELETE&#39;);
        header(&#39;Access-Control-Max-Age: 1728000&#39;);

        return $next($request);
    }
}

Copy after login

Inrouter.php

Route::group(&#39;&#39;, function (){
    ....
    这里写路由
    ....
})->middleware(['CrossDomain']);

Copy after login

Then there is a new question

Because the routing file is used as above, when the requested url matches the route, cross-domain middleware will be used. As everyone knows, methods such as delete and put will be initiated in advance. An options request means that the routing file cannot be matched and the cross-domain middleware cannot be used.

So:

Define an error exception to take over https://www.kancloud.cn/manual/thinkphp5_1 /354092#_42

....
public function render(Exception $e)
{
    # 这里来处理跨域问题 
    $origin = $_SERVER['HTTP_ORIGIN'] ?? '*';
    header("Access-Control-Allow-Origin: $origin");
    header('Access-Control-Allow-Credentials: true');
    header('Access-Control-Allow-Headers: Authorization, Content-Type, If-Match, If-Modified-Since, If-None-Match, If-Unmodified-Since, X-Requested-With');
    header('Access-Control-Allow-Methods: GET, POST, PATCH, PUT, DELETE');
    header('Access-Control-Max-Age: 1728000');
    $type = request()->isAjax() ? 'json' : "html";
    $response = \think\response\Json::create([], $type, 200, []);
    return $response; # response  // 在异常处理接管中,必须返回的是一个人response响应, 而不是 `throw new `抛出一个响应
}
...

Copy after login

Complete.

The above is the detailed content of Share thinkphp withCredentials cross-domain problem solving ideas. For more information, please follow other related articles on the PHP Chinese website!