vue nodejs elementUI mysql express demo

VUE-NODEJS-ELEMENTUi-MYSQL-EXPRESS-DEMO

VUE+NODEJS FRONT -AND- UND BACK -AND -END -Trennungselemente, lernen und verwenden, grundlegende Einstiegsvorgänge enthalten. Einschließlich einiger Probleme, die vom Beginn des Projekts bis zum endgültigen Bereitstellungsprozess auftreten.

Projektvorschau-Adresse: Vorschau-Adresse-Aixiaodou.cn

Überprüfung Adresse: Personal Blog- https://blog.csdn.net/qq_32442967/artail/details/103459148

Datenbankadresse: Express-Demo/doc/Demo2.SQL

MySQL -Datenbank

Die Datenbank ist Demo2

Erstellen Sie Demo2 -Datenbank> SQL -Anweisung ausführen

Ändern Sie die Konfiguration von Modell/conndb.js Datenbankverbindung im Express-Demo-Projekt

Express-Demo-Web: Das Front-End-Webprojekt

 # 安装依赖
npm install

# 运行项目
npm run dev

Express-Demo: Das Back-End-NodeJS-Projekt

 # 安装依赖
npm install

# 运行项目
npm start

---

Dieses Projekt handelt

Hauptnutzungstechnologie:

• Frontend: Vue+ ElementUi+ Axios+ Vue-Cli+ Webpack+ Vue-Router+ Vuex+ JS-Cookie
• Back End: NodeJS+ Express+ JsonWebtoken
• Datenbank: MySQL
• Bereitstellungsumgebung: Nginx
• Bereitstellungsserver: Linux CentOS7

Bestehende Funktion Einführung:

1. Toolsdown Tool Download Modul: Abfrageliste aus der Datenbank und Zeigen Sie die Klassifizierung an
2. Login-, Register -Anmelde-, Registrier- und Ausgangs -Login -Modul: Home & Tool Download Seite Keine Anmeldung Vorschau, die Benutzerlistenseite kann nach dem Anmeldung angezeigt werden. Speichern Sie SessionToken in Cookies, und die BenutzerID wird in LocalStorage gespeichert. Nach Anmeldung ist die obere rechte Ecke der Login oder Avatar.
3. Benutzermanage -Benutzerlistenmodul: Seiten, Blur -Suche, Benutzerbearbeiten, Löschfunktion
4. Friend_Link Friendship Link -Schnittstelle: Stecken Sie die Freundenkette und Einreichung von Informationen in die Datenbank
5. Software -Download -Nummer Statistiken
6. Benutzer ändern und löschen ihre Funktionen

---

V 1.0.2 Download Statistiken/Anmeldungsregistrierungsüberprüfung (Artikel 5-6)

1. Token -Überprüfung optimieren
2. Software -Download -Nummer Statistiken
3. Benutzer ändern und löschen ihre Funktionen

V 1.0.1 Implementieren Sie grundlegende Funktionen (Punkt 1-4) -Machen Sie einige Probleme auf, die aufgenommen wurden

Frontend

1. Wenn die Steuerseite angemeldet ist, um zugreifen zu können: Konfigurieren Sie den Router -Referenzverbind
2. Speichern Sie die Benutzer -ID, nachdem Sie sich bei LocalStorage anmelden.

hinteres Ende

1. NodeJS verbindet die MySQL -Datenbank.

einsetzen

1. Nachdem Nginx das VUE -Projekt bereitgestellt hat, gibt es kein Problem mit dem normalen Zugriff, und das Problem von 404 Problemen tritt nach dem Erfrischen auf
2. NodeJS verwendet den Forever Referenzverbind

---

V 1.0.0 Erstellen Sie das Projekt vorne und vorne -End

Frontend

1. Verwenden Sie Vue-Cli+ WebPack, um ein VUE-Projekt zu generieren
2. Konfigurieren Sie Router, Speichern, Utils, Axios, ElementUi, Portnummer ...

hinteres Ende

1. Verwenden Sie Express, um eine NodeJS -Projektreferenzverbindung zu generieren
2. Installieren Sie das JSONWEBTOKE -Abhängigkeitspaket, um Token zu generieren.
3. Installieren Sie das MySQL -Datenbankabhängigkeitspaket

Lösen Sie das Cross -Domain -Problem (Einstellen von Anforderungsheader) Referenzverknüpfung

• Frontend: Anfordern Sie Interceptor in Axios, setzen
• Zurück Ende: Stellen Sie den Anforderungsheader in der App.js-add App.All () ein
• Back End: Seit der selbstdefinierten Anfrage Head SessionToken für komplexe Cross -Domain

Datenbank

1. Erstellen einer Datenbank> Tabelle [Benutzer, Tools_down, Freund_Link]
2. Simulationstestdaten