Node.js實現前後端交互——用戶註冊
- 2021 年 11 月 30 日
- 筆記
- Node.js, Node.js與MySQL
我之前寫過一篇關於使用Node.js作為後端實現用戶登陸的功能,現在再寫一下node.js做後端實現簡單的用戶註冊實例吧。另外需要說的是,上次有大佬提醒需要加密數據傳輸,不應該使用明文傳輸用戶資訊。在實際的開發中,也強烈建議大家做數據加密操作。ps:這裡為了演示,就不做數據加密了。好了,現在開始我們的小項目。
一、項目需求
要求用戶進入用戶註冊介面,填寫用戶名和密碼後,提交到資料庫保存。註冊後的賬戶可用於登陸。ps:關於用戶名和用戶密碼審核這些的就不寫了,這裡只寫一些核心功能需求的程式碼。
二、開始擼程式碼
1,創建前端程式碼,登錄頁register.html
<div> <form method="post" action="//localhost:8080/"> <input type="text" required="required" id="set_name" placeholder="請填寫用戶名" name="set_name"> <input type="password" required="required" id="set_pwd" placeholder="請填寫密碼" name="set_pwd"> <input type="password" required="required" id="check_pwd" placeholder="請再次填寫密碼" name="check_pwd"> <br> <input type="reset" class="reset_but" value="重寫填寫"> <input type="submit" class="register_but" value="確認註冊"> </form> </div>
創建登陸表單,此處的提交方式為post,提交地址為自己的主機,因為我是做的本地測試環境。
2、Node.js後端獲取用戶數據
(1)引入模組,此時需要你的電腦上面以及安裝了Node.js環境,安裝方法請自行百度。
// 引入http模組 const http = require('http'); //引入處理請求參數模組 const queryString = require('querystring');//調用自定義封裝的鏈接資料庫模組 const connection = require("./mysql.js");
此處的自定義封裝資料庫模組我會在後面給出,讀者也可以參考我上一篇:Node.js實現前後端交互——用戶登陸的部落格。
(2)獲取用戶提交的用戶名和密碼,並保存到MySQL資料庫
//定義sever是網站伺服器對象 let sever = http.createServer(); //為伺服器對象綁定請求事件,當客戶端有請求時觸發 sever.on('request', function (request, response) { /* POST參數是通過事件的方式接收的 * data 當請求參數傳遞的時候觸發的事件 * end 當參數傳遞完成的時候觸發end事件 */ let postParams = ''; //定義空字元串用於接收post參數 //綁定data觸發事件 request.on('data', function (params) { postParams = postParams + params; //拼接post參數 }); //綁定data觸發事件 request.on('end', function () { // 把postParams字元串處理為對象,用querystring模組中的parse()方法 //獲取前端表單的具體數據,如set_name。注意:此處的set_name一定要和前端表單中的name屬性一致。 let username = queryString.parse(postParams).set_name; let userpwd = queryString.parse(postParams).set_pwd; // 添加數據添加實例,使用SQL語句 let addSql = 'INSERT INTO userinfo (userName,userPwd) VALUES(?,?)'; let addSqlParams = [username, userpwd]; connection.query(addSql, addSqlParams, function (result, fields) { console.log('添加成功!') }); }); response.end('恭喜!註冊成功!'); //返迴響應 }); // 監聽埠 sever.listen(8080); console.log("伺服器啟動成功!");
正如大家看到的,程式碼中的注釋已經很詳細。給出思路:後端獲取用戶填寫完並提交的表單數據,將表單數據添加到資料庫的數據表。這裡給出數據表供參考。
看一下我預先準備好的資料庫中的數據表。資料庫名test(後面資料庫封裝的配置項里可以看到),數據表名userinfo
(3)使用到的封裝資料庫,看過我上一篇博文的讀者可以忽略下面的內容。(因為這裡和上一篇是一樣的哈哈哈)
因為如果在使用中每次都寫一堆程式碼用於資料庫鏈接之類的操作,機會顯得很冗餘,於是我參考其他博友的程式碼對資料庫鏈接操作分為兩個文件進行封裝。
資料庫配置封裝文件 mysql.config.js
//配置鏈接資料庫參數 module.exports = { host: 'localhost', port: 3306,//埠號 database: 'test',//資料庫名 user: 'root',//資料庫用戶名 password: '123456'//資料庫密碼 };
資料庫鏈接封裝文件 mysql.js
let mysql = require('mysql');//引入mysql模組 let databaseConfig = require('./mysql.config'); //引入資料庫配置模組中的數據 //向外暴露方法 module.exports = { query: function (sql, params, callback) { //每次使用的時候需要創建鏈接,數據操作完成之後要關閉連接 let connection = mysql.createConnection(databaseConfig); connection.connect(function (err) { if (err) { console.log('資料庫鏈接失敗'); throw err; } //開始數據操作 //傳入三個參數,第一個參數sql語句,第二個參數sql語句中需要的數據,第三個參數回調函數 connection.query(sql, params, function (err, results, fields) { if (err) { console.log('數據操作失敗'); throw err; } //將查詢出來的數據返回給回調函數 callback && callback(results, fields); //results作為數據操作後的結果,fields作為資料庫連接的一些欄位 //停止鏈接資料庫,必須再查詢語句後,要不然一調用這個方法,就直接停止鏈接,數據操作就會失敗 connection.end(function (err) { if (err) { console.log('關閉資料庫連接失敗!'); throw err; } }); }); }); } };
上面的兩個文件已經在資料庫查詢實例中const connection = require("./mysql.js");調用了。
至此,我們的Node.js作為後端實現用戶註冊的功能已經實現了。當然,在實際的生產環境中,還有許多的地方需要修改,比如數據安全傳輸,用戶註冊的資訊檢測等等。