XMLHttpRequest - 来自 javascript 的 REST答案

【问题标题】：XMLHttpRequest - REST from javascriptXMLHttpRequest - 来自 javascript 的 REST
【发布时间】：2015-11-04 15:35:15
【问题描述】：

我的本地主机上运行着一个网络服务器。如果我从我的网络服务器加载我的网页，一切正常。我可以使用我的网络服务器打开一个 REST 会话。

JS代码：--

$(document).ready(function() {

                      var xhr = new XMLHttpRequest();
                      var open_str = "http://localhost:8080/vscp/rest?user=admin&password=d50c3180375c27927c22e42a379c3f67&format=json&op=1";
                      xhr.open("GET", open_str, true);
                      xhr.onreadystatechange = function() {
                                  alert(xhr.readyState + "" + xhr.status);
                        if (xhr.readyState == 4 && xhr.status == 200) {

                            alert("session opend success");

                            var json = JSON.parse(xhr.responseText);
                            alert(JSON.stringify(json, null, 10));

                        }
                      }
                      xhr.send();
});

HTML 代码：--

<!DOCTYPE html>
<html>
    <head>
        <title>Hello jQuery</title>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
        <script src="hello.js"></script>
    </head>

    <body>
        <div>
            <p class="greeting-id">Trying to open the REST session with vscpd </p>
        </div>
    </body>
</html>

现在，如果我从 D: 驱动器加载相同的 html 页面：--

file:///D:my_folder/htm_test.html

我收到以下错误“不存在‘Access-Control-Allow-Origin’标头”。我已经检查了 xhr.readyState 为 4 且 xhr.status 为 0 的 javascript 代码。

请建议对我的 javascript 代码进行哪些更改，这样，如果我使用 file:/// 直接从我的 D: 驱动器打开 html 文件，那么我的网络服务器也会正确打开 REST 会话。

========================== JSONP代码==================== ====

$(document).ready(function() {

                      var url = "http://localhost:8080/vscp/rest?user=admin&password=d50c3180375c27927c22e42a379c3f67&format=json&op=1";

                      function jsonpCallback(response) {

                          alert('success');
                      }

                      $.ajax({
                          url: url,
                          dataType: 'jsonp',
                          error: function(xhr, status, error) {
                                     alert("error" + "  " + error.message);
                          },
                          success: jsonpCallback
                      });
                      return false;
});

我得到的错误：-- 服务器正在发送正确的响应：-- {"success":true,"code":1,"message":"success","description":"Success","session-id":"e5a36e14b687c37b615dbc6a9506df5c","nEvents":0}

但是 ajax 调用给这个响应错误，即“Uncaught SyntaxError: Unexpected token :”

【问题讨论】：

标签： javascript rest xmlhttprequest

【解决方案1】：

这是因为 Chrome 和其他一些浏览器出于安全原因阻止了本地文件，我认为没有解决此问题的方法。您必须使用网络服务器。

【讨论】：

【解决方案2】：

您遇到了Same Origin Policy - 这是一种安全机制，可限制从一个域加载的 JavaScript 将请求发送到另一个域。

周围有various ways，如果你使用的是谷歌浏览器，我建议在启动浏览器时使用setting the --allow-file-access-from-files flag，Firefox 也可以使用provides a way to work around it，但不要忘记在完成测试后禁用这些选项，他们在那里是有充分理由的！

【讨论】：

我不能用javascript做吗？？
不，同源策略旨在阻止恶意 JavaScript 做它不应该做的事情 - 如果可以从 JavaScript 代码中“关闭”它，这将使整个事情变得毫无意义。
是的，JSONP 是上面链接中列出的方法之一，但您将不再使用 AJAX/XMLHttpRequest 并且需要更改您的服务器端代码。
我尝试了 JSONP，但出现了一些错误 .. 请查看我编辑的原始帖子 .. 请提出现在缺少的内容
您需要将 JSONP 响应中返回的数据更改为有效的 JavaScript 语句，尝试将 JSON 对象分配给变量，例如 var obj = {"success":true," .... }