Node.Js 错误“请求中不存在 'Access-Control-Allow-Origin' 标头”

Posted 2023-02-22

【中文标题】Node.Js 错误“请求中不存在 \'Access-Control-Allow-Origin\' 标头”

【英文标题】：Node.Js error "No 'Access-Control-Allow-Origin' header is present on the requested"Node.Js 错误“请求中不存在 'Access-Control-Allow-Origin' 标头”

【发布时间】：2016-09-24 18:01:04

【问题描述】：

这个问题与其他问题相似；但是有一个区别，它为什么不工作会让人很困惑。

我的 javascript 调用了 6 个 json 文件并且都正常工作。在 Node.JS 中，我设置了 cors 和 headers，如下所示：

var fs = require('fs');
var http = require("https");
var express = require('express');
var app = express();
var path = require('path');
var http = require("http");
var url = require("url");
var req = require('request')
var pem = require('pem');
var cors = require("cors");

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

app.listen(process.env.PORT || 8080);

app.options('*', cors()); 

app.use(function(req, res, next) 
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Headers", "Origin, X-Requested-  With, Content-Type, Accept");
    next();   
);

app.all('/posts', function(req, res)
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
);

app.get('/', function (req, res)  
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept"); 
    res.writeHead(200, 'Content-Type': 'text/plain');
    contents = fs.readFileSync("sliderImages.json", "utf8");
    console.log(path.join(__dirname, '/sliderImages.json'));
    res.end(contents);
);

所有 6 个 json 文件都是由 Node JS 从绝对 URL 路径中抓取的。我昨天又做了两个，一切正常。但是，今天我做了一个并以相同的方式实现并收到以下错误：

请求的资源上不存在“Access-Control-Allow-Origin”标头。因此不允许访问 Origin 'null'。

我以相同的方式实现每个，例如：

var base_url = 'http://127.0.0.1:8080';

mainInformationTop();

function mainInformationTop()

    $.ajax(
        type: "GET", 
        url: base_url + "/api/topInformation.json", 
        dataType: "json",
        success: function(response)
        
            var json_obj = response.mainDescription;
            var imagesSlider="";
            var imagesSliderDescription ="";
            for (var i = 0; i< json_obj.length; i++) 
            

            

        
        , 
        error: function(jqXHR, textStatus, errorThrown) 
            alert(jqXHR.status);
          
    )    

我认为 json 文件不相关，但下面是我的 json 文件：

"mainDescription":[

"display": "my display",
"description" : "my description"

]

我已经取出 for 循环中的信息进行测试以及我的追加，因为不相关。由于某种原因，它失败并出错而不是成功。所有其他调用都以相同的方式设置并正常工作。

【问题讨论】：

我试过了，其他都很好。

@User555：为什么？服务器似乎没有生成 JSONP。

切换到 jsonP 会让它们都失败

我认为只输入 json 就可以了，因为我不需要回调。其余的也只使用 json

@User555 这完全没有意义。你知道 JSONP 是什么吗？

【参考方案1】：

安装cors

npm install cors --save

在您的 app.js 中编写此代码

const cors = require('cors');
const express = require('express');
let app = express();
app.use(cors());
app.options('*', cors()); //put this before your route 

【参考方案2】：

我也遇到了这个问题，代码和上面一样，但我们想把代码放在起点。不要将此代码放在最后，这意味着在 (res.end()) 向客户端发送响应之前。三种方法（GET、POST、HEAD）允许你将这段代码放在我认为的任何地方，但对于其他方法尝试这个并尝试使用其他模块，如 cors、express 但我只使用了 http 模块

var server=http.createServer(function (req, res) 

res.setHeader("Access-Control-Allow-Origin","*");
res.setHeader("Access-Control-Allow-Methods","PUT,GET,DELETE,PATCH")
res.setHeader('Access-Control-Allow-Credentials', true)
res.setHeader('Access-Control-Allow-Headers','X-Requested-With,content-type,Origin,Accept,Authorization')
// your other code followes

【参考方案3】：

这是this answer 的一个更简单的版本，实现了相同的效果：

var fs = require('fs');
var express = require('express');
var cors = require('cors');

var app = express();

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

app.get('/', function (req, res)  
  res.writeHead(200, 'Content-Type': 'text/plain');
  contents = fs.readFileSync('sliderImages.json', 'utf8');
  res.end(contents);
);

app.listen(process.env.PORT || 8080);

【参考方案4】：

修复它。

var fs = require('fs');
var http = require("https");
var express = require('express');
var app = express();
var path = require('path');
var http = require("http");
var url = require("url");
var req = require('request')
var pem = require('pem');
var cors = require("cors");

app.use(function(req, res, next) 
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
  next();
);
app.use(express.static(path.join(__dirname, '../')));

app.listen(process.env.PORT || 8080);

app.options('*', cors()); 

app.all('/*', function (req, res, next) 
    res.header("Access-Control-Allow-Origin", "http://localhost:8080");
    res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE');
    res.header("Access-Control-Allow-Headers", "X-Requested-With,     Content-Type");
    next();
);

app.get('/', function (req, res)  
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept"); 
    res.writeHead(200, 'Content-Type': 'text/plain');
    contents = fs.readFileSync("sliderImages.json", "utf8");
    console.log(path.join(__dirname, '/sliderImages.json'));
    res.end(contents);
 );

尽管 cmets 说了什么，但我唯一真正改变的是将 app.use 移动到其他所有内容之前。这解决了问题。

【讨论】：

这是一个糟糕的解决方案，因为有方式太多重复的代码......你真的可以通过使用cors 模块的一行来实现所有这些。 ..

@Chris 我尝试了他的解决方案并且它有效。如果你能用解释展示一个更好的例子（并且它有效），我会标记你是对的。

我标记对了。顺便说一句，您如何发送指向特定答案的链接？这看起来非常有用。谢谢

您可以点击每个答案左下角的“分享”链接，并使用标准的markdown links