tp6+jwt实现token生成及验证，tp+vue请求接口header中加入token报跨域错误解决

生成、验证token

原文：TP6 JWT Token 生成 控制器使用 中间件使用

1. 使用compose安装jwt类 (在cmd中切换至tp项目文件夹中运行一下命令，运行成功后会在vendor目录中生成firebase)

composer require firebase/php-jwt

2. 在app/common.php引入JWT类，创建生成token、验证token方法

// 应用公共文件
use Firebase\JWT\JWT;
use Firebase\JWT\Key;
use Firebase\JWT\SignatureInvalidException;
use Firebase\JWT\ExpiredException;
use Firebase\JWT\BeforeValidException;

/**
 * 生成token
 * $uid 输入用户openid&&id
 */
 
if (!function_exists('signToken')) {
	//生成验签
	function signToken($uid)
	{
		$key = '!@#$%*&';         //这里是自定义的一个随机字串，应该写在config文件中的，解密时也会用，相当    于加密中常用的 盐  salt
		$token = array(
			"iss" => '',         	//签发者 可以为空
			"aud" => '',         	//面象的用户，可以为空
			"iat" => time(),      	//签发时间
			"nbf" => time() + 3,      	//在什么时候jwt开始生效  （这里表示生成100秒后才生效）
			"exp" => time() + 2000, //token 过期时间
			'data' => $uid			//记录的userid的信息，这里是自已添加上去的，如果有其它信息，可以再添加数组的键值对
		);
		$jwt = JWT::encode($token, $key, "HS256");  //根据参数生成了 token
		return $jwt;
	}
}
/**
 * 验证token
 * $token 生成的token值
 */
 
if (!function_exists('checkToken')) {
	//验证token
	function checkToken($token)
	{
		$key = '!@#$%*&';
		$status = array("code" => 2);
 
		try {
			JWT::$leeway = 60; //当前时间减去60，把时间留点余地
			$decoded = JWT::decode($token, new Key($key, 'HS256')); //HS256方式，这里要和签发的时候对应
			$arr = (array)$decoded;
			$res['code'] = 1;
			$res['data'] = $arr['data'];
			return $res;
		} catch (SignatureInvalidException $e) { //签名不正确
			$status['msg'] = "签名不正确";
			return $status;
		} catch (BeforeValidException $e) { // 签名在某个时间点之后才能用
			$status['msg'] = "token未生效";
			return $status;
		} catch (ExpiredException $e) { // token过期
			$status['msg'] = "token失效";
			return $status;
		} catch (Exception $e) { //其他错误
			$status['msg'] = "未知错误";
			return $status;
		}
	}
}

3. 在控制器中使用

$openid = '123123123';
$token = signToken($openid); // 生成token

// 验证
$token = request() -> header('token');
$res = checkToken($token); // 验证token
if($res['code'] == 1){
	return '验证通过';
}else{
	return $res['msg'];
}

tp+vue项目中axios发送请求时在header中携带token报跨域错误解决方法

转自：thinkphp6解决vue跨域问题
原文链接：thinkphp6解决跨域 - 简书

1. 在app目录下新建middleware/AllowCrossDomain.php

declare (strict_types = 1);
 
namespace app\middleware;
 
use Closure;
use think\Config;
use think\Request;
use think\Response;
 
class AllowCrossDomain
{
 
    protected $cookieDomain;
 
    // header头配置
    protected $header = [
        'Access-Control-Allow-Credentials' => 'true',
        'Access-Control-Max-Age'           => 1800,
        'Access-Control-Allow-Methods'     => 'GET, POST',
        'Access-Control-Allow-Headers'     => 'Authorization, Content-Type, If-Match, If-Modified-Since, If-None-Match, If-Unmodified-Since, X-CSRF-TOKEN, X-Requested-With,token',
    ];
 
 
    /**
     * AllowCrossDomain constructor.
     * @param Config $config
     */
    public function __construct(Config $config)
    {
        $this->cookieDomain = $config->get('cookie.domain', '');
    }
 
    /**
     * 允许跨域请求
     * @access public
     * @param Request $request
     * @param Closure $next
     * @param array   $header
     * @return Response
     */
    public function handle($request, Closure $next, ?array $header = [])
    {
        $header = !empty($header) ? array_merge($this->header, $header) : $this->header;
 
        if (!isset($header['Access-Control-Allow-Origin'])) {
            $origin = $request->header('origin');
 
            if ($origin && ('' == $this->cookieDomain || strpos($origin, $this->cookieDomain))) {
                $header['Access-Control-Allow-Origin'] = $origin;
            } else {
                $header['Access-Control-Allow-Origin'] = '*';
            }
        }
 
        return $next($request)->header($header);
    }
}

2. 在app/middleware.php中新加以下内容
   

// 全局中间件定义文件
return [
    // 全局请求缓存
    // \think\middleware\CheckRequestCache::class,
    // 多语言加载
    // \think\middleware\LoadLangPack::class,
    // Session初始化
    \think\middleware\SessionInit::class,
    //跨中间件
    // \think\middleware\AllowCrossDomain::class,
    \app\middleware\AllowCrossDomain::class
];

vue+axios发送请求时设置header信息

// get
axios.get(url, {headers:{token: '123123'}})

// post
axios.post(url, data, {headers:{token: '123123'}})