我是节点,javascript的新手,但是当我尝试使用XMLHttpRequest进行get时,我遇到了一个没有Access-control-allow-origin的错误。我到处寻找解决方案,但似乎没有任何工作。
任何建议都会很棒。我很欣赏我真正希望能够在节点,javascript和html中获得更好的一切,所以如果你注意到我不应该做的事情,请告诉我。我还有一些重要的东西只是为了私密。
错误
XMLHttpRequest cannot load http://*************. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://************' is therefore not allowed access.
我的server.js的主要部分
var express = require('express');
var path = require('path');
var server = express();
var http = require('http');
var fs = require('fs');
var formidable = require("formidable");
var XMLHttpRequest = require("xmlhttprequest").XMLHttpRequest;
var xhr = new XMLHttpRequest();
var request = require("request");
var port = process.env.port || 63342;
// Define ./public as static
server.use(express.static(path.join(__dirname, 'public')));
//
// as you can see Ive added this to try to fix the problem
//
server.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();
});
//All POST's use processFormFieldsIndividual
server.post('*', processFormFieldsIndividual);
server.listen(port, function () {
console.log('listening on port ' + port);
});
test.js
function addTable() {
var uri = '***************';
var r = new XMLHttpRequest();
r.open("GET", uri, true);
console.log(r.toString());
r.onreadystatechange = function () {
if (r.readyState == 4 && (r.status == 201 || r.status == 200))
{
var json = JSON.parse(r.responseText);
// use json to make table in html logic
}
else
{
console.log("food");
}
};
r.send();
}
的index.html
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/html">
<head>
<script src="js/test.js"></script>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<meta name="description" content="">
<meta name="author" content="">
<link rel="icon" href="">
<!-- Bootstrap core CSS -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="css/jumbotron.css" rel="stylesheet">
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<img src="images/taskbar.png" alt="navbar-header" border="0">
</div>
<div id="navbar" class="navbar-collapse collapse"> </div><!--/.navbar-collapse -->
<br>
</div>
</nav>
<br>
<d
iv class=container2>
<form role="form" action="" method="post" enctype="multipart/form-data"> <fieldset>
/*
* my form logic goes here
*/
</fieldset>
</form>
<div id="metric_results">
<input type="button" id="create" value="Click here" onclick="Javascript:addTable()">
</div>
</div>
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="../../assets/js/vendor/jquery.min.js"><\/script>')</script>
<script src="js/bootstrap.min.js"></script>
</body>
</html>
答案 0 :(得分:0)
您好,您也需要添加它。
res.header('Access-Control-Allow-Methods','GET,PUT,POST,DELETE,OPTIONS');
答案 1 :(得分:0)
在错误代码框中,第一个http:// ************是我试图从
好的,您所查询的服务器不是您显示代码的服务器。
该服务器(iquana服务器)必须设置这些响应标头。您无法在 服务器代码或客户端代码中设置任何内容,以便为他们的服务器启用CORS。这些标题必须从您正在进行跨源调用的服务器发送回。