최근에는 스캔 코드 로그인 기능을 작업 중인데, 이런 이유로 위챗 스캔 로그인 구현 방법에 대해서도 온라인으로 검색해 봤습니다. 이 기능이 완료되었을 때 나는 나 자신의 편의와 비슷한 요구 사항을 가진 다른 프로그래머를 위해 전체 구현 아이디어를 정리하기로 결정했습니다.
스캐닝 코드 로그인을 실현하려면 두 가지 문제를 해결해야 합니다.
1. 사용자 이름과 비밀번호를 입력하지 않고 권한 보안 문제를 해결하는 방법은 무엇입니까? 즉, QR 코드를 스캔하는 클라이언트가 합법적인 사용자임을 서버에 어떻게 알릴 수 있을까요?
2. 클라이언트에서 사용자의 선택에 따라 서버는 실시간으로 웹페이지에 어떻게 응답하나요?
먼저 이 문제를 해결하기 위한 사고 방향을 이해할 수 있도록 위챗의 구현 아이디어를 정리해보자. 위챗 로그인용 QR코드는 사실 URL을 QR코드로 변환하는 형태인데, 위챗 클라이언트를 통해 코드를 스캔한 뒤, 제가 캡쳐한 위챗 QR코드의 URL은 https://입니다. /login.weixin.qq.com/l/YdmTu30I5A==, 이 URL의 YdmTu30I5A==는 이 세션의 고유 ID를 나타냅니다. 이는 브라우저의 세션 ID와 다소 유사합니다. 이 ID를 통해 WeChat은 피드백을 전달할 수 있습니다. 확인 결과를 웹페이지로 전송합니다. WeChat QR 코드 로그인 기능을 사용하려면 두 가지 전제 조건이 있습니다. 먼저 클라이언트에 WeChat 앱을 설치해야 합니다. 둘째, 사용자는 WeChat 앱에 로그인해야 합니다. https://wx.qq.com/
Python Websocket 메시지 푸시
왜 이 두 가지 조건이 필요한가요? 왜냐하면 WeChat에서 웹 버전 로그인 허용 여부를 확인할 때 WeChat에서는 현재 앱의 로그인 정보를 추출하여 위 세션 ID를 서버로 보내야 서버가 로그인 정보와 세션을 받은 후 두 가지를 확인할 수 있기 때문입니다. ID: 하나는 로그인한 클라이언트 사용자가 인증되었는지 확인하는 것이고, 다른 하나는 세션 ID 서버를 사용하여 피드백 결과를 푸시할 웹 페이지를 아는 것입니다.
따라서 첫 번째 요점은 스캔하기 전에 사용자가 확인되고 합법적인 사용자인지 확인하는 것입니다(확인 방법은 사용자 이름 + 비밀번호 또는 보안 키일 수 있음). 이 결과를 서버에 로그인할지 여부를 선택할 때 사용자가 적법 여부를 확인하지 않는 경우 QR 코드를 인식할 수 없다고 사용자에게 직접 알리거나 위챗처럼 먼저 앱에 로그인하라는 메시지를 표시할 수 있습니다.
신원 확인을 통해 이제 두 번째 문제인 피드백 결과를 웹 페이지에 실시간으로 표시하는 방법을 해결해 보겠습니다. 어떤 친구들은 클라이언트가 백그라운드로 요청을 보내는 것이 쉽다고 말할 수도 있지만, 웹 페이지에서는 ajax를 사용하여 정기적으로 서버에 보내 피드백이 있는지 확인합니다. 나는 Ajax 폴링 방법이 클라이언트와 서버 리소스를 소비하기 때문에 이 접근 방식에 동의하지 않습니다! 여기에는 또 다른 기술인 웹 실시간 푸시 기술이 포함됩니다. 푸시 기술을 사용하면 서버 측 및 클라이언트 측 리소스를 절약할 수 있으며 모든 메시지를 안정적으로 푸시하고 수신할 수 있습니다. 구현 과정에서 타사 푸시 서비스인 GoEasy 푸시를 사용했습니다. 구현이 매우 간단합니다. 프로젝트의 다른 기능도 GoEasy 웹 실시간 푸시 서비스를 사용하므로 여기서는 GoEasy 푸시를 직접 사용합니다. 로그인 피드백 결과를 서버에 보냅니다. 내 구현 단계는 매우 간단합니다. 전송된 세션 ID를 클라이언트와 웹 페이지 간의 통신 채널로 사용합니다. 웹 페이지는 세션 ID를 값 채널로 구독합니다. 서버는 이 채널을 사용하여 결과를 웹 버전으로 적극적으로 푸시할 수 있습니다! 클라이언트도 해당 피드백을 제공해야 하는 경우 클라이언트는 이 채널을 구독하기만 하면 됩니다. 그러면 서버는 메시지를 받은 후 결과를 웹 버전과 클라이언트에 동시에 푸시할 수 있습니다. 필요에 따라 goeasy의 콜백 함수를 여기에서 수행하세요. goeasy 푸시 사용에 대해서는 다음 블로그를 참조하세요: http://www.cnblogs.com/jishaochengduo/articles/5552645.html 또한 GoEasy 푸시 공식 웹사이트인 GoEasy QR 코드에도 데모가 있습니다. 스캔로그인데모 다들 가서 보시면 효과 보실수 있어요