methodOverride中间件必须结合bodyParser中间件一起使用,为bodyParser中间件提供伪HTTP方法支持.

index.html代码:

 <!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
function submitData(){
var form=document.getElementById("form1");
var formData=new FormData(form);
var xhr=new XMLHttpRequest();
xhr.open("post","index.html",true);
xhr.onload= function () {
if(this.status==200)
document.getElementById("res").innerHTML=this.response;
};
xhr.send(formData);
}
</script>
</head>
<body>
<form id="form1">
姓:<input type="text" id="txtFirstName" name="firstname" value="郭" />
名:<input type="text" id="txtUserName" name="username" value="延思" />
<input type="button" value="提交" onclick="submitData();" />
</form>
<div id="res"></div>
</body>
</html>

服务器段代码server.js

var express=require("express");
var fs=require("fs");
var app=express();
app.use(express.bodyParser());
app.get("/index.html", function (req,res) {
res.sendfile(__dirname+"/index.html");
});
app.post("/index.html", function (req,res) {
var str="";
for(var k in req.body){
str+="键是:"+k+" 值是:"+req.body[k]+"<br/>";
}
res.send(str);
});
app.listen(1337,"127.0.0.1", function () {
console.log("开始监听1337");
});

让程序走起来:

现在对上面的代码进行修改:

 var express=require("express");
var fs=require("fs");
var app=express();
app.use(express.bodyParser());
app.get("/index.html", function (req,res) {
res.sendfile(__dirname+"/index.html");
});
app.put("/index.html", function (req,res) {
var str="";
for(var k in req.body){
str+="键是:"+k+" 值是:"+req.body[k]+"<br/>";
}
res.send(str);
});
app.listen(1337,"127.0.0.1", function () {
console.log("开始监听1337");
});

现在单击按钮后,会出现404错误,因为我们单击出发的是post,而服务器上是put事件.

现在想让服务器端依然是put接受,html上依然是post请求.

可以对代码作一下修改:

 var express=require("express");
var fs=require("fs");
var app=express();
app.use(express.bodyParser());
app.use(express.methodOverride("test"));
app.get("/index.html", function (req,res) {
res.sendfile(__dirname+"/index.html");
});
app.post("/index.html", function (req,res) {
var str="";
for(var k in req.body){
str+="键是:"+k+" 值是:"+req.body[k]+"<br/>";
}
res.send(str);
}); app.listen(1337,"127.0.0.1", function () {
console.log("开始监听1337");
});
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>向服务器上传文件</title>
<script type="text/javascript">
function submitData(){
var form=document.getElementById("form1");
var formData=new FormData(form);
var xhr=new XMLHttpRequest();
xhr.open("post","index.html",true);
xhr.onload= function () {
if(this.status==200)
document.getElementById("res").innerHTML=this.response;
};
xhr.send(formData);
}
</script>
</head>
<body>
<form id="form1">
<input type="hidden" name="test" value="put"/>
姓:<input type="text" id="txtFirstName" name="firstname" value="郭" />
名:<input type="text" id="txtUserName" name="username" value="延思" />
<input type="button" value="提交" onclick="submitData();" />
</form>
<div id="res"></div>
</body>
</html>

让程序跑起来 就和一开始的结果是一样的了.

