nginx 프록시를 사용하여 다양한 도메인 이름을 인증하는 WeChat 웹 페이지 지원

이 글에서는 주로 WeChat 웹페이지를 지원하여 다양한 도메인 이름을 인증하는 방법을 소개합니다. 이제는 필요한 친구들과 공유할 수 있습니다.

인정합니다. 제목. 이번에 프로젝트를 개발할 때 문제가 발생했습니다. m.baidu.com이라는 도메인 이름을 가진 yaf를 기반으로 한 두 개의 오래된 WeChat 프로젝트가 있었습니다(예를 들어). 그런 다음 웹 페이지 인증 도메인 이름을 입력하세요. 도메인 이름은 m.baidu.com이고 새로 개발된 프로젝트는 laravel 기반이므로 도메인 이름은 wechat입니다. .baidu.com, 그러나 웹페이지의 도메인 이름을 승인하면 어떻게 해야 합니까? 이것은 사기입니다. 물론 대부분의 사람들은 그런 고통스러운 일을 겪지 않을 것이다.

전제 조건

laravel5.5

php7.1.0

nginx1.10

overtrue/laravel-wechat

WeChat OAuth 이해

yaf，域名为m.baidu.com(做示例),然后网页授权域名填的是m.baidu.com，而这次新开发的项目是基于laravel,那么域名为wechat.baidu.com,但是网页授权域名怎么办，这就坑爹了。当然了，大部分人不会遇到这么蛋疼的事情吧。

前提

namespace App\Http\Middleware;


use Illuminate\Http\Request;
use Illuminate\Support\Facades\App;
use Illuminate\Support\Facades\Event;
use Overtrue\LaravelWeChat\Events\WeChatUserAuthorized;
use Overtrue\LaravelWeChat\Middleware\OAuthAuthenticate as BaseAuthenticate;

class OAuthAuthenticate extends BaseAuthenticate
{
   
   
    public function handle($request, \Closure $next, $account = 'default', $scopes = null)
    {
        // $account 与 $scopes 写反的情况
        if (is_array($scopes) || (\is_string($account) && str_is('snsapi_*', $account))) {
            list($account, $scopes) = [$scopes, $account];
            $account || $account = 'default';
        }

        $isNewSession = false;
        $sessionKey = \sprintf('wechat.oauth_user.%s', $account);
        $config = config(\sprintf('wechat.official_account.%s', $account), []);
        $officialAccount = app(\sprintf('wechat.official_account.%s', $account));
        $scopes = $scopes ?: array_get($config, 'oauth.scopes', ['snsapi_base']);

        if (is_string($scopes)) {
            $scopes = array_map('trim', explode(',', $scopes));
        }

        $session = session($sessionKey, []);

        if (!$session) {
            if ($request->has('code')) {
                session([$sessionKey => $officialAccount->oauth->user() ?? []]);
                $isNewSession = true;

                Event::fire(new WeChatUserAuthorized(session($sessionKey), $isNewSession, $account));

                return redirect()->to($this->getTargetUrl($request));
            }

            session()->forget($sessionKey);




            //本地和测试环境下使用这个
            if(App::environment()=='local' ||App::environment()=="test"){
                return $officialAccount->oauth->scopes($scopes)->redirect($request->fullUrl());
            }


            $query = $request->getQueryString();

            $question = $request->getBaseUrl().$request->getPathInfo() == '/' ? '/?' : '?';

            $url= $query ? $request->getPathInfo().$question.$query : $request->getPathInfo();

            $url="http://m.baidu.com".$url; //就这一步很重要
            
            return $officialAccount->oauth->scopes($scopes)->redirect($url);
        }

        Event::fire(new WeChatUserAuthorized(session($sessionKey), $isNewSession, $account));

        return $next($request);
    }

   
}

了解微信OAuth

这个过程必须要明白

感谢超神的图片

从流程我们可以看到，回调url域名其实就是我们的网页授权域名。那么既然这样我们是不是可以造个假呢，
在域名为wechat.baidu.com的项目下，我们也把网页授权域名写成m.baidu.com,然后再使用nginx做代理，基于location 转发到wechat.baidu.com下；

改写overtrue/laravel-wechat中间件

为什么要改写这个中间件呢，因为中间件默认会直接获取你的域名，所以如果我使用wechat.baidu.com,那么默认就会回调后跳转到wechat.baidu.com,而实际上我要跳转到m.baidu.com

在Middleware文件夹下新建一个中间件OAuthAuthenticate，并且继承 OvertrueLaravelWeChatMiddlewareOAuthAuthenticate;:

"wechat.oauth.baidu.com"=>OAuthAuthenticate::class

