如何在express.js资产上设置响应头

Question

如何在express.js资产上设置响应头

javascriptnode.jsexpress

270

我需要在express提供的脚本中启用CORS。如何在返回的响应中设置这些头文件以用于public/assets？

- Dr.Knowitall

11个回答

106

这真是令人恼火。

好的，如果有任何人仍然存在问题或者不想添加其他库。您只需要在路由之前放置这个中间件代码行。

跨域示例

app.use((req, res, next) => {
    res.append('Access-Control-Allow-Origin', ['*']);
    res.append('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE');
    res.append('Access-Control-Allow-Headers', 'Content-Type');
    next();
});

// Express routes
app.get('/api/examples', (req, res)=> {...});

- Proximo

2

此点与顺序有关，这一点很重要。我想知道当更改它时是否真的很重要，因为我看到了不同的行为。好的，谢谢。 - Alejandro Teixeira Muñoz

3

好的，我会尽力进行翻译。原文：Nice: solved the problem perfectly. Adding an entire dependency to perform these 6 lines of code is not a road that I would recommend for anyone...翻译：不错，问题已经完美解决了。为了执行这六行代码而添加整个依赖包，并不是我会推荐给任何人的做法... - Alex Clark

23

简短回答:

res.setHeaders - 调用原生的 Node.js 方法
res.set - 设置头信息
res.headers - 别名为 res.set

- Charlie

17

你可以通过使用cors来实现。cors会处理你的CORS响应。

var cors = require('cors')

app.use(cors());

- Rahul Solanki

15

@klode的回答是正确的。

但是，您应该设置另一个响应头以使您的标题对其他人可访问。

例如：

首先，在响应头中添加“page-size”

response.set('page-size', 20);

然后，你需要做的就是暴露你的标题

response.set('Access-Control-Expose-Headers', 'page-size')

- kpanodrean

1

我卡了一个多小时，试图弄清楚为什么我的自定义标头都没有传递到另一端。暴露它们是答案。非常感谢！为什么这个标头在Express文档中没有任何提及（或者在我迄今为止阅读的任何有关自定义标头的文章中）是非常令人困惑的。 - Devin Spikowski

2

如果你有两个头部信息怎么办？像这样：

res.set("...","...");
res.set("...","....");

现在你该如何暴露这两个头部信息？ - Cursor

3

我发现如何阅读文档：

Access-Control-Expose-Headers: *
// 或者
Access-Control-Expose-Headers: , , ...

（翻译注释：这是一个HTTP响应头的设置，用于指定允许客户端访问哪些在响应中暴露的header信息。第一行中的星号表示允许所有header信息被访问，第二行则通过逗号分隔指定具体可访问的header名称。） - Cursor

11

service.use(function(req, res, next) {
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Methods", "GET,HEAD,OPTIONS,POST,PUT");
    res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept, Authorization");
    next();
  });

- Thitikan Choeibamrung

9

您还可以添加一个中间件来添加CORS头，类似以下代码即可：

/**
 * Adds CORS headers to the response
 *
 * {@link https://en.wikipedia.org/wiki/Cross-origin_resource_sharing}
 * {@link http://expressjs.com/en/4x/api.html#res.set}
 * @param {object} request the Request object
 * @param {object} response the Response object
 * @param {function} next function to continue execution
 * @returns {void}
 * @example
 * <code>
 * const express = require('express');
 * const corsHeaders = require('./middleware/cors-headers');
 *
 * const app = express();
 * app.use(corsHeaders);
 * </code>
 */
module.exports = (request, response, next) => {
    // http://expressjs.com/en/4x/api.html#res.set
    response.set({
        'Access-Control-Allow-Origin': '*',
        'Access-Control-Allow-Methods': 'DELETE,GET,PATCH,POST,PUT',
        'Access-Control-Allow-Headers': 'Content-Type,Authorization'
    });

    // intercept OPTIONS method
    if(request.method === 'OPTIONS') {
        response.send(200);
    } else {
        next();
    }
};

- magikMaker

9

在npm上，至少有一个处理Express中CORS的中间件：cors。请注意，HTML标签应保留，但不需要对其进行解释。

- mscdex

7

首先在响应头中添加“field”

response.set('field', 'value');

你需要做的是暴露你的标头

response.set('Access-Control-Expose-Headers', 'field')

- guinogueiras

0

使用最新版本的express.js 4.18.2：

如果您正在使用static中间件，并希望更改响应标头，您应该：

app.use(express.static('./', {
  setHeaders: function(res) {
    res.set("Content-Security-Policy", "default-src 'self'");
  }
}));

- Ridd

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- klode · Accepted Answer

在npm上至少有一个中间件可用于处理Express中的CORS： cors。[请参阅@mscdex的回答]

以下是从ExpressJS文档中设置自定义响应标头的方法。

res.set(field, [value])

将标题字段设置为值

res.set('Content-Type', 'text/plain');

或者传递一个对象以一次性设置多个字段。

res.set({
  'Content-Type': 'text/plain',
  'Content-Length': '123',
  'ETag': '12345'
})

别名为

res.header(field, [value])