static中间件可以使客户端直接访问网站中的所有静态文件.

利用这个功能可以直接把服务器上的静态页面直接读取出来返回到客户端.

从客户端点击一个按钮,向服务器端发送数据.并且插入到mysql数据库中去.

服务器端代码:

 var express=require("express");
var app=express();
var mysql=require("mysql");
var pool=mysql.createPool({
host:"localhost",
port:3306,
database:"test_db",
user:"root",
password:"gys"
}); app.use(express.static(__dirname));
/*app.use(express.static("public"));*/
app.post("/", function (req,res) {
req.on("data", function (data) {
var obj=JSON.parse(data.toString());
pool.getConnection(function(err,connection){
if(err) res.send("与mysql数据库建立连接失败.");
else{
var str;
connection.query("insert into users set ?",{username:obj.username,firstname:obj.firstname}, function (err,result) {
if(err) str="在服务器mysql数据库中插入数据失败.";
else str="在服务器端mysql数据库汇总插入数据成功.";
connection.release();
res.send(str);
});
}
})
});
});
app.listen(1337,"127.0.0.1", function () {
console.log("开始监听1337");
});

根目录下的index.html代码:

 <!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>session中间件的使用</title>
<script type="text/javascript">
function submitData(){
var xhr=new XMLHttpRequest();
xhr.open("post","/",true);
xhr.onload= function () {
if(this.status=200){
document.getElementById("res").innerHTML=this.response;
}
};
var obj={firstname:"郭",username:"延思"};
xhr.send(JSON.stringify(obj));
}
</script>
</head>
<body>
<input type="button" value="提交" onclick="submitData();" />
<div id="res"></div>
</body>
</html>

在浏览器中键入:localhost:1337或localhost:1337/index.html

如果文件名是index.html可以直接这样写:localhost:1337

否则就是localhost:1337/文件名

node的express中间件之static之ajax提交json的更多相关文章

  1. node的express中间件之bodyParser

    bodyParser用于解析客户端请求的body中的内容,内部使用JSON编码处理,url编码处理以及对于文件的上传处理. 下面是一个文件上传的例子. 建立一个1.html页面 <!DOCTYP ...

  2. MVC中用ajax提交json对象数组

    应用场景:在前端用ajax向服务器提交json对象数组,在controller的以对象数组作为函数的参数,提交的json数组直接转为服务器端的对象数组. 如: 要将json对象数组[{Id:1,Nam ...

  3. Jquery Ajax 提交json数据

    在MVC控制器(这里是TestController)下有一个CreateOrder的Action方法 [HttpPost] public ActionResult CreateOrder(List&l ...

  4. ajax提交json数据到后端C#解析

    本文链接:https://blog.csdn.net/qq_22103321/article/details/78015920 前端提交json数据 $.ajax({ type: "post ...

  5. Node.js + Express中间件详解

    使用中间件 Express是一种路由和中间件Web框架,它具有自己的最小功能:Express应用程序本质上是一系列中间件函数调用. 中间件函数是可以访问请求对象 (req),响应对象(res)以及应用 ...

  6. node的express中间件之directory

    direcotry中间件用于在浏览器中流出网站某个目录下的所有子目录及文件. app.use(express.directory(path,[options])); 查看网站根目录下的文件及目录 va ...

  7. node的express中间件之session

    虽然session与cookie是分开保存的.但是session中的数据经过加密处理后默认保存在一个cookie中.因此在使用session中间件之前必须使用cookieParser中间件. app. ...

  8. node.js+express+jade系列五:ajax登录

    本文通过jquery实现简单的无刷新登录 1:首先要在router中配置登录请求,因为登录需要传user和pwd考虑到安全需用post请求 {        path:'/',        meth ...

  9. jquery ajax提交json格式的数据,后台接收并显示各个属性

    我的表单如下: <form onsubmit="return false"> <ul> <li><span>用户名</span ...

随机推荐

  1. svn 图标状态说明

    http://blog.csdn.net/coslay/article/details/41980131

  2. 微信小程序自定义tabbar的问题

    个人感觉小程序的tab样式自定义的能力有所欠缺,不够美观,于是今天自己diy了一个tab 测试的时候发现,无论是使用navigator跳转(会出现点击的效果)还是用bindtap(触摸),因为没有定义 ...

  3. online learning,batch learning&批量梯度下降,随机梯度下降

    以上几个概念之前没有完全弄清其含义及区别,容易混淆概念,在本文浅析一下: 一.online learning vs batch learning online learning强调的是学习是实时的,流 ...

  4. (转)如何转载CSDN的文章

    前言   对于喜欢逛CSDN的人来说,看别人的博客确实能够对自己有不小的提高,有时候看到特别好的博客想转载下载,但是不能一个字一个字的敲了,这时候我们就想快速转载别人的博客,把别人的博客移到自己的空间 ...

  5. ThreadDeath 理解

    public class RunnableTest2 { public static Object obj1 = new Object(); public static Object obj2 = n ...

  6. Linux运行环境搭建(一)——安装JDK

    下载Linux版jdk 官网:http://www.oracle.com/technetwork/java/javase/downloads/index.html 解压并拷贝到指定目录 tar zxv ...

  7. Licp - 一个玩具解释器的实现

    纸上得来终觉浅,绝知此事要躬行. 最近看了 SICP,其第四章讲述了一个简单的 Scheme 解释器的实现.粗看了一遍后决定自己用 C 语言实现一个残疾的 Scheme 解释器,想来这样的学习效果应该 ...

  8. CF1109B Sasha and One More Name

    CF1109B Sasha and One More Name 构造类题目.仔细看样例解释能发现点东西? 结论:答案只可能是 \(Impossible,1,2\) . \(Impossible:\) ...

  9. tableau-交互筛选器

    欢迎观看这段关于“交互筛选器”的视频.   将字段拖到筛选器功能区就可以轻松执行筛选,但是如果我们希望能够直接从视图中修改筛选器 选择项,那该怎么办?如果我们在可看到“子类别”字段的任何位置右键单击, ...

  10. 通过以太坊发行代币(token)

    2017年开始,区块链ICO项目层出不穷,市场热度一波更胜一波,很多ICO都是通过以太坊智能合约发行自己的代币(token),具体怎样才能发行代币呢?本文进行具体详细的介绍. 准备工作 以太坊官网ER ...