Menu
I've got a problem with my JSONP request.. The data won't be displayed, Firebug shows an "invalid label" error..
My JavaScript:
$.ajax({
url: link,
dataType: "jsonp",
beforeSend: function(xhr) {
var base64 = btoa(username + ":" + password);
xhr.setRequestHeader("Authorization", "Basic" + base64);
xhr.overrideMimeType("application/json");
},
jsonpCallback: "getResources"
})
function getResources(data) {
alert(data);
alert(JSON.parse(data));
$.each(data.groupStatus, function(i, item) {
$("body").append("<p>ID: " + item.id + "</p>");
});
}
My JSON:
{
"groupStatus": [
{
"id": "Application Layer Configuration-ApplicationLayer",
"time": 1332755316976,
"level": 0,
"warningIds": [],
"errorIds": []
},
{
"id": "Application Layer-ApplicationLayer:nscalealinst2",
"time": 1333431531046,
"level": 0,
"warningIds": [],
"errorIds": []
}
]
}
My HTML:
<html>
<head>
<title>Monitor</title>
<link href="css/gadget.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/jquery-1.7.2.js"></script>
</head>
<body>
<div id="content"></div>
<script type="text/javascript" src="js/gadget.js"></script>
</body>
The request works fine, but anyway the data isn't displayed.
Im searching for a solution for days.. Can somebody help me? Thank you in advance!
SOLUTION (update: 06.09.12)
I've solved this problem. The server (REST interface) on which the was executed had no callback function implemented.. Another way to set up crossdomain requests WITHOUT using JSONP is to set the following jquery variable:
jQuery.support.cors = true;
909
dataType: jsonp for cross-domain request, that means request to different domain and dataType: json for same domain-same origin request. Loads in a JSON block using JSONP. Adds an extra "? callback=?" to the end of your URL to specify the callback.
JSONP is vulnerable to the data source replacing the innocuous function call with malicious code, which is why it has been superseded by cross-origin resource sharing (available since 2009) in modern applications.
JSONP stands for JSON with Padding. Requesting a file from another domain can cause problems, due to cross-domain policy. Requesting an external script from another domain does not have this problem. JSONP uses this advantage, and request files using the script tag instead of the XMLHttpRequest object.
JSONP is a technique by which you put your request into a script tag URL (which is allowed to any domain) and you pass in that URL a parameter which indicates the name of a function that you want the resulting script that is returned to call and pass it your data.
The response to a JSONP call needs to wrap the JSON itself in a function call, where the name of the function being called is usually supplied in the url. jQuery automatically adds a query string parameter of "callback" to the URL that is being requested, so the script on your server should do something similar to:
// assuming that $JSON contains your JSON content
print "{$_REQUEST['callback']}( {$JSON} );";
The reason for adding the name of a function to the response is that a JSONP request is actually a script tag appended to the DOM rather than a regular request that would be made by an XMLHttpRequest object. Using JSONP allows the browser to make cross-domain requests that would otherwise be blocked by the cross-domain policy that applies (by default) to an XHR.
150
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