node中express的中间件之methodOverride的更多相关文章

  1. node中express的中间件之cookieParser

    cookieParser中间件用于获取web浏览器发送的cookie中的内容.在使用了cookieParser中间件后, 代表客户端请求的htto.IncomingMessage对象就具有了一个coo ...

  2. node中express的中间件之basicAuth

    basicAuth中间件为网站添加身份认证功能.在使用了该中间件后, 用户访问网站时必须输入用户名与密码,在用户输入了用户名与密码并通过验证之后才能访问网站. 当用户输入的用户名和密码符合条件,中间件 ...

  3. 对于Node中Express框架的中间件概念的感知

    中间件是什么呢? 中间件就是客户端http请求发起传送到服务器和服务器返回响应之间的一些处理函数. 为什么要使用中间件? 通过中间件,可以对数据进行操作使得我们能方便地操作请求数据编写服务器响应.如b ...

  4. 77.深入理解nodejs中Express的中间件

    转自:https://blog.csdn.net/huang100qi/article/details/80220012 Express是一个基于Node.js平台的web应用开发框架,在Node.j ...

  5. 使用express+multer实现node中的图片上传

    使用express+multer实现node中的图片上传 在前端中,我们使用ajax来异步上传图片,使用file-input来上传图片,使用formdata对象来处理图片数据,post到服务器中 在n ...

  6. Express ( MiddleWare/中间件 路由 在 Express 中使用模板引擎 常用API

    A fast, un-opinionated, minimalist web framework for Node.js applications. In general, prefer simply ...

  7. node.js中express框架的基本使用

    express是一个基于node.js平台的,快速,开放,极简的web开发框架. 一.安装 express npm install express --save 二.简单使用 express //引入 ...

  8. body-parser Node.js(Express) HTTP请求体解析中间件

    body-parser Node.js(Express) HTTP请求体解析中间件 2016年06月08日     781     声明 在HTTP请求中,POST.PUT和PATCH三种请求方法中包 ...

  9. node 进阶 | 通过node中如何捕获异常阐述express的特点

    node如何捕获异常 node基于js的单线程,有了非阻塞异步回调的概念,但是在处理多个并发连接时,并发环境要求高,最重要的是单线程,单核CPU,一个进程crash则web服务都crash,但是为什么 ...

随机推荐

  1. XML 测验

    测试地址http://www.w3school.com.cn/quiz/quiz.asp?quiz=xml 1.XML指的是? 您的回答:eXtensible Markup Language 2.XM ...

  2. Makefile.am文件的实例讲解

    Makefile.am是一种比Makefile更高层次的编译规则,可以和configure.in文件一起通过调用automake命令,生成Makefile.in文件,再调用./configure的时候 ...

  3. spring boot 教程(一) 构建我的第一个Spring boot

    Spring Boot特点 1. 创建独立的Spring应用程序 2. 嵌入的Tomcat,无需部署WAR文件 3. 简化Maven配置 4. 自动配置Spring 5. 提供生产就绪型功能,如指标, ...

  4. Vue学习笔记 ——v-html

    v-html: 在网页中,后台传来的json数据中包含html标签,将该json数据绑定到Vue.js中对象中,对该对象进行for循环,发现数据中的html标签不能被解析,而是当作字符显示出来 解决: ...

  5. (效果四)jst如何判断对象是否为空?

    前言:在实现业务逻辑的过程中,很多工程师都会遇到需要判断一个对象,数组是否为空的情景,很多时候我们在请求数据的时候都需要判断请求的对象数据是否为空,如果直接使用,在数据请求为空时,控制台就会报错.因此 ...

  6. JVM原理二----JAVA虚拟机体系结构

    组成: 指令集,寄存器,栈,无用单元收集(GC),方法区域.JAVA核心 1,指令集:这个不太清楚 2,寄存器:和处理器中的寄存器类似 pc:Java程序计数器. optop:指向*作数栈顶端的指针. ...

  7. 我在ubuntu14.04安装使用的软件

    搜狗拼音sougoupinyin:sudo add-apt-repository ppa:fcitx-team/nightly && sudo apt-get updatesudo a ...

  8. getPropertyValue (实现 js框架中 css 的最终调用的函数)

    ,取得元素最终计算出的css 样式 var a = document.getElementById("content");    alert("style "+ ...

  9. BZOJ2120 数颜色 【带修莫队】

    BZOJ2120 数颜色 Description 墨墨购买了一套N支彩色画笔(其中有些颜色可能相同),摆成一排,你需要回答墨墨的提问.墨墨会像你发布如下指令: 1. Q L R代表询问你从第L支画笔到 ...

  10. BZOJ3083 遥远的国度 【树链剖分】

    BZOJ3083 遥远的国度 Description zcwwzdjn在追杀十分sb的zhx,而zhx逃入了一个遥远的国度.当zcwwzdjn准备进入遥远的国度继续追杀时,守护神RapiD阻拦了zcw ...