基于node.js做的静态服务器分享，有详细注释，配套的js和ajax请求---原生和jquery的都有

本人写的不复杂，适合萌新。

原文地址：https://blog.csdn.net/qq_39051175/article/details/99678556

因为是从我在csdn论坛上发表的这文章复制过来的，因此代码每一行前面的空格被去掉了（简书的问题），

建议复制代码在你的编辑器里看，本文代码都是切实可行的，不会出现运行不了的问题。

觉得可以的话点个赞，关注一下吧

mongodb或者mysql数据库都可以使用，文件头部的注释取消即可！

复制过去用的话，记得改ajax请求的url: “http://192.168.0.76:8089/test_post”（这是我的地址和路径），你需要改成你自己的哦！！

不要纠结 我给变量起名很low 我有严重的起名困难症！！！！

/**

* a Static Server

* nodejs进程守护工具 pm2 了解一下

*/

const express = require('express');

// 这里是使用mongodb的

// const mongodb = require('mongodb');

// const MongoClient = mongodb.MongoClient;

// 这里使用mysql的

const mysql = require('mysql');

// const url = require('url');

//body-parser是非常常用的一个express中间件，作用是对post请求的请求体进行解析。

const bodyParser = require('body-parser'); //用于获取post请求参数的

let urlencodedParser = bodyParser.urlencoded({ //用于获取post请求参数的

extended: false

})

let app = express();

//解决跨域

app.all('*', function(req, res, next) {

res.header("Access-Control-Allow-Origin", "*");

res.header("Access-Control-Allow-Headers", "Content-Type,Content-Length, Authorization, Accept,X-Requested-With");

res.header("Access-Control-Allow-Methods", "PUT,POST,GET,DELETE,OPTIONS");

if(req.method == "OPTIONS") {

res.send(200);

} else {

next();

}

});

//设置静态文件目录

app.use(express.static('./'));

/* 一个测试 */

//获取post请求参数  需要用到一个中间件，顶上有加载这个

app.post('/test_post',urlencodedParser, (req, res) => {

console.log(req.body,req.originalUrl)

res.send(req.body);

})

//获取get请求参数

app.get('/test_get', (req, res) => {

var num = 200;

//res.send('连接成功，这段字符串是node.js服务器返回的数据',num) //逗号隔开是设置随着数据一起返回的状态码 比如200（成功） 500（服务器出错）之类的。

//推荐下面这么写,把设置状态码跟发送数据分开

//res.status(200);

//res.send('连接成功，这段字符串是node.js服务器返回的数据' + num) //加号隔开是返回这个数字作为数据

console.log(req.query,req.originalUrl)

res.send(req.query);

})

/* 一个测试 */

//注册

app.get('/zhuce123', (req, res) => {

var pool = mysql.createPool({

host: 'localhost',

user: 'root',

password: '',

port: 3307,

database: 'vuedata',

multipleStatements: true

    });

    console.log(req.query.yonghum);

    var sql1 =`insert into yonghubiao (usname, password) values ('${req.query.yonghum}', '${req.query.xinmima}')`

pool.query(sql1, function(error, rows) {

res.send(req.query.yonghum);

});

})

//登陆

app.get('/denglu123', (req, res) => {

var pool = mysql.createPool({

host: 'localhost',

user: 'root',

password: '',

port: 3307,

database: 'vuedata',

multipleStatements: true

    });

    // console.log(req.query.yonghum); 

    var sql1 =`select * from yonghubiao where usname='${req.query.yonghum}' and password = '${req.query.xinmima}' limit 1`;

pool.query(sql1, function(error, rows) {

        console.log(rows.length);

        if(rows.length != 0){

            res.send("1");

        }else{

            res.send("0");

        }

});

});

//修改密码

