2016-05-31 151 views
0

我我的本地机器上运行两个应用程序烧瓶请求数据。HTTP从本地服务器

1)我的测试客户端的网站(在端口5001)

2)我的API(在端口5000)

如果键入127.0.0.1:5000/search/到我的浏览器,我得到如下:

Test Hello World 

如果键入127.0.0.1:5001到我的浏览器我得到一个包含以下HTML代码的普通网页(这一切看起来OK):

<!DOCTYPE html> 
<html> 
<body> 

<button type="button" onclick="loadDoc()">Request data</button> 

<p id="demo">TEST</p> 

<script> 

function loadDoc() { 
    var xhttp = new XMLHttpRequest(); 
    xhttp.onreadystatechange = function() { 
    if (xhttp.readyState == 4 && xhttp.status == 200) { 

     document.getElementById("demo").innerHTML = xhttp.responseText; 
    } 
    }; 
    xhttp.open("GET", "127.0.0.1:5000/search/", true); 
    xhttp.send(); 
} 
</script> 

</body> 
</html> 

正如你所看到的HTTP请求发送到该测试并在浏览器中工作,应返回Test Hello World但遗憾的是没有任何反应127.0.0.1:5000/search/

基本上,我点击“请求数据”按钮(见上文),绝对没有任何反应。

任何想法,为什么?我一直坚持这几个小时。

回答

2

出于安全原因,浏览器限制从脚本内发起的跨源HTTP请求。例如,XMLHttpRequest遵循同源策略。因此,使用XMLHttpRequest的Web应用程序只能向自己的域发出HTTP请求。为了改进Web应用程序,开发人员要求浏览器供应商允许XMLHttpRequest发出跨域请求。

这些资源可能会有所帮助;
HTTP access control (CORS)
Using CORS

0
"127.0.0.1:5000/search/" 

您的网址缺少的方案。你需要用http://作为前缀。

如果你打开浏览器的开发者工具,并期待在网络选项卡,你应该会列出一个404错误。


一旦你解决这个问题,它很可能为this question

描述,你就会有一个跨源错误