然后在kernel.php中的$routeMiddleware添加

     //在m.baidu.com域名配置下，设置location规则，所有router以/official_account开头的都去wechat.baidu.com下，然后设置跨域
     
     location /official_account/{
        add_header 'Access-Control-Allow-Origin' "$http_origin";
        add_header 'Access-Control-Allow-Methods' 'GET, POST, PUT, DELETE, OPTIONS';
        add_header 'Access-Control-Allow-Headers' 'DNT,X-Mx-ReqToken,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Authorization,X-CSRF-TOKEN,X-XSRF-TOKEN';
        add_header 'Access-Control-Allow-Credentials' 'true';
        if ($request_method = 'OPTIONS') {
                add_header 'Access-Control-Allow-Origin' "$http_origin";
                add_header 'Access-Control-Allow-Methods' 'GET, POST, PUT, DELETE, OPTIONS';
                add_header 'Access-Control-Allow-Headers' 'DNT,X-Mx-ReqToken,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Authorization,X-CSRF-TOKEN,X-XSRF-TOKEN';
                add_header 'Access-Control-Allow-Credentials' 'true';
                #add_header 'Access-Control-Max-Age' 1728000; # 20 天
                #add_header 'Content-Type' 'text/html charset=UTF-8';
                #add_header 'Content-Length' 0;
                return 200;
        }
    # 这下面是要被代理的后端服务器，它们就不需要修改代码来支持跨域了
        proxy_pass http://wechat.m.liaorusanshe.com;
        #       proxy_set_header Host $host;  
        proxy_redirect off;
        #proxy_set_header X-Real-IP $remote_addr; 
        #proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_connect_timeout 60;
        proxy_read_timeout 60;
        proxy_send_timeout 60;


    }

然后就可以在路由文件使用了，完工。

nginx 设置代理

这个觉得没有什么好讲的，其实原理很简单，直接上代码

         proxy_set_header Host $host;  
         proxy_set_header X-Real-IP $remote_addr; 
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;

这个代码配置参考了《Nginx配置实现CORS》,但是直接复制过来，配合proxy_pass会出现400 request header or cookie too large错误，　百度了一下"400 Bad Request  Request Header Or Cookie Too Large",>可以解决，就是如下三个设置有问题，去掉就好了：

rrreee

综合分析，应该是nginx在使用proxy_pass做跳转时，如果直接使用域名，且需要向后端提交当前访问的IP地址时，引发nginx的bug이 프로세스를 이해해야 합니다

멋진 사진 감사합니다

프로세스에서 우리는 콜백 url 도메인 이름은 실제로 우리 웹페이지의 승인된 도메인 이름입니다. 그렇다면 이 경우 거짓말을 할 수 있을까요?

도메인 이름이 wechat.baidu.com인 프로젝트 아래에는 웹페이지의 승인된 도메인 이름도 m.baidu로 기재합니다. .com을 선택한 다음 nginx를 프록시로 사용하고 위치를 기반으로 wechat.baidu.com으로 전달합니다. overtrue /laravel-wechat미들웨어를 다시 작성하세요

이 미들웨어를 다시 작성해야 하는 이유는 미들웨어가 기본적으로 도메인 이름을 직접 가져오므로 wechat.baidu.com을 사용하는 경우입니다. , 기본적으로 콜백 후에 wechat.baidu.com으로 이동하지만 실제로는 m.baidu.com로 이동하고 싶습니다. >In Middleware 폴더 아래에 새 미들웨어 OAuthAuthenticate를 생성하고 OvertrueLaravelWeChatMiddlewareOAuthAuthenticate;에서 상속합니다.rrreee
그런 다음 커널에서 .php $routeMiddleware에

rrreee

를 추가한 후 라우팅 파일에 사용하면 작업이 완료됩니다.

nginx 설정 프록시

이에 대해서는 별로 할 말이 없을 것 같습니다. 사실 원리는 매우 간단합니다. 코드를 직접 입력하면 됩니다.rrreee
이 코드 구성은 다음을 참조합니다. "CORS를 구현하기 위한 Nginx 구성"이지만 proxy_pass와 결합하면 400 요청 헤더 또는 쿠키가 너무 큼 오류가 나타납니다. code>"400 잘못된 요청 헤더 또는 쿠키가 너무 큼", > 설정을 제거하세요.

rrreee🎜종합적으로 분석하면 proxy_pass를 사용하여 점프할 때 도메인 이름이 직접 사용되고 현재 IP 주소가 있는 경우 nginx여야 합니다. 액세스 중인 항목을 백엔드에 제출해야 하면 nginx의 버그가 발생합니다. 이런 상황을 겪은 사람이 있는지 모르겠습니다. 🎜🎜그런 다음 다시 시작하면 완료됩니다. 🎜🎜위 내용은 이 글의 전체 내용입니다. 모든 분들의 학습에 도움이 되었으면 좋겠습니다. 더 많은 관련 내용은 PHP 중국어 홈페이지를 주목해주세요! 🎜🎜관련 권장 사항: 🎜🎜🎜Nginx 포트 매핑 구성🎜🎜🎜🎜🎜Nginx 배포 정적 페이지🎜🎜🎜

위 내용은 nginx 프록시를 사용하여 다양한 도메인 이름을 인증하는 WeChat 웹 페이지 지원의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!