app.get('/xiugai123', (req, res) => {

var pool = mysql.createPool({

host: 'localhost',

user: 'root',

password: '',

port: 3307,

database: 'vuedata',

multipleStatements: true

});

// var sql = ;

pool.query(`update yonghubiao set password='${req.query.xinmima}' where usname='${req.query.yonghum}'`, function(error, rows) {

res.send("1");

console.log(req.query);

});

});

//  下面注释部分是操作mongodb数据库的

// //登陆

// app.post('/login', urlencodedParser, (req, res) => {

// let {

// name,

// mima

// } = req.body;

// MongoClient.connect("mongodb://localhost:27017/", function(err, database) {

// if(err) throw err;

// let db = database.db('xcy');

// let yhb = db.collection('yhb'); //切换到具体的集合

// yhb.findOne({

// username: name,

// password: mima

// }, (err, result) => {

// if(result) {

// // 登录成功后，给前端发送用户表示：token

// res.send({

// code: 1,

// data: result,

// msg: 'ok'

// })

// } else {

// res.send({

// code: 0,

// data: [],

// msg: 'fail'

// })

// }

// });

// database.close();

// });

// });

// //用户列表

// app.get('/hqyh', (req, res) => {

// var pool = mysql.createPool({

// host: 'localhost',

// user: 'root',

// password: '',

// port: 3307,

// database: 'xcy',

// multipleStatements: true

// });

// pool.query('select * from yonghubiao', function(error, rows) {

// res.send(rows);

// });

// });

// //修改密码

// app.get('/xiugai', (req, res) => {

// var pool = mysql.createPool({

// host: 'localhost',

// user: 'root',

// password: '',

// port: 3307,

// database: 'xcy',

// multipleStatements: true

// });

// // var sql = ;

// pool.query(`update yonghubiao set password='${req.query.xinmima}' where usname='${req.query.yonghum}'`, function(error, rows) {

// res.send("");

// console.log(req.query);

// });

// });

// //删除

// app.get('/shanchu', (req, res) => {

// var pool = mysql.createPool({

// host: 'localhost',

// user: 'root',

// password: '',

// port: 3307,

// database: 'xcy',

// multipleStatements: true

// });

// // var sql =;

// pool.query(`DELETE FROM yonghubiao where usname= '${req.query.yonghum}'`, function(error, rows) {

// res.send("删除成功");

// console.log(req.query.yonghum);

// });

// });

// //添加

// app.get('/tianjia', (req, res) => {

// var pool = mysql.createPool({

// host: 'localhost',

// user: 'root',

// password: '',

// port: 3307,

// database: 'xcy',

// multipleStatements: true

// });

// console.log(req.query);

// var sql = `insert into yonghubiao (usname, password) values ('${req.query.yonghum}', '${req.query.xinmima}')`;

// pool.query(sql, function(error, rows) {

// res.send("添加成功");

// });

// });

// //商品列表

// app.get('/splb', (req, res) => {

// var pool = mysql.createPool({

// host: 'localhost',

// user: 'root',

// password: '',

// port: 3307,

// database: 'xcy',

// multipleStatements: true

// });

// pool.query('select * from goods', function(error, rows) {

// res.send(rows);

// });

// });

// //修改商品列表

// app.get('/xiugaigood', (req, res) => {

// var pool = mysql.createPool({

// host: 'localhost',

// user: 'root',

// password: '',

// port: 3307,

// database: 'xcy',

// multipleStatements: true

// });

// var sql = `

// update goods set goodname='${req.query.goodming}' where id='${req.query.goodid}';

// update goods set jiage='${req.query.goodjiage}' where id='${req.query.goodid}';

// update goods set goodxiangqing='${req.query.goodzhonglei}' where id='${req.query.goodid}';

// update goods set tupianlujing='${req.query.goodtupianlujing}' where id='${req.query.goodid}';

// update goods set jieshao='${req.query.goodjieshao}' where id='${req.query.goodid}';

// update goods set shouchu='${req.query.goodshouchu}' where id='${req.query.goodid}';

