AJAX - Cross-domain don't work - javascript

I was reading many things about that the json is great replacement for XMLHttpRequests. I tried it and it don't works:
$.ajax({
crossDomain: true,
url: settingsURL,
type: "POST",
dataType: 'JSONP',
parseAsHtml: true, cli: 'help',
success: function(data) {
data=$(data).find('div#TestDivContent');
$('#TestDivContent').append(data);
},
error: function() {
$('#TestDivContent').append("<p>Can't Connect</p>");
}
});
and im getting...
Uncaught SyntaxError: Unexpected token <

Please Check the code below that is working like a charm in Cross Domain ().
if You Have control of both the Domains i.e., Domain1.com & Domain2.com
//Ajax Script in Domain1.com
//No Conflict is the code snippet from my sample code You can delete it if not required no issues
<script type="text/javascript">jq1102 = jQuery.noConflict( true );</script>
<script type="text/javascript" >
function jsonp(n){
//GET Response is Here
alert(n);
}
jq1102(function(){
jq1102.ajax({
type: "GET",
dataType: "jsonp",
url: 'http://domain2.com/ClientSiteApi/',
crossDomain: true,
complete: function(data){
//Any Action You Like to Trigger After Complete
},
error: function(jqXHR, textStatus, ex) {
//Nothing to Change Here
}
});
})
</script>
Response from Domain2.com
echo 'jsonp("hello")'; //You Can place JSON string in replace of the Hello String

Related

Uncaught SyntaxError: Unexpected token < error when calling from one domain to another domain

I am getting error when I am calling from one domain of test page function to another domain of html page using java script
` in order.html page i wrote script function like this
$(document).ready(function () {
Test();
}
);
function Test() {
$.ajax({
type: 'GET',
dataType: 'jsonp',
crossDomain: true,
contentType: 'text/javascript; charset=utf-8',
async: false,
cache: true,
jsonp: false,
url: 'http://localhost:27746/Test.aspx/SessionLogin',
success: function (data, textStatus, jqXHR) {
}
});
}`
It's not going to sessionlogin() function break point. after page
load is completed I am getting the error. Even test.aspx page doesnot
have any controls it has only sessionlogin() in .cs

IE pop up 'Syntax Error' when JSONP gets no response

Current application has to retrieve information from another application, and this other application is not required to be active to respond the JSONP request so the initiate requester will pop up an alert message about it.
function jsonRequest(requestURL, errorMsg){
var err = "";
var requestData= {param1: value1, param2: value2};
$.ajax({
type: 'GET',
async: true,
data: requestData,
jsonpCallback: 'jsonCb',
url: requestURL,
timeout: 20000,
dataType: 'jsonp', /* this trigger the syntax error window by IE*/
contentType: "application/json; charset=utf-8",
success: function(data) {
if(data.hasError != null){
error = data.error;
alert(error);
}else{
//.... logic to output valid values
} // closing } is not missing..duh
},//success
error:function(x, timeout, m) {
alert(errorMsg);
}
});
return err;
}
so then there are three possible scenarios:
JSONP request receives valid data from the other application
JSONP request receives empty data from the other application
JSONP request gets no response(the other application is not active)
So far so good until testing on IE. The problem is when it comes to scenario 3 then IE pop up its classic Syntax Error, after click 'close' then the alert message in $.ajax error:{..} shows up
Message: Syntax error
Line: 1
Char: 1
Code: 0
URI:.......
IE debug tool is pretty lame so it wont allow me to go any details. After I check javascript/jsp code line by line I found the cause of the issue:
In Scenario 3, once I change dataType: "jsonp" to dataType: "json" in the javascript code, then the error no more pop up, but of course the whole ajax request gonna fail. I cannot find out what returns to IE by the debugging tool, when the other application is inactive.
I wonder if there is any effective way to let IE to tolerate JSONP or any method to debug where is the cause of the issue.
The fact that IE9 works in any scenario with your code is a testament to the sheer incompetence of the microsoft programmers that created the javascript engine for that dinosaur
/rant - Solution to your problem follows: look for // you forgot this closing brace
function activateManifestJson(aUrl, code, timeoutErr){
var error = "";
// RESTful request data
var urlData = {param1: value1, param2: value2};
$.ajax({
type: 'GET',
url: aUrl,
async: true,
data: urlData,
jsonpCallback: 'jsoncallback',
timeout: 20000,
dataType: 'jsonp', /* this trigger the syntax error window by IE*/
contentType: "application/json; charset=utf-8",
success: function(json) {
if(json.hasError != null && json.hasError == "true"){
error = json.error;
alert(error);
}else{
//.... logic to output valid values
// *******************************************
} // you forgot this closing brace
// ***********************************************
},//success
error:function(x, tm, m) {
alert(timeoutErr);
}
});
return error;
}
After several hours desperately debugging, finally the fix to this issue emerged:
Just put this setting in ajax code and then the script error never pop up:
crossDomain: true,
so that
$.ajax({
type: 'GET',
url: aUrl,
async: true,
data: urlData,
jsonpCallback: 'jsoncallback',
crossDomain: true, /***** the life saver ****/
timeout: 20000,
dataType: 'jsonp',
contentType: "application/json; charset=utf-8",
success: function(json) {
if(json.hasError != null && json.hasError == "true"){
error = json.error;
alert(error);
}else{
//.... logic to output valid values
}
},//success
error:function(x, tm, m) {
alert(timeoutErr);
}
});
works just fine

Unexpected character error in JQuery ajax function

