练习(一): “Hello World!”
制作一个浏览 /home 页面时会输出「Hello World!」的 Express.js app 。
{appname} 会将监听的 port 放在第一个参数,如 process.argv[2] 。
提示
建立一个监听 port 3000 ,并在「/」返回字符串的 Express.js app 的程序代码如下:
const express = require('express')
const app = express()
app.get('/', function(req, res) {
res.end('Hello World!')
})
app.listen(3000)
请使用 process.argv[2] 替代固定的 port :
app.listen(process.argv[2])
solution
const express = require('express')
const app = express()
app.get('/home', function(req, res) {
res.end('Hello World!')
})
app.listen(process.argv[2])
练习(二): “Static”
不用任何的路由(route),使用 static middleware 回传 index.html 文件。
您的网站必须监听程序的第一个参数(process.argv[2])所提供的 port。
程序的第二个参数(process.argv[3])是 index.html 文件所在的路径。不过,您也可以使用您自己的文件,内容如下:
<html>
<head>
<title>expressworks</title>
<link rel="stylesheet" type="text/css" href="/main.css"/>
</head>
<body>
<p>I am red!</p>
</body>
</html>
提示
调用 static middleware 的方式如下:
app.use(express.static(path.join(__dirname, 'public')));
在这个作业中,{appname} 会传给您路径,所以您可以这样用:
app.use(express.static(process.argv[3]||path.join(__dirname, 'public')));
solution
const path = require('path')
const express = require('express')
const app = express()
app.use(express.static(process.argv[3]||path.join(__dirname, 'public')))
app.listen(process.argv[2])
练习(三): “Good Old Form”
编写一个可以处理 HTML 表单输入(<form><input name="str"/></form>),并且倒着印出str 值的路由(/form)。
提示
要处理 POST 请求可以使用 post() 方法,使用方式就跟str 值的路由(/form)一样。
app.post('/path', function(req, res){...})
Express.js 使用 middleware 提供更多功能给您的 web 服务器。
在您处理请求之前,Express.js 会引入一个 middleware 函数。
Middleware 提供许多不同的功能如记录(logging)、提供静态文件,以及错误处理。
对程序调用 use() ,并且把 middleware 当作参数传入,就可以加入 middleware。
Express.js 可以用 body-parser 模块的 urlencoded() 解析 x-www-form-urlencoded 请求的内容。
const bodyparser = require('body-parser')
app.use(bodyparser.urlencoded({extended: false}))
要了解 Connect middleware ,可以看这里:
body-parser 模块的文件在此:
把字串倒过来的方法如下:
req.body.str.split('').reverse().join('')
注意
在第一次执行你所建立的项目时,请先安装 body-parser 依赖
在你的终端上通过 npm 执行:
$ npm install body-parser
再次提醒,{appname} 会将监听的 port 放在第一个参数,如 process.argv[2] 。
solution
const express = require('express')
const bodyParser = require('body-parser')
const app = express()
app.use(bodyParser.urlencoded({extended: false}))
app.post('/form', function(req, res) {
res.send(req.body.str.split('').reverse().join(''))
})
app.listen(process.argv[2])
练习(四): “Stylish CSS”
使用 Stylus middleware 为您之前做的 HTML 加上css。
您的网站必须监听程序的第一个参数(process.argv[2])所提供的 port。
而 HTML 网页和 Stylus 文件会在程式的第二个参数(process.argv[3])提供(两个文件都在同一个文件夹)。您可也可以建立您自己的文件夹,然后使用下面两个文件:
main.styl 文件:
p
color red
index.html 文件:
<html>
<head>
<title>expressworks</title>
<link rel="stylesheet" type="text/css" href="/main.css"/>
</head>
<body>
<p>I am red!</p>
</body>
</html>
提示
要使用 stylus 这个 middleware,可以这样:
app.use(require('stylus').middleware(__dirname + '/public'));
您也要记得提供静态文件。
注意
如果是您自己的项目,需要先安裝 Stylus,就跟其他依赖一样:
npm install stylus
solution
const express = require('express')
const app = express()
app.use(require('stylus').middleware(process.argv[3]))
app.use(express.static(process.argv[3]))
app.listen(process.argv[2])
练习(五): “Param Pam Pam”
建立一个可以处理 PUT '/message/:id' 请求的 Express.js 服务器。
举个栗子:
PUT /message/526aa677a8ceb64569c9d4fb
这个请求的响应内容,是当前日期加上请求ID的哈希值(hash value)。
require('crypto')
.createHash('sha1')
.update(new Date().toDateString() + id)
.digest('hex')
提示
要处理这个 PUT 请求,可以用下面的方式:
app.put('/path/:NAME', function(req, res){...});
要从请求中解析出传来的参数,可以用:
req.params.NAME
solution
const express = require('express')
const app = express()
app.put('/message/:id', function(req, res){
const id = req.params.id
const str = require('crypto')
.createHash('sha1')
.update(new Date().toDateString() + id)
.digest('hex')
res.send(str)
})
app.listen(process.argv[2])
练习(六): “What's In Query”
编写一个路由(route),可以解析对 /search 网址发起的 GET 请求所带来的查询字符串。如:?results=recent&include_tabs=true ,并且把这个字符串以 JSON 格式输出。
提示
在 Express.js 里要解析查询参数,可以用:
req.query.NAME
要输出 JSON 格式,可以用:
res.send(object)
solution
const express = require('express')
const app = express()
app.get('/search', function(req, res){
const query = req.query
res.send(query)
})
app.listen(process.argv[2])
练习(七): “JSON Me”
编写一个会读取文件,把文件内容解析为JSON格式,并把结果输出给使用者的服务器。
process.argv[2] 会传入 port,process.argv[3] 则传入文件名称。
返回方式如下:
res.json(object)
服务器处理的路径是「/books」。
提示
要读取文件,可以使用 fs 模块,如:
fs.readFile(filename, callback)
而解析字符串可以用 JSON.parse 完成:
object = JSON.parse(string)
solution
const express = require('express')
const app = express()
const fs = require('fs')
app.get('/books', function(req, res){
const filename = process.argv[3]
fs.readFile(filename, function(e, data) {
if (e) return res.sendStatus(500)
try {
books = JSON.parse(data)
} catch (e) {
res.sendStatus(500)
}
res.json(books)
})
})
app.listen(process.argv[2])