// update goods set rongliang='${req.query.goodrongliang}' where id='${req.query.goodid}';

// update goods set id='${req.query.goodnewid}' where id='${req.query.goodid}';

// `;

// pool.query(sql, function(error, rows) {

// res.send("");

// console.log(req.query);

// });

// });

// //删除good

// app.get('/shanchugood', (req, res) => {

// var pool = mysql.createPool({

// host: 'localhost',

// user: 'root',

// password: '',

// port: 3307,

// database: 'xcy',

// multipleStatements: true

// });

// // var sql =;

// pool.query(`DELETE FROM goods where id= '${req.query.goodid}'`, function(error, rows) {

// res.send("删除成功");

// console.log(req.query.goodid);

// });

// });

// //添加商品

// app.get('/tianjiagood', (req, res) => {

// var pool = mysql.createPool({

// host: 'localhost',

// user: 'root',

// password: '',

// port: 3307,

// database: 'xcy',

// multipleStatements: true

// });

// console.log(req.query);

// var sql = `insert into goods (goodname, id,jiage,goodxiangqing,tupianlujing,jieshao,shouchu,rongliang) values ('${req.query.goodming}', '${req.query.goodnewid}','${req.query.goodjiage}','${req.query.goodzhonglei}','${req.query.goodtupianlujing}','${req.query.goodjieshao}','${req.query.goodshouchu}','${req.query.goodrongliang}')`;

// pool.query(sql, function(error, rows) {

// res.send("添加成功");

// });

// });

//监听某个端口

app.listen(8089, () => {

console.log("监听成功,服务器运行ing,端口:8089")

})

下面是配套的js和ajax请求—原生和jquery的都有

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title></title>

<style type="text/css">

html,

body {

width: 100%;

height: 100%;

}

#btn {

width: 100px;

height: 100px;

margin: 0 auto;

display: block;

margin-top: 35%;

transform: translateY(-50%);

}

#btn2 {

width: 100px;

height: 100px;

margin: 0 auto;

display: block;

margin-top: 15%;

transform: translateY(-50%);

}

#txt {

width: 360px;

margin: 0 auto;

display: block;

padding: 10px;

background-color: bisque;

}

</style>

</head>

<body>

<button type="button" id="btn">发送btn</button>

<button type="button" id="btn2">发送btn2</button>

<div id="txt">xxc </div>

<script src="common.js" type="text/javascript" charset="utf-8"></script>

<script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>

<script type="text/javascript">

var btn = document.getElementById("btn");

var btn2 = document.getElementById("btn2");

var txt = document.getElementById("txt");

btn.onclick = function(e) {

var ajax = new XMLHttpRequest();

//如果是get传参,用字符串模版写在URL里吧

ajax.open('POST', 'http://192.168.0.76:8089/test_post');

ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");

//原生ajax发送数据 要写出下面这个格式,要紧凑,不要留空格(不然JSON.parse会出问题)

ajax.send("name=yyy&abc=123"); //携带数据到服务器

ajax.onreadystatechange = function() {

if (ajax.readyState == 4 && ajax.status == 200) {

var res = JSON.parse(ajax.responseText);

console.log(res);

txt.innerHTML = (res.name +" "+res.abc);

}

}

}

// jquery版本

$("#btn2").click(function() {

//get

$.ajax({

type: "get",

url: "http://192.168.0.76:8089/test_get",

data: {

name: '觉得可以的话点个赞，关注一下吧'

},

success: function(res) {

console.log(res)

$("#txt").html(res.name);

}

});

//post

// $.ajax({

// type: "post",

// url: "http://192.168.0.76:8089/test_post",

// data: {

// name: 'qwe'

// },

// success: function(res) {

// $("#txt").html(res.name);

// }

// });

});

</script>

</body>

</html>

以上的是原生JS和jquery的ajax请求我写的这个node.js的服务器的方式

不论是mysql还是mongdb数据库，请求是一样的。

