Leistungsmanagementsystem für Online-Lernkurse basierend auf dem öffentlichen WeChat-Konto (node.js + webpack)

Ein offizielles WeChat-Konto-Full-Stack-Projekt

Fügen Sie hier eine Bildbeschreibung ein

Technologie-Stack

NodeJS, Koa, ReactJS, Webpack, Mokka, Front-End- und Back-End-Trennung

Entwicklungswerkzeuge

Webstorm, Ngrok, Chrome, WeChat Web-Debugging-Tools

Einführung in die Architektur

Fügen Sie hier eine Bildbeschreibung ein

Im offiziellen Konto von WeChat gibt es zwei Formen der Interaktion: Eine ist eine normale Nachrichtensitzung und die andere ist eine Webseite im offiziellen Konto. Einige Dienste sind identisch, z. B. die
Abfrage des Unterrichtsplans, die in der Nachricht abgefragt werden kann Sitzung oder in der Webseitenanzeige, um die Veröffentlichung des Codes zu realisieren, wird speziell die Geschäftsschicht extrahiert, die WeChat-Nachrichtensitzung wird von der Nachrichtenanalyse-Middleware analysiert und dann an die Nachrichtenversand-Middleware übergeben, um die entsprechende aufzurufen Geschäftsmodul zur Verarbeitung. Das Web in WeChat ruft das entsprechende Geschäftsmodul über die API-Route auf.

Die Message-Parsing-Middleware (Message-Parsing-Transceiver-Modul) istco-wechat
Die Nachrichtenversand-Middleware (Modul zur automatischen Nachrichtenantwort) ist/server/wechat_robot.js
Das Geschäftsmodul ist/server/api/*.js
Routing ist/server/router/*.js

Einführung in den WeChat-Benutzerauthentifizierungsprozess

Die Benutzerauthentifizierung und das Routing erfolgen am Frontend. Informationen zur Implementierung finden Sie unter „react-router/examples/auth-with-shared-root“
. Die Benutzerauthentifizierung von WeChat-Nachrichten ist relativ einfach. Verwenden Sie einfach die OpenID direkt in der Nachricht.
Und die Die Authentifizierung von Webseitenbenutzern in der WeChat-Authentifizierung ist komplizierter. Wenn ein Benutzer auf unsere Webseite klickt, woher wissen wir dann, welcher Benutzer darauf geklickt hat?

Die einfachere Methode besteht darin, der Seiten-URL einen Parameter hinzuzufügen ?openid=123456und dann die OpenID zur Unterscheidung von Benutzern zu verwenden. Guangke Xiaomao macht dies. Der Nachteil ist, dass die Sicherheit nicht gut ist und die OpenID nicht durchgesickert sein kann. Der andere ist, dass der Benutzer klickt Im benutzerdefinierten Menü können Sie die Seite nicht direkt aufrufen, da kein openid-Parameter vorhanden ist. Sie müssen einen URL-Link mit einem openid-Parameter zurückgeben, damit der Benutzer aktiv darauf klicken kann.
Die Standardmethode besteht darin, den OAuth-Prozess von WeChat zu verwenden, zuerst zur OAuth-Seite von WeChat zu springen und dann mit einem Codeparameter zurückzuspringen, dann den Codeparameterwert zu verwenden, um die OpenID und das Dokument abzurufen, und dann die OpenID zum Abrufen zu verwenden Der Benutzer bindet die Tabelle an Benutzerinformationen und speichert sie schließlich in der Sitzung.

Wir verwenden die Standardmethode und erwarten auch, dass diese Webseiten ohne WeChat angemeldet und normal verwendet werden können. Der spezifische Prozess ist in der folgenden Abbildung dargestellt.
Fügen Sie hier eine Bildbeschreibung ein

Datenbank

Das bestehende System verwendet SQLServer, wir verwenden weiterhin SQLServer, verwenden Node-MSSQL + Mühsam , um
gängige Methoden gleichzeitig zu verbinden und zu kapseln, siehe /server/database/index.js
Später fanden wir heraus, dass es einen vorgefertigten Co-Warpper gibt

wie man es bereitstellt

Theoretisch gibt es keine bestimmte Geschäftsdatenbank, die nicht normal verwendet werden kann ...
Schreiben Sie eine theoretische Verwendungsmethode.
Modify server/config/config.js
Modify server/config/key.js
Run ngrok ./ngrok -config ngrok.cfg -subdomain wencheng 3000
run server cd server; npm install; nodeman app.js
run clientcd client; npm install; npm start

Bezogen auf die WeChat-Entwicklung

Drei-Parteien-Bibliothek

Rock

ngrok ist ein Reverse-Proxy, eine Brücke zwischen dem WeChat-Server und der lokalen Entwicklungsumgebung

Ressource

Empfohlene Lernressourcen

Im Folgenden finden Sie viele Informationen, die ich beim Erlernen dieser Sprachframeworks gefunden habe, und die Ressourcen sind sehr hilfreich.