Scannen Sie den QR -Code auf dem PC, um sich zu registrieren, und melden Sie sich an
1. Vorwort
Lassen Sie mich zunächst feststellen, dass der Schwerpunkt dieses Artikels auf Implementierungsideen liegt und der Code- und Datenbankdesign hauptsächlich auf Ideen angezeigt wird. Wenn Sie strenge Anforderungen an die Codeeffizienz haben, kopieren Sie sie nicht.
Ich glaube, dass Menschen, die die WeChat -Entwicklung durchgeführt haben, viele Genehmigungen vorgenommen haben, aber im Allgemeinen autorisieren wir mehr mobile Websites, oder eher eine Genehmigung im WeChat -Terminal. Ein Problem, auf das ich heute gestoßen bin, ist, dass das Projekt WeChat- und PC -Terminals unterstützt und die Registrierung eröffnet. Es ist erforderlich, sich am anderen Ende anzumelden, unabhängig davon, ob Sie sich auf dem PC oder auf der WeChat -Seite registrieren. Mit anderen Worten, ob es sich um PC oder WeChat handelt, müssen Sie "Sie sind Sie" (in irgendeiner Weise verwandt).
2. Finden Sie eine Lösung
Wenn Sie auf die traditionelle Weise denken, kann die WeChat -Seite durch Autorisierung registriert werden, aber auf der PC -Seite ist der traditionelle Weg nichts anderes, als die Mobiltelefonnummer oder E -Mail usw. auszufüllen. Wenn Sie sich auf diese Weise registrieren, wird das folgende Problem auftreten
1. Ich autorisiere die Registrierung auf der WeChat -Seite. Wenn ich mich also auf der PC -Seite anmelden möchte, muss ich mich noch registrieren.
Diese Lösung kann sein: Nach der Registrierung der WeChat -Autorisierung ist es "gezwungen", Benutzer zu verlangen, dass sie grundlegende Informationen wie Mobiltelefonnummer und E -Mail ausfüllen. Auf diese Weise können wir das Kontokennwort generieren, damit sich der Benutzer auf irgendeine Weise beim PC anmelden kann. Verwenden Sie beispielsweise den Spitznamen des Benutzers als Konto, die Mobiltelefonnummer als Passwort usw.
Nachteile: Die Benutzererfahrung ist nicht gut und es gibt auch Sicherheitsrisiken. Schließlich sind Ihr WeChat -Spitzname, E -Mail oder Mobiltelefonnummer freigelegt.
2. Wenn ich mich zuerst auf dem PC registriere, wie stehe ich dann eine Verbindung zum mobilen Terminal, wenn ich auf WeChat autorisiere? Natürlich wird es immer Lösungen für ein Problem geben. Die Idee ist wie folgt:
Lösung 1: Nachdem sich der Benutzer auf dem PC registriert hat, muss der Benutzer "Force" den WeChat -Spitznamen ausfüllen. Dies wird als relevante Bedingung für die WeChat -Genehmigung verwendet. Aber leider kann der WeChat -Spitzname geändert werden, aber es ist nicht der einzige, wie kann er verwendet werden, um Assoziationen herzustellen? Der Plan wurde in einer verzweifelten Situation getötet.
Plan 2: Nach der Autorisierung auf der WeChat -Seite und der Registrierung auf der PC -Seite müssen Benutzer ihre Mobiltelefonnummern als Link ausfüllen. Dies führt zu einem Problem und es ist notwendig, die Authentizität des Mobiltelefons des Benutzers zu gewährleisten, und es gibt kein Problem. Dies kann über den Mobiltelefonüberprüfungscode erreicht werden (dasselbe gilt für E -Mails). Aber Sie können genauso gut annehmen, dass die folgende Situation vorhanden ist. Wenn ich zwei Mobiltelefonnummern habe, füllen Sie bei der Registrierung auf dem PC und einer anderen bei der Registrierung bei WeChat eine ein. Ist es verwandt? Die Antwort ist schade. Nachdem ich mich auf dem PC registriert hatte, habe ich es einfach nicht ausgefüllt (der Grund, warum ich die Doppelzitate erzwungen habe), und dann habe ich die WeChat -Autorisierung verwendet, um mich anzumelden. Diese Methode funktioniert in gewissem Maße, ist jedoch für Entwickler inakzeptabel, streng zu sein.
3. Lösung zur Rückkehr zum Ursprung
Analyse: Da es alle Probleme mit den oben genannten Lösungen gibt, legen wir sie zuerst beiseite. Setzen Sie einige Gedanken zurück in die Wurzel des Problems. Das damit verbundene Problem erfordert eine eindeutige Kennung. Die eindeutige Identifikation ist genau wie unsere ID -Nummer. Wenn wir eine Kreditkarte beantragen, ist die ID -Karte erforderlich. Wenn Sie eine Nummernkarte unter dem richtigen Namenssystem kaufen, ist die ID -Karte erforderlich. Angenommen, wir sind die Systemadministratoren, dann kann ich Ihre Mobiltelefonnummer und Bankkartennummer über Ihre ID -Nummer herausfinden.
Mit der obigen Idee müssen wir nur eine einzigartige Kennung finden, die zugeordnet ist. WeChat gibt es eine wichtige Rolle. Es hat diese gemeinsame Funktion mit der oben erwähnten ID -Nummer, der eindeutigen Identifizierung eines bestimmten offiziellen Kontos durch das WeChat -Konto.
Die Genehmigung von WeChat steht OpenID zur Verfügung. Jeder, der die WeChat -Entwicklung gemacht hat, sollte kein Problem haben. Die Frage ist, wie das PC -Terminal bei der Registrierung oder Anmeldung von PC -Terminal erreicht werden kann. Die Implementierungsidee des Autors lautet wie folgt. Registrieren Sie sich auf dem PC oder zeigen Sie einen QR -Code an, wenn Sie sich anmelden, den Benutzer zum Scannen des Codes mit WeChat, damit er auf die Autorisierungsseite springt. Dieser Schritt hat das kritischste Detail. Bitte bringen Sie einen eindeutigen Autorisierungscode (AuthCode) in den QR -Code ein. Stellen Sie sich vor, der Benutzer autorisiert uns, OpenID und Authcode in die Datenbank zu schreiben. Anschließend können wir die mit AuthCode zugeordnete OpenID über eine API auf der PC -Seite erhalten. Wenn wir dies tun, können wir wissen, wer derzeit den Code scannt, um sich auf dem PC zu registrieren oder anzumelden (registrieren Sie sich, falls sie registriert sind, und wer auch immer registriert hat, wird sich direkt anmelden). Fühlen Sie sich plötzlich so einfach? Wenn Sie der Meinung sind, dass der Text abstrakter ist, finden Sie das folgende Bild
PC WeChat Scan -Code -Anmeldeprozess
Kerncode
Lassen Sie uns nach der Klärung der Ideen und Prozesse den Code direkt hochladen. Die Entwicklungsideen sind weit verbreitet. Bitte zeigen Sie Ihre magischen Kräfte bei der Entwicklung der Sprache.
HINWEIS: Der folgende Code nimmt C# Sprache als Beispiel und verwendet MVC + EF (Hinweis: UUID entspricht unserem AuthCode oben)
Scannen Sie den Code, um sich bei der Hintergrundseite anzumelden
public actionResult login () {// Wenn Sie angemeldet sind, springen Sie direkt zur Homepage, wenn (user.identity.isauthenticated) retourectToAction ("Index", "Home"); String url = request.url.host; String uUid = Guid.Newguid (). toString (); Viewbag.url = "http: //" + url + "/home/loginfor?
Der QR-Code wird mit dem Plug-in jQuery.qrcode.js generiert. Wenn Sie mehr wissen möchten, wechseln Sie bitte zu GitHub. Eine Sache, die hier zu beachten ist, ist, dass dieses Plugin die Erzeugungsmethode von QR -Code, Leinwand oder Tabelle angeben kann. Bitte geben Sie die Verwendung der Tabellengeneration für Freunde an, die IE unterstützen.
Der Code ist wie folgt:
jQuery ('#qrCode').Kehren Sie zum Thema zurück, der Hauptcode der Anmeldeseite ist wie folgt
<!-Container zum Generieren von QR-Code div-> <div id = "qrCode-container"> </div> <script src = "~/plugins/jQuery/jQuery.9.1.min.js"> </script> <script src = "~/plugins/jquery-Qrcode/jquery. () {// QR-Code jQuery ('#QRCode-Container'). QRCode ("@viewbag.url"); Status) {if ("Success" == Status) {// Benutzererfolgsautorisierung => Sprung if ("Erfolg" == Data) {Window.Location
Umfrage, um festzustellen, ob der Benutzer den API -Code autorisiert
public String userLogin (String uUid) {// Überprüfen Sie, ob der Parameter legal ist, wenn (string.isnullorempy (uUid)) return "param_error"; WX_USERRECORD User = db.wx_uSerrecord.where (u => u.uUid == uUid) .FirstOrtefault (); if (user == null) return "not_authcode"; // Cookie formsAuthentication.setAuthcookie (user.openid, false) schreiben; // uUid user.uuid = null; db.savechanges (); zurück "Erfolg";}WeChat -Autorisierungsaktion
public actionResult loginfor (string uUid) {#region grundlegende Informationen erhalten - SNSAPI_USERINFO / * * WeChat General Class erstellen - Der Code ist hier komplizierter und nicht hier veröffentlicht. // WeChat General Class verwenden, um grundlegende Benutzerinformationen wxContext.getUserinfo () zu erhalten; if (! string.isnullorEmpty (wxContext.openid)) {uUid = request ["Status"]; // Beurteilen Sie, ob die Datenbank vorhanden ist wx_userrecord user = db.wx_usereRecord.where (u => u.OPenid == WXContext.openid) .FirstordeFault (); if (null == user) {user = new WX_USERRECORD (); user.openid = wxContext.openid; user.city = wxContext.city; user.country = wxContext.country; user.createTime = datetime.now; user.headimgurl = wxContext.headimgurl; user.nickname = wxcontext.nickname; user.province = wxContext.province; user.sex = wxContext.sex; user.unionId = wxContext.unionId; user.uuid = uUid; DB.WX_USERRECORD.ADD (Benutzer); } user.uuid = uUid; db.savechanges (); } #endregion return view ();}
Schließlich ist das Design der Datenbanktabelle beigefügt
Es gibt nichts Besonderes, wir fügen für jeden von WeChat zurückgegebenen Parameter eine weitere benutzerdefinierte UUID hinzu.
Weitere Informationen zur Beschreibung der WeChat -Parameter finden Sie in der WeChat Developer -Dokumentation
Laufeffekt
1. Scannen Sie den QR -Code, um sich bei der Seite anzumelden
2. Anfrage der Benutzerautorisierung
3. Benutzer bestätigt die Autorisierung
4. Die PC -Login ist abgeschlossen
Es gibt unweigerlich Mängel in dem Artikel, bitte vergib mir. Wenn Sie Fehler finden, hinterlassen Sie bitte eine Nachricht, um sie zu verweisen. Ich bin sehr dankbar! Scannen Sie den QR -Code auf WeChat, um sich zu registrieren und sich bei der Demo anzumelden. Nachdem der Autor ausgebildet ist, setzen Sie es auf GitHub. Ich hoffe, mehr Freunden zu helfen. Bitte achten Sie auf die Aktualisierung dieses Artikels.
Die oben genannten Beispiele für das Scannen des QR -Codes auf WeChat auf dem PC. Freunde in Not können sich darauf beziehen. Vielen Dank für Ihre Unterstützung für diese Seite!