编程语言
首页 > 编程语言> > javascript-在IE9中解析xml / json响应

javascript-在IE9中解析xml / json响应

作者:互联网

我以为这个问题是was resolved,但不幸的是不是,尽管这次似乎是一个不同的问题.

我想通过跨域XHR使用imgur API照片共享服务,显然,它可以正常工作.我开始一个请求,他们发送一个xml,而我所需要做的就是处理它.但是,尽管有多个建议(在Chrome,Firefox中均可使用),但我无法在Internet Explorer 9中正确执行此操作.这是我尝试过的最简单的代码:

HTML:

<!DOCTYPE html>
  <html>
    <body>
    <form id="uploadForm" action="http://api.imgur.com/2/upload.xml" method="POST" enctype="multipart/form-data">
    <input type="hidden" name="key" value="00ced2f13cf6435ae8faec5d498cbbfe"/>
    File: <input type="file" name="image"/>
    Return Type: <select id="uploadResponseType" name="mimetype">
    <option value="xml">xml</option>
    </select>
    <input type="submit" value="Submit 1" name="uploadSubmitter1"/>
    </form>
    <div id="uploadOutput"></div>
    </body>
  </html>

在那里,您可以看到Imgur API的密钥(如果需要,可以使用它……仅用于测试目的,但我认为我收到的xml响应没有任何问题).

我正在使用Jquery Form Plugin管理文件上传.

XML:

这是我测试过的最简单的代码.通常,我们需要帮助Internet Explorer独立解析xml,这就是为什么要使用parseXml.

使用Javascript:

function parseXml(xml) {  
  if (jQuery.browser.msie) {  
    var xmlDoc = new ActiveXObject("Microsoft.XMLDOM");  
    xmlDoc.loadXML(xml);  
    xml = xmlDoc;  
  }  
  return xml;  
} 

$('#uploadForm').ajaxForm({
    dataType: ($.browser.msie) ? "text" : "xml",
    accepts: {
        xml: "text/xml",
        text: "text/xml"
    },
    // has been received
    success: function(data) {
        $('#uploadOutput').html('Submitting...');
        data = parseXml(data);
        console.log(data);
        alert(data);
    },
    complete: function(data) {
        $('#uploadOutput').html('Complete...');
     }
});

dataType:($.browser.msie)? “ text”:“ xml”应该告诉IE返回文本响应.尽管有所有这些保证,但是响应的内容类型是application / xml(有人告诉我这不是问题).作为xml,我收到以下信息:

<?xml version="1.0" encoding="utf-8"?>
<upload><image><name/><title/><caption/><hash>087Y0</hash><deletehash>gUcgywjXoJyAJp6</deletehash><datetime>2012-06-02 21:59:35</datetime><type>image/jpeg</type><animated>false</animated><width>1024</width><height>768</height><size>297623</size><views>0</views><bandwidth>0</bandwidth></image><links><original>http://i.imgur.com/087Y0.jpg</original><imgur_page>http://imgur.com/087Y0</imgur_page><delete_page>http://imgur.com/delete/gUcgywjXoJyAJp6</delete_page><small_square>http://i.imgur.com/087Y0s.jpg</small_square><large_thumbnail>http://i.imgur.com/087Y0l.jpg</large_thumbnail></links></upload>

我认为它看起来还可以,我可以在其他浏览器中使用$($.parseXml(xml)).find(‘original’).text()进行解析,但在IE9中则不能.因此,基本上,我收到了响应,但是我无法解析该xml,尽管当我尝试弄清楚IE中的内容时,我似乎一无所获.

此外,成功甚至无法激发,这表明IE9无法解析xml. complete正在触发,但没有接收任何数据.那我在做什么错?

在这里,您可以拥有fiddle(包括Jquery Form插件).

更新:

JSON

供将来参考,在这种情况下,JSON无法使用Jquery Form Plugin使用.从文档中:

The iframe element is used as the target of the form's submit operation 
which means that the server response is written to the iframe. This is fine 
if the response type is HTML or XML, but doesn't work as well if the response 
type is script or JSON, both of which often contain characters that need to 
be repesented using entity references when found in HTML markup. To account 
for the challenges of script and JSON responses when using the iframe mode, 
the Form Plugin allows these responses to be embedded in a textarea element 
and it is recommended that you do so for these response types when used in 
conjuction with file uploads and older browsers.

想法?

谢谢!

解决方法:

这是由于跨域安全性(称为“相同来源策略”)引起的.

如果该插件是由浏览器实现的(例如在Chrome中),则此插件将使用File API;如果不是,则使用巧妙的技巧来创建隐藏的iframe并将数据发布到其中.如果地址在另一个域上,则插件无法从iframe获取数据,因此失败.

尝试使用以下命令启用插件的调试模式:$.fn.ajaxSubmit.debug = true;您将看到幕后发生的一切.

不幸的是,唯一的上传方法是在HTML中使用隐藏的iframe(不是通过脚本添加),然后通过将参数iframeTarget传递给该iframe的选择器来强制发布到该帖子,但您将无法抓取响应,因为上述问题(我不知道为什么插件生成的iframe不发布数据):

JS:

$('#uploadForm').ajaxForm({
    iframeTarget: ($.browser.msie) ? "#iframeTarget" : false,
    ...

HTML:

<iframe name="iframeTarget" id="iframeTarget">This iframe can be hidden with CSS</iframe>

您还可以利用条件注释在其他浏览器中隐藏iframe:

<!--[if IE]>
<iframe name="iframeTarget" id="iframeTarget">This iframe can be hidden with CSS</iframe>
<![endif]-->

关于这一点的说明是,将不会触发成功回调.

编辑:

您正在使用JSON响应选项与该站点进行通信吗?

如果有,则可以使用jsonp作为dataType参数,在URL末尾添加?callback = someFunction,并编写someFunction(data){}来接收数据并以成功回调的相同方式对其进行解析.

标签:javascript,xml,xml-parsing,jquery-plugins,internet-explorer-9
来源: https://codeday.me/bug/20191013/1909018.html