Question

我下面有这段代码，这是我的节点服务器中的app.js。当前，当使用HTML2Canvas下载画布时，我的网站存在一些CORS问题。但是我不确定为什么即使添加了CORS标头后仍然不起作用，我在下面的代码中做错了吗？任何帮助将不胜感激，谢谢。

const express = require('express');
const cors = require('cors')
const path = require('path');
const bodyParser = require('body-parser')

const app = express();

app.options('/home', cors()) 

app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'pug');

// parse application/x-www-form-urlencoded
app.use(bodyParser.urlencoded({ extended: false }))

// parse application/json
app.use(bodyParser.json())

app.use(express.static(path.join(__dirname, 'public')));

app.get('/', function(req, res){
    res.render('index');
})
app.get('/home', function(req, res){
    res.render('home');
})

app.listen(3000, function(){
    console.log('Server started on port 3000...');
});

Answer 1

您可以安装expressjs/cors并像这样简单地编写服务器：

const express = require('express');
const cors = require('cors');

const app = express();

app.use(cors());

它将为您添加必需的标题。

CORS飞行前

如果您已经添加了标头，但仍然无法正常工作，则可能应启用CORS preflight。

进一步了解CORS飞行前here。

Answer 2

从原点“ http://localhost:3000”到“ // link”的图像访问已被CORS策略阻止：所请求的资源上没有“ Access-Control-Allow-Origin”标头。因此，不允许访问来源“ http://localhost:3000”。

您已向后配置CORS。

您正在尝试从//link（显然不是真实的URL，但我假设您已经对其进行了混淆）加载图像，但是您已在http://localhost:3000上配置了CORS。

CORS权限必须由您从中加载数据的服务器授予。

您无法授予自己的代码许可权，以读取其他服务器愿意与浏览器所有者共享的数据。

否则，运行evil-hacker.example.com的Malery可以使用CORS授予其JS权限，以读取从gmail.com发送到访问者浏览器的数据。那将是一个巨大的安全问题！

在NodeJS中启用CORS

2 个答案:

CORS飞行前