ajax(코드 포함)를 사용하여 WeChat 웹페이지에 인증된 로그인을 구현하는 단계

이번에는 ajax를 사용하여 WeChat 웹페이지 인증로그인을 구현하는 단계(코드 포함)를 알려드리겠습니다. ajax를 사용하여 wechat 웹페이지 인증을 구현하는 데 필요한

주의 사항

은 무엇입니까? 바라보다.

프로젝트 배경

프로젝트는 프론트엔드와 백엔드가 완전히 분리된 솔루션을 채택하기 때문에 기존의 WeChat 인증 로그인 방식은 사용할 수 없으며, WeChat 인증 로그인을 구현하려면 ajax를 사용해야 합니다.

요구사항 분석

저는 phper이기 때문에 WeChat 개발은 EasyWeChat을 사용하므로 구현 방법은 EW를 기반으로 합니다.

사실 이를 구현하는 것이 번거롭습니다. 구현하기 전에 WeChat 인증의 전체 프로세스를 이해해야 합니다.
사용자를 인증 페이지로 안내하여 인증에 동의하고 코드를 받습니다
웹페이지 인증 access_token(기본 지원의 access_token과 다름)의 코드로 교환
필요한 경우 개발자 만료를 방지하기 위해 웹페이지 승인 access_token을 새로 고칠 수 있습니다
웹 페이지 승인 access_token 및 openid를 통해 사용자 기본 정보를 얻습니다(UnionID 메커니즘 지원)

사실, 직설적으로 말하면 프런트 엔드는 한 가지 작업만 하면 됩니다 , 사용자에게 WeChat 인증 페이지를 시작하도록 안내한 다음 코드를 얻은 다음 현재 페이지로 이동한 다음 사용자 및 기타 관련 정보에 대한 대가로 백엔드를 요청합니다.

기능 구현

사용자에게 WeChat 인증 확인 페이지를 불러오도록 안내

여기서 두 가지 작업을 수행해야 합니다. 먼저 jsapi 도메인 이름을 구성하고 두 번째로 WeChat 웹페이지 인증을 위한 콜백 도메인 이름을 구성합니다 "<a href="http://www.php.cn/wiki/373.html" target="_blank">https://</a>open.weixin.qq.com/connect/oauth2/authorize?appid=" + appId + "&redirect_uri=" + location.href.split('#')[0] + "&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect WeChat 인증 URL "<a href="http://www.php.cn/wiki/373.html" target="_blank">https://</a>open.weixin.qq.com/connect/oauth2 /authorize?appid= " + appId + "&redirect_uri=" + location.href.split('#')[0] + "&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect 연결을 보면 두 개의

변수

, appId 및 direct_uri. 말할 필요도 없이 appId는 우리가 승인할 WeChat 공식 계정의 appId입니다. 다른 콜백 URL은 실제로 사용자가 다시 호출할 URL입니다. WeChat으로 로그인이 승인되었습니다. 첫 번째는 코드이고 다른 하나는 상태입니다. 우리가 해야 할 일은 코드를 가져와서 백엔드에 전달하는 것입니다. 백엔드는 코드를 통해 사용자의 기본 정보를 얻을 수 있습니다.

1. 백엔드는 사용자의 기본 정보를 가져오고 기타 관련 정보를 프런트엔드에 반환한 다음 로컬 저장 또는 기타 작업을 수행합니다. 이 기사의 사례를 읽은 후 더 흥미로운 내용을 주목하세요. PHP 중국어 웹사이트의 다른 관련 기사
2. 추천 도서:

신분증 및 은행 카드 번호 형식을 결정하는 규칙 작성 방법

JS를 사용하여 0이 아닌 양의 정수를 확인하는 방법

위 내용은 ajax(코드 포함)를 사용하여 WeChat 웹페이지에 인증된 로그인을 구현하는 단계의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!