HTML5 发布请求正文 [英] HTML5 Post Request Body

问题描述

function sendPost(){

alert("IN SEND POST");


var username = document.myForm.username.value;
var password = document.myForm.password.value;
alert("username"+username);
alert("password"+password);

console.log("in java script");

    var url = "some url";

    alert("IN url SEND POST");

    var data = "<MESSAGE><HEADER><LOGIN>005693</LOGIN></HEADER><SESSION><LATITUDE>0.0</LATITUDE><LONGITUDE>0.0</LONGITUDE><APP>SRO</APP><ORG>MNM</ORG><TRANSACTION>PRELOGIN</TRANSACTION><KEY>PRELOGIN/ID</KEY><TYPE>PRELOGIN</TYPE></SESSION><PAYLOAD><PRELOGIN><ID>005693</ID><USERNAME>005693</USERNAME><PASSWORD>tech@2014</PASSWORD></PRELOGIN></PAYLOAD></MESSAGE>";

console.log("2")

    var req;
    if(window.XMLHttpRequest) {
    console.log("2");
    try {
      req = new XMLHttpRequest();
    } catch(e) {
      req = false;
    }
  }
  else if(window.ActiveXObject) {
  console.log("3");
    try {
      req = new ActiveXObject("Msxml2.XMLHTTP");
    } catch(e) {
      try {
        req = new ActiveXObject("Microsoft.XMLHTTP");
      } catch(e) {
        req = false;
      }
    }
  }


  console.log("4");
  req.onreadystatechange=function()
  {
  console.log("5");
  if (req.readyState==4 && req.status==200)
    {
    console.log("ready state accepted");
    xmlDoc=req.responseXML;
     console.log("xmlDoc"+xmlDoc);
     alert("xmlDoc"+xmlDoc);
    txt="";
    x=xmlDoc.getElementsByTagName("FIRSTNAME");
    y=xmlDoc.getElementsByTagName("LASTNAME");
     console.log("Response achieved"+x);
    }


  }


req.open("POST",url,true);
console.log("6");
req.setRequestHeader("Content-type","application/xml");
req.send(data);
 console.log("7");
  return true;
  }

我在休息客户端中得到了完美的响应，如图所示

I get a response in rest client perfectly as i Want as seen in image

在谷歌浏览器中 --> 我的状态为 0，就绪状态为 1，然后为 4在 Internet Explorer 中 --> 我的状态为 200 OK 并且就绪状态从 1 、 2 、 3 、 4 开始，但返回了一个空白的 xml

In Google Chrome --> I get status as 0 and ready state as 1 and then 4 In Internet Explorer --> I get status as 200 OK and ready state goes from 1 , 2, 3, 4 but a blank xml is returned

在其余客户端中，我得到了完美的命中并返回了一个 xml

In rest client I get a perfect hit and an xml is returned

我尝试以不同的方式提问，但有人说这是一个跨域问题如果是，请让我通过 javascript 中的代码知道解决方案

I tried asking question in different ways but some say its a cross origin problem If yes please lemme know the solution via code in javascript

请指导

推荐答案

首先，我建议在 jQuery 的帮助下重写您的代码.这将压缩您的代码，使其跨平台，并且更易于阅读和维护:

Firstly, I suggest rewriting your code with jQuery's help. This would compact your code, make it cross-platform, and easier to read and maintain:

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript">
function sendPost(){
    $.ajax({
        url: "some url",
        type: "POST",
        contentType: "text/xml",
        data: 
            "<MESSAGE><HEADER><LOGIN>005693</LOGIN></HEADER>" +
            "<SESSION><LATITUDE>0.0</LATITUDE><LONGITUDE>0.0</LONGITUDE>" +
            "<APP>SRO</APP><ORG>MNM</ORG><TRANSACTION>PRELOGIN</TRANSACTION>" + 
            "<KEY>PRELOGIN/ID</KEY><TYPE>PRELOGIN</TYPE></SESSION>" +
            "<PAYLOAD><PRELOGIN><ID>005693</ID>" +
            "<USERNAME>" + $("#username").val() + "</USERNAME>" +
            "<PASSWORD>" + $("#password").val() + "</PASSWORD>" +
            "</PRELOGIN></PAYLOAD></MESSAGE>",
        dataType: 'xml',
        success: function(data) {
            var firstname = $(data).find("FIRSTNAME").text();
            var lastname = $(data).find("LASTNAME").text();
            alert('Hello ' + firstname + ' ' + lastname);
        },
        error: function(jqXHR, textStatus, errorThrown) {
            alert('Error');
        }
    });
}
</script>

其次，源自您的服务器(例如 www.myserver.com)的 javascript 无法与其他服务器通信(即您无法从 www.anotherserver.com 请求数据).好吧，你可以，但如果是这样，你需要确保从 www.anotherserver.com 发送的答案是 JSONP 格式 - 然后你只需将上面示例中的dataType"更改为jsonp"即可能够访问结果，如data.firstname"和data.lastname".

Secondly, a javascript that origins from your server (e.g. www.myserver.com) can't communicate with other servers (i.e. you can't request data from www.anotherserver.com). Well you CAN, but if so you'd need to ensure the answer sent from www.anotherserver.com would be in JSONP format - and then you would just change "dataType" in the example above to "jsonp" to be able to access the result like "data.firstname" and "data.lastname".

无论如何，在您的情况下，我会在我自己的网络服务器上创建一个本地代理(在您拥有上述 .HTML 文件的同一文件夹中)，它将请求转发到另一台服务器并返回结果.因此:

Anyway, in your case I would create a local proxy on my own webserver (in the same folder where you have the above .HTML-file) that would forward the request to the other server and return the result. Thus:

$.ajax({
        url: "myproxy.php",
        type: "POST", ...

然后在 myprox.php 中，类似这样的东西(我只是在这里假设 PHP，但这可以很容易地移植到 ASP.NET 或 ASP Classic):

And then in myprox.php, something like this (I'm just assuming PHP here, but this could be easily ported to ASP.NET or ASP Classic):

<?php
    // myproxy.php forwards the posted data to some other url, and returns the result
    $clientContext = stream_context_create(array(
        'http' => array(
            'method' => 'POST',
            'header' => 'Content-Type: text/xml; charset=utf-8',
            'content' => http_get_request_body()
        )
    )); 
    print file_get_contents("some url", false, $clientContext);
?>

澄清:这将使您的 HTML 页面与 myproxy.php(它位于同一台服务器上[甚至在同一目录中])进行通信，然后 myproxy.php 与位于某个 url"的服务器通信，该服务器返回数据到 myproxy.php，它反过来将数据返回到您的脚本.

To clarify: This would make your HTML-page talk to myproxy.php (which lives on the same server [even in the same directory]), then myproxy.php talks to the server at "some url" which returns the data to myproxy.php, which in it's turn returns the data to your script.

祝你好运！

这篇关于HTML5 发布请求正文的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！