自学内容网 自学内容网

ThinkPhp项目解决静态资源请求的跨域问题的解决思路

背景:我在前端使用vue语言开发的,请求的后端是用ThinkPhp项目开发的。我vue项目里的请求php接口,自带header参数的跨域问题通过网上查询到的server端配置方法已经解决了。我使用的

是中间件的配置方法:

<?php

//admin 项目 配置中间件
use app\admin\middleware\MyCrossDomain;

return [
     MyCrossDomain::class
]; 

 MyCrossDomain.php

<?php
namespace app\admin\middleware;

use Closure;
use think\Config;
use think\Request;
use think\Response;

/**
 * 跨域请求支持
 */
class MyCrossDomain
{
    protected $cookieDomain;

    protected $header = [
        'Access-Control-Allow-Credentials' => 'true',
        'Access-Control-Max-Age'           => 1800,
        'Access-Control-Allow-Methods'     => 'GET, POST, PATCH, PUT, DELETE, OPTIONS',
        'Access-Control-Allow-Headers'     => 'Authorization, Code,Content-Type, If-Match, If-Modified-Since, If-None-Match, If-Unmodified-Since, X-CSRF-TOKEN, X-Requested-With',
    ];

    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 $request, Closure $next, array $header = []): Response
    {
        $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 || str_contains($origin, $this->cookieDomain))) {
                $header['Access-Control-Allow-Origin'] = $origin;
            } else {
                $header['Access-Control-Allow-Origin'] = '*';
            }
        }

        return $next($request)->header($header);
    }
}

这样之后前端项目通过axios接口请求不再报跨域的错了,这一阶段的问题已经解决。

现在有一个新的问题,我在Thinkphp项目里有一个静态的json文件,H5要通过<link>的方式要请求它。类似这样的:

   document.write("<link rel='manifest' href='https://landpage-server.appboost.co/admin/file/xxxxx/xxxx.json');

虽然我的ThinkPhp项目已经配置了跨域的,但是对于请求这个静态文件还是报跨域的问题。折腾了好久,各种配置还是不行。最后我尝试了一种办法,就是专门写一个Controller来响应静态文件的返回。代码如下:

StaticResourceController.php

<?php

namespace app\admin\controller;

use app\admin\model\LogEvents;
use app\admin\model\PixelInfo;
use app\admin\model\ReleasePlatform;
use app\admin\model\ReleaseUrl;
use app\admin\model\User;
use app\admin\model\Wallet;
use app\admin\model\WalletLog;
use app\BaseController;
use app\Response;
use Ramsey\Uuid\Uuid;
use think\facade\Console;
use think\facade\Db;

class StaticResourceController extends MBaseController{
     public function getManifestJson(){

            $company_code = input("get.code");
            $promote_code = input("get.id");


            // echo root_path();
      

            $root =  root_path();
            $dir = $root ."public/page/";

            // echo $dir;

            $content = $this->openFile($dir,$company_code,$promote_code);

            $obj = json_decode($content);
            return json($obj, 200);
     }


     public function openFile($dir, $company_code,$promote_code){
        $filePath = $dir.$company_code."/".$promote_code.".json"; // 文件路径
        $mode = 'r'; // 打开模式
        
        $fileHandle = fopen($filePath, $mode);

        $content = fread($fileHandle, filesize($filePath));
        
        if ($fileHandle === false) {
            die('无法打开文件');
        }
        
        fclose($fileHandle);

        return $content;
    }
}

H5端请求是这样的:

   document.write("<link rel='manifest' href='https://landpage-server.appboost.co/admin/staticResource/getManifestJson?

code="+$company_code+"&id="+$promote_code+"'>");

谢天谢地,终于不报跨域的问题了,成功拿到了json静态文件。


原文地址:https://blog.csdn.net/nnmmbb/article/details/145227747

免责声明:本站文章内容转载自网络资源,如本站内容侵犯了原著者的合法权益,可联系本站删除。更多内容请关注自学内容网(zxcms.com)!