inde.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<link rel="stylesheet" type="text/css" href="./css/index.css"/>
</head>
<body>
<div><h2>注冊</h2></div><form>
用戶名: ? <input class="user" id="user" autocomplete="on" type="text" />
<br />
密碼: <input? autocomplete="off" class="password" id="password" type="password" /></form>
<br />
<button class="btn" id="btn">注冊</button>
<button class="btn" id="btn_zc"><a href="html/registered.html">登錄</a></button>
</body>
</html>
<script type="text/javascript" src="./js/jquery.js"></script>
<script type="text/javascript">
$('#btn').on('click',function(e){
let user = $('#user').val();
let password = $('#password').val();
let data = {
name:user,
pwd:password,
}
if(user != '' && password != ''){
ajax(data);
}
return false;
})
function ajax(data){
$.ajax({
type:'POST',
url:'http://localhost:5200/',
data:data,
async:false,
success:function(res){
if(res.status == 200){
callback(res);
$('#user').val('');
$('#password').val('');
}
}
})
}
function callback(res){
console.log(res)
alert(res.Tag)
}
</script>
login.js //nodeJS
//express框架引用
const express = require('express')
global.successful = '注冊失敗';
//引入數(shù)據(jù)庫
const mysql = require('../Model/mysql.js');
//跨域
const cors=require('cors');
//以下注釋部分據(jù)說是另一種解決跨域問題的方法
// app.all('*', function(req, res, next) {? ? ? ? ? ? //設(shè)置跨域訪問
//? ? res.header("Access-Control-Allow-Origin", "*");
//? ? res.header("Access-Control-Allow-Headers", "X-Requested-With");
//? ? res.header("Access-Control-Allow-Methods","PUT,POST,GET,DELETE,OPTIONS");
//? ? res.header("X-Powered-By",' 3.2.1');
//? ? res.header("Content-Type", "application/json;charset=utf-8");
//? ? next();
// })
//
const bodyParser = require('body-parser');
//實例化框架
const app = express();
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({extended: false}));
app.use(cors())//解決跨域
//保存?zhèn)鬟^來的值
var data,sqlAdd;
//定義接口路由
app.get('/',function(req,res){
? ? res.status(200),
? ? ? ? res.json(req.body)
})
// POST method route
app.post('/', function (req, res) { post_async(req, res);})
async function post_async(req, res){
res.status(200),
res.header('Access-Control-Allow-Origin','*')
sqlAdd = req.body;
let SQL = await mysql.sql_operation(sqlAdd);
console.log(SQL+'--'+"數(shù)據(jù)插入完成")
data =? {
status:res.statusCode,
Tag:SQL,
};
res.send(data);
successful = '注冊失敗';
data = {};
console.log(successful+"--"+"恢復(fù)默認(rèn)值");
}
const server=app.listen(5200,function () {
? ? const {address,port}=server.address()
? ? console.log('http server is running http://%s :%s', address, port);
})
//mysql.js
//數(shù)據(jù)庫插入
function sql_operation(data){
var addsql = new Promise(async function(resolve, reject){
const express = require('express');
const mysql = require('mysql');
const path = require('path')
const app = express();
app.use(express.static(path.join(__dirname,'/')));
var connection = mysql.createConnection({
host: 'localhost',
database: 'Mysql',
user: 'root',
password: '123456',
});
connection.connect();
// var sql = `SELECT * FROM login where name="${data.name}" and pwd="${data.pwd}" `;
var sql = `INSERT INTO login(name,pwd) VALUES(?,?)`;
var add_sql =? [String(data.name),String(data.pwd) ,];
//var contrast = 'FROM login where';
//數(shù)據(jù)庫查詢
var query = await new Promise((resolve, reject)=>{
connection.query(sql,add_sql, function(err, result) {
if(err){
console.log('[INSERT ERROR] - ',err.message);
return;
};
console.log('--------------------------SELECT----------------------------');
console.log(result);
console.log('------------------------------------------------------------\n\n');
if(result.affectedRows == 1){
successful = '注冊成功'
}
console.log(successful)
resolve(successful);
});
})?
//關(guān)閉鏈接
connection.end();
resolve(successful);
})
return addsql
}
module.exports = {sql_operation};
