Express处理GET/POST请求(POST请求包含文件)
Express处理GET/POST请求(POST请求包含文件)
GET
使用简洁的pug模板引擎,写一个表单,提交方法是GET
前端页面代码
enctype,默认是application/x-www-form-urlencode
doctype html
html
form(action="/ex_get" method="GET")
label(for="fieldName") 名字:
input(type="text" id="fieldName" name="name")
label(for="fieldEmail") 邮箱:
input(type="email" id="fieldEmail" name="email")
input(type="submit" value="提交")
PUG渲染页面
Express处理GET请求代码
const express = require("express")
// POST需要用到body-parser,GET不需要require
// const bodyParser = require(body-parser)
const app = express()
let port = process.env.port || 3000
app.set("view engine", "pug")
// app.use(bodyParser.urlencoded({ extended: true }))
app.get("/", (req, res) => {
res.render("get",{})
})
app.get("/ex_get", (req, res) => {
let response = {
name: req.query.name,
email: req.query.email
}
res.send(JSON.stringify(response))
})
app.listen(3000, () => {
console.log(`running on port: ${port}`)
})
Express获取GET的数据,并返回到页面上
POST
前端页面代码
相对GET,改了method字段为POST,有file字段必须将enctype等于multipart/form-data并且为了让POST发挥它的优点,增加了fileinput字段。这里上传了一张avatar.jpg的图片。
doctype html
html
form(action="/ex_post" method="POST" enctype="multipart/form-data")
label(for="fieldName") 名字:
input(type="text" id="fieldName" name="name")
label(for="fieldEmail") 邮箱:
input(type="email" id="fieldEmail" name="email")
input(type="file" name="avatar")
input(type="submit" value="提交")
渲染页面:
const express = require("express")
const bodyParser = require("body-parser")
// 解析带文件上传的表单需要
const formidable = require("formidable")
const app = express()
let port = process.env.port || 3000
app.set("view engine", "pug")
app.use(bodyParser.urlencoded({ extended: true }))
app.get("/", (req, res) => {
res.render("post",{})
})
app.post("/ex_post", (req, res) => {
var form = new formidable.IncomingForm()
form.parse(req, function(err, fields, files) {
if (err) return res.redirect(303, '/error')
let response = {
fields,
files
}
res.send(response)
})
})
app.listen(3000, () => {
console.log(`running on port: ${port}`)
})
Express使用formidable作为解析文件的模块,将解析表单结果返回到页面上,除了name和email字段,其余信息都是文件的。
最后,你可以对上传到的文件进行存储,目前有三种方案:
- 文件系统持久化,就是把文件数据存到
扁平文件【扁平的意思是文件没有任何结构,只是一串字节】,性能不好 - 云持久化,比如亚马逊S3,微软Azure
- 数据库持久化,这是目前最常用的,在NODE应用中,大多使用MongoDB进行存储。
Express处理GET/POST请求(POST请求包含文件)的更多相关文章
- HttpURLConnection发送POST请求(可包含文件)
import java.io.BufferedReader; import java.io.DataOutputStream; import java.io.File; import java.io. ...
- node.js的express模块实现GET和POST请求
一.环境 1.安装express npm i express@4.17.1 // 安装express模块 2.安装nodemon npm i nodemon -g 3.安装cors npm insta ...
- http请求参数中包含特殊字符的严重后果,比如:#
URL请求中不能包含特殊符号,比如:# 今天在调接口,突然发现接口参数中传递的数据没有完全接收到controller层的model模型中,反反复复测了好几遍,真不信这个邪了,头晕脑胀的时候才关注到UR ...
- ServletRequest HttpServletRequest 请求方法 获取请求参数 请求转发 请求包含 请求转发与重定向区别 获取请求头字段
ServletRequest 基本概念 JavaWeb中的 "Request"对象 实际为 HttpServletRequest 或者 ServletRequest, ...
- jmeter接口测试-GET请求路径中包含特殊字符或中文导致Response400报错
问题描述:接口测试中异常用例GET请求路径中包含特殊字符或中文,运行jmeter会报错,取样器中只能看到Response400,响应结果为空 解决思路: 对于通过BODY发送的中文内容可以用Jmete ...
- 接口测试时如何选择Encoding(针对请求数据内包含中文)
如果请求数据中包含中文,需要将Encoding选择为utf-8
- 请求转发、包含、重定向 getAttribute 和 setAttribute POST和GET编码
一.请求转发 请求包含 请求重定向 Demo5.java 注意:doPost()方法中别忘写doGet(request, response); public void doGet(HttpS ...
- Jmeter 请求参数中包含 MD5 加密的密码
如何在jmeter中对参数进行加密 使用工具:java+myeclipse 让开发将他的加密类从eclipse中导出来打成jar包,放在jmeter安装文件夹lib文件夹中%JMETER HOME%\ ...
- c#代码发送post请求,上传文件(并带其他参数)
本人对post理解不深,前段时间遇到一个需要用c#代码发送post请求上传文件的业务,于是参考了几篇帖子,加上自身实践写出了如下代码.写的比较low 望各位大大指正^_^. 业务需求: 对方给了一个接 ...
随机推荐
- [Leetcode] container with most water 最大水容器
Given n non-negative integers a1 , a2 , ..., an , where each represents a point at coordinate (i, ai ...
- day10_plus
刚才发奖哈哈哈 想不到被惨虐的我还能混个牌子哈哈哈好开心
- python3处理pdf
https://github.com/1049451037/pdfminer3k 使用pdfminer3k,如果是python2的话直接用pdfminer就行了. python setup.py in ...
- jsonArray与jsonObject
最近两个星期接触最多的就是json和map了. 之前用到的json,就是一个键对应一个值,超级简单的一对一关系.现在用到的json那可以层层嵌套啊,刚开始接触的时候,确实有种崩溃的赶脚,不想去理,取个 ...
- mysql__索引的设计和使用
索引的设计和使用 1 索引概述 MySIAM和InnoDB存储引擎的表默认创建的都是BTREE索引,MySQL目前不支持函数索引,但是支持前缀索引.还支持全文本索引,但是只有MySIAM(5.0开始) ...
- AngularJs学习——实现列表内容项的增加删除
效果截图: 说明:引入bootstrap.min.css样式库和angular.min.js的静态资源库,实现列表内容的增加和删除操作. AngularJS代码: <script src=&qu ...
- Spring任务调度<task:scheduled-tasks>【含cron参数详解】 (转载)
Spring内部有一个task是Spring自带的一个设定时间自动任务调度 task使用的时候很方便,但是他能做的东西不如quartz那么的多! 可以使用注解和配置两种方式,配置的方式如下 引入Spr ...
- jspersonft有关Table数据绑定(一)
一:前言 在公司来就学着做报表,觉得这个报表学着还是很有意义的.jspersonft我在网上搜了一些有关的资料但是不是很多,现在就是学一点就记载一点.好记性不如烂笔头嘛! 二:在jspersonft定 ...
- SCC模板
vector<int> G[maxn]; int pre[maxn], low[maxn], c[maxn]; int n, m; stack<int> s; int dfst ...
- Mysql添加视图
有时候复杂的查询需要创建视图,可以简化查询.我们也可以将视图包装成对象,这样查询后在Java中也可以直接封装为对象. 原来的表结构