前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >vue 与thinkphp跨域

vue 与thinkphp跨域

作者头像
BinGo_Blog
发布2022-11-01 16:40:07
4700
发布2022-11-01 16:40:07
举报
文章被收录于专栏:BinGo's BlogBinGo's Blog

原因

1、浏览器限制

2、跨域(域名,端口不一样都是跨域)

3、XHR(XMLHttpRequest请求)

同时满足三个条件才有可能产生跨域问题。

>利用钩子函数解决

1.在app\common\behavior\CORS

代码语言:javascript
复制
<?php
namespace app\common\behavior;
use think\Request;
use think\Response;

/**
 * ${PARAM_DOC}
 * @return ${TYPE_HINT}
 * ${THROWS_DOC}
 * Date: 2021/3/24 18:01
 */
class CORS{
    public function run()
    {
        // 响应头设置 我们就是通过设置header来跨域的 这就主要代码了 定义行为只是为了前台每次请求都能走这段代码
        $host_name = isset($_SERVER['HTTP_ORIGIN']) ? $_SERVER['HTTP_ORIGIN'] : "*";
        header("Access-Control-Allow-Origin:*");
        header('Access-Control-Allow-Headers: content-type,token');
        header('Access-Control-Allow-Methods:*');
        header('Access-Control-Allow-Headers:token,Origin,X-Requested-With,Content-Type,content-type,Accept,Authorized-Token,Authori-zation,Authorization,authorized-token,If-Match, If-Modified-Since, If-None-Match, If-Unmodified-Since');
        header('Access-Control-Allow-Credentials:false');
        if (request()->isOptions()) {
            exit();
        }
    }
}

2.将tags.php

代码语言:javascript
复制
return [
    // 应用初始化
    'app_init'     => [],
    // 应用开始
    'app_begin'    => [
        'app\\common\\behavior\\CORS'
    ],
    // 模块初始化
    'module_init'  => [],
    // 操作开始执行
    'action_begin' => [],
    // 视图内容过滤
    'view_filter'  => [],
    // 日志写入
    'log_write'    => [],
    // 应用结束
    'app_end'      => [
        'app\\common\\behavior\\CORS'
    ],
];

常见解决方法

代码语言:javascript
复制
if($_SERVER['REQUEST_METHOD'] == 'OPTIONS'){
    header('Access-Control-Allow-Headers: content-type,token');
    //允许的源域名
    header("Access-Control-Allow-Origin:*");
    //允许的请求头信息
    header("Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept, Authorization");
    //允许的请求类型
    header('Access-Control-Allow-Methods: GET, POST, PUT,DELETE,OPTIONS,PATCH');
    exit;
}
本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档