I have the 'unexpected character error' problem, my Jquery ajax code looks like that:
function test(){
if(true){
$.ajax({
type: 'POST',
url: 'test.php',
dataType: 'json',
data: {
godot: 'godot',
jobadze: 'jobadze'
},
success: function(data){
alert(data);
},
error: function(jqXHR, textStatus, errorThrown) { alert("Error Status: "+textStatus+"\nMessage: "+errorThrown);
}
});
and this is the php code:
<?php
echo 'test';
?>
it should alert "test", but it calls error. What is going on?
You're not returning any JSON. You returning text but you've specified in the AJAX that it will return json.
You have: dataType: 'json',
You could change the dataType: 'text', if you will always be returning text
or in your php change echo 'test'; to echo json_encode('test');
Hope this helps
You wrote dataType: 'json', so the PHP script is required to return valid JSON. Since you're not, the it gets an error when it tries to parse the response as JSON, and reports that error.
You should use json_encode:
<?php
echo json_encode('test');
?>
it should alert "test", but it calls error. What is going on?
Reason for this is your dataType : "json" in $.ajax() method which expects the response from serverside should be a json, which is not the case because that is just a simple text string nothing else, so what could you do:
Either remove the dataType or change the dataType: "text"
Or do a json_encode('string') at your serverside.
As you asked in your question
It should alert "test",
so you can skip the #2 and do this:
$.ajax({
type: 'POST',
url: 'test.php',
dataType: 'text',
data: {
godot: 'godot',
jobadze: 'jobadze'
},
success: function(data){
alert(data); // will alert "test".
},
error: function(jqXHR, textStatus, errorThrown) {
alert("Error Status: "+textStatus+"\nMessage: "+errorThrown);
}
});
but it calls error
$.ajax({
type: 'POST',
url: 'test.php',
dataType: 'json', //<----because of this
See json is a {key : value} pair js object and from your php you are just echoing a string not a object.

read php file rendered html using ajax

I am just trying to read the file content of a rendering HTML of URL
Here the code i am using , its always going in error section .
$.ajax({
type: 'POST',
url: 'http://www.withholding32.com/api/wh32calc.php?userid=nick&fpp=12&ffs=Single&fa=0&fgp=6000&figp=0&fiytd=0&st=6&stp=6000&ss=Single&sa=0&sad=0&stca=0',
dataType: 'html',
success: function(data) {
alert('success');
},
error: function(XMLHttpRequest, textStatus, errorThrown) {
alert('error');
}
});
but in case i run the same url directly in browser , its show me html.
here is url
Working DEMO
You can use this in your head tag
<script src="https://rawgithub.com/IonicaBizau/jQuery-cross-domain-requests/master/js/jquery.xdomainajax.js">
</script>
code
$.ajax({
url: 'http://www.withholding32.com/api/wh32calc.php?userid=nick&fpp=12&ffs=Single&fa=0&fgp=6000&figp=0&fiytd=0&st=6&stp=6000&ss=Single&sa=0&sad=0&stca=0', // Or your web page link
type: 'GET',
success: function(res) {
var headline = res.responseText;
$('body').append(headline);
}
});
Hope this helps, Thank you
Try the below code:
$('document').ready(function() {
$.getJSON('http://anyorigin.com/get?url=' +
encodeURIComponent('http://www.withholding32.com/api/wh32calc.php?userid=nick&fpp=12&ffs=Single&fa=0&fgp=6000&figp=0&fiytd=0&st=6&stp=6000&ss=Single&sa=0&sad=0&stca=0') + '&callback=?',
function(data){
$("#result").html(data.contents);
});
});
Refer : http://jsfiddle.net/R7EPt/275/
Change your request type to GET, all your parameters are given in the URL.
if you are using post method for the ajax than you can't pass argument with url and also add control origin to your php file.
try this...
AJAX code:
$.ajax({
type: 'POST',
url: 'http://www.withholding32.com/api/wh32calc.php',
dataType: 'html',
async:false,
data: 'userid=nick&fpp=12&ffs=Single&fa=0&fgp=6000&figp=0&fiytd=0&st=6&stp=6000&ss=Single&sa=0&sad=0&stca=0',
success: function(data) {
alert('success');
},
error: function(XMLHttpRequest, textStatus, errorThrown) {
alert('error');
}
});
PHP CODE:
header("Access-Control-Allow-Origin: *");

AJAX success callback function not called

i'm working with python and js on a simple website.
i'm trying to call a method from the client side and get result, but no matter what i do
success function isnt happening.
this is my JS
$.ajax({
url: "http://127.0.0.1:8000/api/gtest/",
type: "POST",
data: { information : "You have a very nice website, sir."},
dataType: "json",
success: function(data) {
alert ("post is success");
},
error: function(request,error) {
alert(request.responseText);
alert(error);
}
});
this is my server side code
def gtest(request):
jsonValidateReturn = simplejson.dumps({"jsonValidateReturn": "ddddd"})
return HttpResponse(jsonValidateReturn, content_type='application/json', mimetype='application/json')
The server responds to the call -
"POST /api/gtest/ HTTP/1.1" 200 31
tried to go over similar questions here but with no success :\
no matter what I do, only the error function is called.
the error alert is always empty.. no actual message.
I know this is probably a small change but I can't find it.
$.ajax({
url: "http://127.0.0.1:8000/api/gtest/",
type: "POST",
data: {
'information' : "You have a very nice website, sir.",
'csrfmiddlewaretoken': '{{csrf_token}}'
},
contentType: "application/json;charset=utf-8",
dataType: "json",
success: function(data) {
alert ("post is success");
},
error: function(request,error) {
alert(request.responseText);
alert(error);
}
});
i cant upvote mccannf's comment.
The problem was solved by the link he posted, i ran the html code from a file on my pc and i needed to load it from the server so link wont start with file:// but with http://
best regards..

Categories

Resources