共计 2643 个字符，预计需要花费 7 分钟才能阅读完成。
TP 运行跨域的方法很多，特别是TP6，就更是简单了，这里分享三种 VUE 和 Thinkphp6 做前后端分离时，跨域请求的设置方法。
一、路由允许跨域请求
其实这种方法相对要好得多，除非你的后端是完全的 restful 对外方服务，否则建议采用第一种方式，即路由中允许跨域请求。
允许所有
|
1
2
|
Route::get(‘new/:id’, ‘News/read’)
->allowCrossDomain();
|
单条路由中，如上加上 allowCrossDomain 即可允许跨域请求，如果是分组的路由，也是类似的操作：
|
1
2
3
4
5
|
Route::group(‘web’, function() {
Route::get(‘/’, ‘WebApi/index’);
Route::get(‘/login’, ‘WebApi/login’);
Route::post(‘/login’, ‘WebApi/login’);
})->allowCrossDomain();
|
部分允许
如果想要现在部分域名访问，则这样操作：
|
1
2
3
4
5
|
Route::get(‘/’, ‘WebApi/index’)
->allowCrossDomain([
‘Access-Control-Allow-Origin’ => ‘lanluo.cn’,
‘Access-Control-Allow-Credentials’ => ‘true’
]);
|
这是允许一个，允许多个则需要以数组形式传入或直接填写在此处。
|
1
2
3
4
5
|
Route::get(‘/’, ‘WebApi/index’)
->allowCrossDomain([
‘Access-Control-Allow-Origin’ => ‘[“lanluo.cn”,”api.lanluo.cn”]’,
‘Access-Control-Allow-Credentials’ => ‘true’
]);
|
二、路由 中间件
和上面的方法类似，这里以路由分组为例：
|
1
2
3
4
5
|
Route::group(‘web’, function() {
Route::get(‘/’, ‘WebApi/index’);
Route::get(‘/login’, ‘WebApi/login’);
Route::post(‘/login’, ‘WebApi/login’);
})->middleware(thinkmiddlewareAllowCrossDomain::class);
|
在最后加上这个内置的中间件即可实现跨域请求的允许。
控制器中调用中间件也是可以的，如下：
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
|
<?php
declare (strict_types = 1);
namespace appcontroller;
use thinkRequest;
use thinkmiddlewareAllowCrossDomain;
class WebApi
{
protected $middleware = [AllowCrossDomain::class];
public function index(){
return ‘The Site is building’;
}
public function login(){
$back = [
‘data’ => Null,
‘meta’=>[
‘status’ => 200,
‘msg’ => ‘jok_data’
]
];
return json($back);
}
}
|
再根据自己的需求，构建对应的逻辑代码。
三、全局中间件
不得不说 TP6 确实有可取之处，我们只需要在全局中间件中开启即可。
正文完