最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
  • 人面猴
    序言：七十年代末，一起剥皮案震惊了整个滨河市，随后出现的几起案子，更是在滨河造成了极大的恐慌，老刑警刘岩，带你破解...
    沈念sama阅读 204,445评论 6赞 478
  • 死咒
    序言：滨河连续发生了三起死亡事件，死亡现场离奇诡异，居然都是意外死亡，警方通过查阅死者的电脑和手机，发现死者居然都...
    沈念sama阅读 85,889评论 2赞 381
  • 救了他两次的神仙让他今天三更去死
    文/潘晓璐 我一进店门，熙熙楼的掌柜王于贵愁眉苦脸地迎上来，“玉大人，你说我怎么就摊上这事。” “怎么了？”我有些...
    开封第一讲书人阅读 151,047评论 0赞 337
  • 道士缉凶录：失踪的卖姜人
    文/不坏的土叔 我叫张陵，是天一观的道长。 经常有香客问我，道长，这世上最难降的妖魔是什么？ 我笑而不...
    开封第一讲书人阅读 54,760评论 1赞 276
  • 港岛之恋（遗憾婚礼）
    正文 为了忘掉前任，我火速办了婚礼，结果婚礼上，老公的妹妹穿的比我还像新娘。我一直安慰自己，他们只是感情好，可当我...
    茶点故事阅读 63,745评论 5赞 367
  • 恶毒庶女顶嫁案：这布局不是一般人想出来的
    文/花漫 我一把揭开白布。 她就那样静静地躺着，像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上，一...
    开封第一讲书人阅读 48,638评论 1赞 281
  • 城市分裂传说
    那天，我揣着相机与录音，去河边找鬼。 笑死，一个胖子当着我的面吹牛，可吹牛的内容都是我干的。 我是一名探鬼主播，决...
    沈念sama阅读 38,011评论 3赞 398
  • 双鸳鸯连环套：你想象不到人心有多黑
    文/苍兰香墨 我猛地睁开眼，长吁一口气：“原来是场噩梦啊……” “哼！你这毒妇竟也来了？” 一声冷哼从身侧响起，我...
    开封第一讲书人阅读 36,669评论 0赞 258
  • 万荣杀人案实录
    序言：老挝万荣一对情侣失踪，失踪者是张志新（化名）和其女友刘颖，没想到半个月后，有当地人在树林里发现了一具尸体，经...
    沈念sama阅读 40,923评论 1赞 299
  • 护林员之死
    正文 独居荒郊野岭守林人离奇死亡，尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,655评论 2赞 321
  • 白月光启示录
    正文 我和宋清朗相恋三年，在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,740评论 1赞 330
  • 活死人
    序言：一个原本活蹦乱跳的男人离奇死亡，死状恐怖，灵堂内的尸体忽然破棺而出，到底是诈尸还是另有隐情，我是刑警宁泽，带...
    沈念sama阅读 33,406评论 4赞 320
  • 日本核电站爆炸内幕
    正文 年R本政府宣布，位于F岛的核电站，受9级特大地震影响，放射性物质发生泄漏。R本人自食恶果不足惜，却给世界环境...
    茶点故事阅读 38,995评论 3赞 307
  • 男人毒药：我在死后第九天来索命
    文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹，春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,961评论 0赞 19
  • 一桩弑父案，背后竟有这般阴谋
    文/苍兰香墨 我抬头看了看天上的太阳。三九已至，却和暖如春，着一层夹袄步出监牢的瞬间，已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,197评论 1赞 260
  • 情欲美人皮
    我被黑心中介骗来泰国打工， 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留，地道东北人。 一个月前我还...
    沈念sama阅读 45,023评论 2赞 350
  • 代替公主和亲
    正文 我出身青楼，却偏偏与公主长得像，于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子，可洞房花烛夜当晚...
    茶点故事阅读 42,483评论 2赞 342