thinkphp5 关于跨域的一些坑，附上解决办法（比较全面了）

前几天写过一次，而后被管理员移出首页了，缘由是写的很差。。。。哈哈确实也很差，并且我按我本身的博客来从新操做，发现。。。还有有跨域问题！，惭愧惭愧，并且当我从新在百度搜索的时候发现，，，我这文章居然显示在第一条。。。

为了避免误人子弟，通过各类查找各类搜索，现从新整理出跨域解决方案，我以为应该是市面上比较详细的了吧，开始：

项目背景：前端是uniapp开发的h5，后端是tp5，其余语言我以为应该大同小异，主要是思路，本文就以这俩为例吧

 

一、首先在tp5的入口文件：public/index.php 在里面添加三行：

// [ 应用入口文件 ]

header("Access-Control-Allow-Origin:*");
header("Access-Control-Allow-Methods:GET, POST, OPTIONS, DELETE");
header("Access-Control-Allow-Headers:x-requested-with, Referer,content-type,token,DNT,X-Mx-ReqToken,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type, Accept-Language, Origin, Accept-Encoding");
// 不用多说，就是上面三行，注意第三行，里面有一个参数：token，这个是为后面自定义header头准备的

// 定义应用目录
define('APP_PATH', __DIR__ . '/../application/');
// 加载框架引导文件
require __DIR__ . '/../thinkphp/start.php';

这样就能够了，在tp5的方面就弄完了，没错，就是这么简单~并且通常百度能搜索到的，就是这些~

通常状况下这样也就好了，可是有的时候还会存在跨域，缘由就是前端请求的时候有一个地方须要注意

 

二、前端uniapp的网络请求用的是uni.request，不论是uni.request仍是jq的ajax，都同样，都须要注意一点，就是请求类型不能是application/json！！

uni.request({
　　url: 'http://test-tp5.io',
　　data: {a:1,b:2},
　　header: {
	'content-type': 'application/x-www-form-urlencoded', // 用这个！
	// 'content-type': 'application/json', 这里是反面举例，必定不要用这个！不信你试试！
	'token': 'this is token'  // 看到这个token了没有，它在在第一步的第三行出现过~
　　},
　　method: 'POST',
　　success: (res)=> {
　　　　console.log('成功了：',res);
　　},
　　fail: (res)=>{
　　　　console.log('出错了：',res);
　　}
});

header中全部自定义的参数，都要写在第一步中的第三行里面，要否则就等着跨域吧~

OK，到这绝大部分到这也就没有问题了~可是！鄙人就是这么的不同凡响！没错，当我弄到这的时候！我又跨域了！想哭了~

一开始个人开发环境是phpstudy，在到这一步的时候，跨域问题已经消失的无影无踪了，而后前几天我换成了docker，而后久违的跨越又来了。。。

并且跨域的缘由是自定义header参数，即若是我把request里面的token参数去掉，请求是正常的，加上就不行了！

此时通过对比我发现，phpstudy我用的是apache，docker我用的是nginx，并且当我把项目迁到phpstudy的时候就没有跨域问题，此时问题缘由显而易见！

 

三、通过搜索、测试，现得出在nginx下如何配置跨域的自定义header参数

在站点配置文件中 location / {} 里面添加下面几行：

location / {
　　　　if ($request_method = 'OPTIONS') {
            # 【必须】建议在发布环境用域名而不是“星”号
            add_header Access-Control-Allow-Origin '*';
            # Allow-Headers 指定容许的自定义请求头，如用户 Token，并且这些不用写那么多，只写自定义的参数就能够
            add_header Access-Control-Allow-Headers 'token';
            # 通常来讲在 POST 请求时由于 Content-Type 的缘由在本次 OPTIONS 预请求后，
            # 会再发送的 POST 请求，而 POST 请求是能够正常接收的
            # add_header Access-Control-Allow-Methods 'GET, POST, PUT, DELETE, PATCH, OPTIONS';
            # 请求是否携带 Cookie，无须要可忽略。有说该设置为 true 时 Allow-Origin 不可为 '*'
            # add_header Access-Control-Allow-Credentials true;
            # 这个响应 Content-Type 也是根据须要设置（通常状况能够不用设置）
            # add_header Content-Type 'application/json; charset=utf-8';
            # 以下 Content-Length 可忽略，返回状态码根据我的习惯可设置为 200
            add_header Content-Length 0;
            return 204;
        }
　　　　　# 没错，为了方便大家对比，上面这些才是要添加的
　　　　　# 并且大家可能发现了，我上面有好多注释掉的，由于这些是我在搜索出来的，并且通过我一步步的注释，发现只要一开始的两行和最下面的两行就能够了

        if (!-e $request_filename) {
            rewrite  ^(.*)$  /index.php?s=/$1  last;
            break;
        }
}

至此才是真正的解决了跨域的问题，多是apache默认配置了的缘由，apache不用配置这第三步

 

四、为啥还有第4步？？？

这第4步算是一个小提醒吧，就是tp程序不要报错。。。由于当tp5抛出异常的时候，会影响你public/index.php中的配置，致使产生跨域~

 

tip:不知道这篇文章还能不能回到首页，哈哈~~