Скачать vue nodejs elementUI mysql express demo - vue nodejs elementUI mysql express demo Загрузка исходного кода

vue nodejs elementUI mysql express demo

Другие категории

1.0.2

Скачать

vue-nodejs-elementUI-mysql-express-demo

Проекты разделения внешнего и внутреннего интерфейса Vue+nodejs, научитесь использовать, включая базовые операции ввода. Включая процесс реализации от создания проекта до окончательного развертывания, а также краткое описание некоторых проблем, возникших в ходе этого процесса.

Адрес предварительного просмотра проекта: Адрес предварительного просмотра --aixiaodou.cn

Адрес для комментариев и обсуждения: Личный блог -- https://blog.csdn.net/qq_32442967/article/details/103459148.

Адрес базы данных: express-demo/doc/demo2.sql

База данных MySQL

База данных демо2.

Создать базу данных demo2 > запустить оператор sql

Измените конфигурацию подключения к базе данных model/connDb.js в проекте экспресс-демо.

express-demo-web: внешний веб-проект

 # 安装依赖
npm install

# 运行项目
npm run dev

экспресс-демо: серверный проект nodejs

 # 安装依赖
npm install

# 运行项目
npm start

Этот проект представляет собой проект начального уровня, в котором используется режим разделения переднего (vue) и заднего (nodejs) конца.

В основном используемые технологии:

Интерфейс: vue+ elementUI+ axios+ vue-cli+ webpack+ vue-router+ vuex+ js-cookie
Бэкенд: nodejs+ express+ jsonwebtoken
База данных: MySQL
Среда развертывания: nginx.
Сервер развертывания: Linux centos7

Знакомство с существующими функциями:

Модуль загрузки инструментов ToolsDown: запросите список из базы данных и отобразите его по категориям.
вход, регистрация, вход, регистрация, выход из модуля: домашнюю страницу и страницу загрузки инструментов можно просмотреть без входа в систему, а страница списка пользователей будет видна после входа в систему. Сохраните sessionToken в файле cookie и идентификатор пользователя после входа в систему в локальном хранилище. В зависимости от того, авторизованы вы или нет, в правом верхнем углу отобразите логин или аватарку.
Модуль списка пользователей userManage: пейджинг, нечеткий поиск, функции редактирования и удаления пользователей.
Friend_link Интерфейс ссылок друзей: размещение ссылок друзей и сохранение информации в базе данных.
Статистика количества загрузок программного обеспечения
Функции изменения и удаления пользователя

V 1.0.2 Загрузка статистики/подтверждение регистрации логина (п.5-6)

Оптимизация проверки токена
Статистика количества загрузок программного обеспечения
Функции изменения и удаления пользователя

V 1.0.1 Реализация основных функций (пункты 1-4) – в основном запись возникающих проблем

внешний интерфейс

Контролируйте, доступен ли доступ к странице только после входа в систему: оценивайте, есть ли вход по токену, настраивайте ссылку на ссылку маршрутизатора
Сохраните userId, полученный после входа в систему, в localstorage. При получении информации о пользователе введите userId для получения информации о вошедшем в систему пользователе и отобразите аватар в правом верхнем углу.

задняя часть

Nodejs подключается к базе данных MySQL. Если используется пул соединений, соединение необходимо освободить после использования, иначе будет превышено максимальное количество соединений.

развертывать

После того, как nginx развернет проект vue, проблем с обычным доступом не будет, но при обновлении появится ошибка 404.
nodejs постоянно работает в Linux, используя ссылку на вечную ссылку

V 1.0.0 Создание интерфейсных и серверных проектов

внешний интерфейс

Используйте веб-пакет vue-cli+ для создания проектов vue
Настройте маршрутизатор, магазин, утилиты, axios, elementUI, номер порта...

задняя часть

Используйте экспресс для создания справочных ссылок на проект nodejs.
Установите пакет зависимостей jsonwebtoken, сгенерируйте токен и верните ссылку на внешний интерфейс после успешного входа в систему.
Установите пакет зависимостей базы данных MySQL.

Решение междоменной проблемы разделения фронтенд- и бэкенд-проектов (установка заголовков запросов) Ссылка на ссылку

Интерфейс: перехватчик запросов в axios, установка sessionToken, используется в качестве внутренней проверки, чтобы определить, является ли это разрешенным сервером.
Бэкэнд: установите заголовки запросов в app.js — добавьте app.all()
Бэкэнд: благодаря настраиваемому заголовку запроса sessionToken для сложных междоменных запросов будет предварительный запрос параметров, а запросы с параметрами метода быстро обрабатываются и возвращают 200.