Express4.x中res.format()的用法

最新推荐文章于 2025-09-24 14:49:55 发布

原创最新推荐文章于 2025-09-24 14:49:55 发布 · 1.2k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#express #node-js

node-js 同时被 2 个专栏收录

11 篇文章

订阅专栏

express

8 篇文章

订阅专栏

本文介绍Express框架中res.format方法的功能及应用，通过示例展示如何根据客户端请求头的Accept属性发送不同格式的数据响应。

res.format的作用是根据request heards所能接受的格式，来响应不同的内容。来看个例子：

这是服务端路由程序 router.js

var express = require('express');
router.get('/', function (req, res) {
    res.send('this is a router base page!');
});

router.get('/index2.html', function (req, res) {
    res.sendFile(__dirname + '/index2.html');
});

router.post('/index2.html', function (req, res) {
    res.format({
        'text/plain': function () {
            res.send('hey, i am text');
        },

        'text/html': function () {
            res.send('<input type="button" value="i am html">');
        },

        'application/json': function () {
            res.send({ message: 'hey, i am json' });
        },

        'default': function () {
            // log the request and respond with 406
            res.status(406).send('Not Acceptable');
        }
    });
});

module.exports = router;

这是服务端app.js

var express = require('express');
var app = express();
var router = require('./router.js');
app.get('/', function (req, res, next) {
    res.send('this is home page!');
    next();
});
app.use('/base', router);
app.listen(1338);

这是客户端index2.html
用Ajax来实现表单提交，数据交互：

<!DOCTYPE html>
<html>

<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />

    <script>
        function submitData() {
            var obj = {
                firstname: document.getElementById('txtFirstName').value,
                lastname: document.getElementById('txtLastName').value,
            };
            var xhr = new XMLHttpRequest();
            xhr.open('POST', 'index2.html', true);
            xhr.setRequestHeader('Accept', 'text/html');//注意请求头的设置，如果没有这句话，无法正常响应。
            xhr.onload = function (e) {
                if (this.status == 200) {
                    document.getElementById('result').innerHTML = this.response;
                }
                if(this.status == 406) {
                    document.getElementById('result').innerHTML = this.response;
                }
            };
            xhr.send(obj);
        }
    </script>
</head>

<body>
    <form id="form1">
        firstname:
        <input type="text" id="txtFirstName" name='firstname' value='ss' /></br>
        lastname:
        <input type="text" id="txtLastName" name="lastname" value="ll" /></br>
        <input type="button" value="submit" onclick="submitData()" />
    </form>
    <output id="result"></output>
</body>


</html>

当我们把请求头设置成接受text/html文件时，在客户端可以打印出：

这里写图片描述

如果在AJAX里面这么设置请求头：

xhr.setRequestHeader('Accept', 'application/json');

那么浏览器显示如下结果：

这里写图片描述

如果我把请求头改成一个format里面没有的格式：

xhr.setRequestHeader('Accept', 'image/png');

看浏览器结果：

这里写图片描述

406表示无法使用请求的内容特性来响应请求的网页。

res.status(406).send('Not Acceptable');

这句话表示http状态在406的时候输出 ‘Not Acceptable’。