来自 Node.JS（使用 express）服务器的跨域 jQuery.getJSON 在 Internet Explorer 中不起作用答案

【问题标题】：Cross-domain jQuery.getJSON from a Node.JS (using express) server does not work in Internet Explorer来自 Node.JS（使用 express）服务器的跨域 jQuery.getJSON 在 Internet Explorer 中不起作用
【发布时间】：2011-11-27 15:42:01
【问题描述】：

这是一个烦人的问题，我不认为只有 IE 有这个问题。基本上我有一个 Node.js 服务器，我从中进行跨域调用以获取一些 JSON 数据进行显示。

这需要是一个 JSONP 调用，我在 URL 中提供了一个回调。我不确定的是，如何做到这一点？

所以网站 (domainA.com) 有一个带有这样的 JS 脚本的 HTML 页面（在 Firefox 3 中一切正常）：

<script type="text/javascript">
    var jsonName = 'ABC'
    var url = 'http://domainB.com:8080/stream/aires/' //The JSON data to get
    jQuery.getJSON(url+jsonName, function(json){                
       // parse the JSON data
       var data = [], header, comment = /^#/, x;                    
       jQuery.each(json.RESULT.ROWS,function(i,tweet){ ..... }
    }
    ......
</script>

现在我的 Node.js 服务器非常简单（我使用的是 express）：

var app = require('express').createServer();
var express = require('express');
app.listen(3000);

app.get('/stream/aires/:id', function(req, res){
  request('http://'+options.host+':'+options.port+options.path, function (error, response, body) {
      if (!error && response.statusCode == 200) {
          console.log(body); // Print the google web page.
        res.writeHead(200, {
             'Content-Type': 'application/json',
               'Cache-Control': 'no-cache',
             'Connection': 'keep-alive',
               'Access-Control-Allow-Origin': '*',
             'Access-Control-Allow-Credentials': 'true'
      });

            res.end(JSON.stringify(JSON.parse(body)));
         }
       })
    });

如何更改这两个，以便它们可以在 IE 中使用跨域 GET？我一直在搜索互联网，似乎有一些不同的东西，比如jQuery.support.cors = true;，它不起作用。似乎还有很多冗长的解决方法。

对于这类事情，我找不到真正的“理想”设计模式。

鉴于我对网页和跨域 Web 服务都有控制权，因此我要进行哪些更改以确保所有 IE 版本以及 FireFox、Opera、Chrome 等的兼容性？

干杯！

【问题讨论】：

stackoverflow.com/questions/3362474/…
谢谢，已经知道了，所以我的问题是如何使用 JSONP？在那个问题中没有使用 JSONP...
抱歉，错过了这一点。这个giantflyingsaucer.com/blog/?p=2682怎么样。使用 jsonp 和 jsonpCallback 属性。您的服务器端代码需要读取这些参数并围绕您的数据包装一个函数调用。

标签： javascript jquery internet-explorer node.js cross-domain

【解决方案1】：

以下代码展示了如何处理 GET 请求（使用 express）以及如何使用给定的回调包装 JSON 响应：

app.get('/foo', function(req, res){ 
  res.header('Content-Type', 'application/json');
  res.header('Charset', 'utf-8') 
  res.send(req.query.callback + '({"something": "rather", "more": "pork", "tua": "tara"});'); 
});

【讨论】：

内容类型不应该是“application/javascript”吗？（因为 JSONP 通过作为 JavaScript 发送来工作）。

【解决方案2】：

假设我们有两台服务器，myServer.com 和 crossDomainServer.com，这两个服务器都是我们控制的。

假设我们希望 myServer.com 的客户端从 crossDomainServer.com 中提取一些数据，首先该客户端需要向 crossDomainServer.com 发出 JSONP 请求：

// client-side JS from myServer.com
// script tag gets around cross-domain security issues
var script = document.createElement('script');
script.src = 'http://crossDomainServer.com/getJSONPResponse';  
document.body.appendChild(script); // triggers a GET request

我们需要在跨域服务器上处理这个 GET 请求：

// in the express app for crossDomainServer.com
app.get('/getJSONPResponse', function(req, res) {
  res.writeHead(200, {'Content-Type': 'application/javascript'});
  res.end("__parseJSONPResponse(" + JSON.stringify('some data') + ");");  
});

那么在我们的客户端 JS 中，我们需要一个全局函数来解析 JSONP 响应：

// gets called when cross-domain server responds
function __parseJSONPResponse(data) {
  // now you have access to your data 
}

适用于各种浏览器，包括 IE 6。

【讨论】：

这很好用。这是给油脂猴用户的link。