node.js - 图像资源和画布的nodejs跨域读取阻塞问题

Question

我有一个 nodejs 应用程序，cors 设置是使用 expressjs 中的 cors 包完成的。
我的 cors 设置代码是：

var whitelist = ['https://shajao.com', 'https://www.shajao.com'];
var corsOptions = {
    origin: function (origin, callback) {
        if (whitelist.indexOf(origin) !== -1) {
            callback(null, true)
        } else {
            callback(new Error('Not allowed by CORS'))
        }
    },
    allowedHeaders: ['Content-Type', 'Authorization', 'Content-Length', 'X-Requested-With', 'Accept'],
    methods: ['GET', 'PUT', 'POST', 'DELETE', 'OPTIONS'],
    optionsSuccessStatus: 200 // some legacy browsers (IE11, various SmartTVs) choke on 204
}
app.use(cors(corsOptions));
app.use(express.static(path.join(__dirname, '/public/')));

api 是从一个 angular 应用程序调用的，该应用程序可以完美地获得服务器响应。所以 cors 在这里工作得很好。但是图像资源被 cors 阻止了。

如果您想查看问题，请访问网址： https ://shajao.com/frames

示例图片网址： https ://api.shajao.com/uploads/frames/8cf9006f-0225-461b-a4f2-153737152274.png

Answer 1

跨域读取阻止 ( CORB ) 是一种新的 Web 平台安全功能。

参考：https ://www.chromium.org/Home/chromium-security/corb-for-developers

尝试先清除浏览器的缓存。

如果它不起作用，则必须为响应设置正确的“Content-Type”标头。