Представляем полный стек: Node+MySQL реализует простую функцию входа в систему

Node.js

1. Типичные применения нескольких узлов

  • Автоматизированные инструменты для строительных лесов: Разработка vue-cli, webpack-cli и настраиваемых инструментов формирования шаблонов.

  • средний слой:
    Исходя из предпосылки сохранения разделения внешнего и внутреннего интерфейса, используйте узел для создания простого сервера веб-сервера, который используется для рендеринга страниц на стороне сервера и слияния интерфейсов данных.

  • Гибкое использование вспомогательной структуры проекта узла:
    Например, используя узел в качестве кэш-памяти.

  • Полная разработка стека:
    Используйте узел, чтобы выполнить полный набор проектов для малого бизнеса и личных блогов.

2. Установите MySQL

официальный сайт майклЗагрузите и установите сервер MySQL. После установки войдите в mysql, чтобы убедиться, что mysql успешно подключен, как показано на следующем рисунке:

В-третьих, реализовать простую функцию входа в систему

1. Создайте базу данных и таблицу

create DATABASE user;

use user;

create table userlist(
id int primary key auto_increment,
username char(30) unique,
password char(30)
);

2. Вставьте данные в пользовательскую таблицу

insert into userlist values(1,'zhangsan','123456');

После выполнения оператора вставки SQL таблица списка пользователей содержит следующие данные:

3. Установите пакет mysql в проект узла для подключения к базе данных.

Используйте npm в проекте узла, чтобы сначала установить набор инструментов mysql:

npm install mysql --save

Создайте server.js и используйте пакет mysql для подключения к mysql:

const mysql = require('mysql');

// 建立数据库连接池
const pool = mysql.createPool({
    host: '127.0.0.1',
    port: '3306',
    user: 'root',
    password: 'root123456',
    database: 'user'
})

4. Используйте экспресс-фреймворк для реализации функции входа в систему

сторона клиента:Создать index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>登录</title>
    <script src="https://cdn.bootcss.com/jquery/2.2.1/jquery.js"></script>
</head>
<body>
    <input type="text" id="username"/>
    <input type="password" id="password"/>
    <button id="login">登录</button>
    
    <script type="text/javascript">
    $('#login').click(function(){
        $.ajax({
            type: 'POST',
            url: '/login',
            dataType: 'json',
            data: JSON.stringify({
                username: $('#username').val(),
                password: $('#password').val()
            }),
            success: function (data) {
                if(data.success) {
                    window.location.href = '/welcome';
                }else{
                    alert('账号密码错误')
                }
            }
        });
    })
    </script>
</body>
</html>

серверная часть:

// server.js
const fs = require('fs');
const express = require('express');
const app = express();
const { query } = require('./query-db');

app.get('/', function(req, res) {
    let file = fs.readFileSync('./index.html');
    let _data = file.toString();

    res.setHeader('Content-type','text/html;charset=UTF-8')
    res.send(_data);
})

app.post('/login', function(req, res) {
    let reqData = "";
    res.setHeader('Content-type','text/json;charset=UTF-8')
    req.on('data', function(data){
        reqData += data
    });

    req.on('end', async function(){
        let dataOb = JSON.parse(reqData);
        let word = "select * from userlist where username='";
        word += dataOb.username + "'";
        word += " and password='";
        word += dataOb.password + "'";

        let result = await query(word);
    
        if(result && result.length > 0) {
            // 如果要在express里面使用session需安装express-session
            res.setHeader('Set-Cookie', 'username='+result[0].username)
            res.send(JSON.stringify({
                success: true,
                message: '登录成功！'
            }))
        }else{
            res.send(JSON.stringify({
                success: false,
                message: '登录失败！'
            }))
        }
        
    })
})

app.get('/welcome', function(req, res) {
    res.send('Login success!')
})

app.listen(3000);

// query-db.js
const mysql = require('mysql');
const pool = mysql.createPool({
    host: '127.0.0.1',
    port: '3306',
    user: 'root',
    password: 'root123456',
    database: 'user'
})

let query = function(sql) {
    return new Promise((resolve, reject) => {
        pool.query(sql, function(error, result, fields){
            if (error) throw error;
            resolve(result);
        })
    })
}

module.exports = { query };

Диаграмма результатов функции входа в систему:

Категории