kendo mobile JSON data calling - javascript

I have written a code for taking JSON data from a PHP and putting to listview, it works great in localhost.
When I put the PHP file in a web server and called in Javascript it showing error and not getting data.
This method I have used:
var dataSource = new kendo.data.DataSource({
transport: {
read: {
//url: "userchk.php", //this works in localhost
url: "http://example.com/web/userchk.php", this is not working in localhost
dataType: "json", // JSONP (JSON with padding) is required for cross-domain AJAX
data: { //additional parameters sent to the remote service
q: "javascript"
}
}
},
The first url data is getting in localhost and works great, second url is not working(but data show if we run the url in a browser).
It show an error like this:
XMLHttpRequest cannot load http://example.com/web/userchk.php?q=javascript. Origin http://localhost is not allowed by Access-Control-Allow-Origin.
waiting for a good response

This may be due to cross domain issue. You need to use datatype:jsonp .. A sample code reading data from ODATA Version 2.0 feed is as following ,
studentsData = new kendo.data.DataSource(
{
type: "odata",
transport: {
read: {
url: "http://server/Service.svc/Students",
dataType: "jsonp",
data: {
Accept: "application/json"
}
}
},
serverfiltering: false,
serverPaging: true,
batch: false,
pageSize: 10
});
You can read the complete "Kendo UI ListView Control and OData in Windows Phone Application" post.
Thanks
#debug_mode

This is related to the same origin policy that most web browsers implement. It seems like the php file you are trying to access is in another server other than your current one (localhost).
If you are tyring to access local:
I suggest you change the url to /web/userchk.php
If you are are trying to access another site
I suggest you change the dataType to "jsonp"
Try looking at the kendoUI datasource example with twitter. They try to access twitter (a different origin) using jsonp.

Related

Status Code:404 Not Found (from cache) | Hybrid App using AngularJS

I'm currently creating a hybrid mobile application.
While running the application on an Android emulator, I get the following error: Status Code:404 Not Found (from cache) in one $http.post request.
Below is the post request used in my code. The URL is of a local Tomcat server being used in my project.
var postData = {'loginId':$scope.user.id};
postData = $.param(postData);
$http({
method: "POST",
url: checkUserURL,
data: postData,
cache:false,
headers: {
'Accept': 'application/json',
'Content-Type': 'application/x-www-form-urlencoded;'
}
});
When I place the url in href of an anchor tag inside the mobile application and click it, I get redirected to the mobile browser from where I'm able to hit the url and get the expected output.
I am able to access the url from my web browser too. The error occurs only when I try to use the $http request in the application.
Note: I've all the libraries needed included in my project.
Is it because of the format of the data I'm sending to the server?
Can you please let me know what could be the issue here and the possible resolution actions that can be taken?
It's probably because of the way you are passing your parameter. You don't have to use $.param. Try to pass a plain JavaScript object:
var postData = {
loginId: $scope.user.id
};
$http({
method: "POST",
url: checkUserURL,
data: postData,
cache:false
});

Get JSON(P) from other site [duplicate]

This question already has answers here:
Unexpected token colon JSON after jQuery.ajax#get
(2 answers)
Closed 7 years ago.
I am trying to get data with Ajax.
Data is json. I use jquery and angular.
But result is undefined or error.
Here is my jquery code:
$(document).ready(function() {
var url = "http://market.dota2.net/history/json/";
$.ajax({
type: 'GET',
url: url,
async: false,
contentType: "application/json",
dataType: 'jsonp',
success: function(data) {
console.log(data);
}
});
});
In Angular i am usin jsonp method. Whats wrong ?
By the way, in pure Java i can get data from this url...
Whats wrong?
You're trying to call an endpoint that provides JSON as though it provided JSONP. That won't work; they are different (though related) formats.
Example JSON:
{"foo":"bar"}
Example JSONP:
callback({"foo":"bar"})
Note the difference: JSONP is actually a JavaScript function call, wrapped around the JSON.
If the API supports JSONP, call an endpoint that supports it.
If not, you can't query it directly unless the provider supports Cross-Origin Resource Sharing and shares with your origin, because of the Same Origin Policy that applies to ajax calls.
By the way, in pure Java i can get data from this url...
Because the Java code is not running in a context that is controlled by the SOP, and so can get the data from that endpoint (as JSON) and use it. This is also the same reason that just posting that URL into a browser address bar lets us see the data. But ajax calls are governed by tighter rules.
If you expect json, dont use jsonp but json.
$(document).ready(function() {
var url = "http://market.dota2.net/history/json/";
$.ajax({
type: 'GET',
url: url,
async: true, /* it fails with false */
contentType: "application/json",
dataType: 'json',/* <== here */
success: function(data) {
console.log(data);
}
});
});
Are you using jsonp consciously ? Do you know what it is ? If not, use json. Or get informed about JSonP: https://en.wikipedia.org/wiki/JSONP
I tried on Safari:works.
On Chrome & FFox: does not work + Erreur "Cross Domain Origin"
XMLHttpRequest cannot load http://market.dota2.net/history/json/. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.
That means you cannot get JSon with your client/machine from the API server. So you should indeed use JSonP, but... you miss the callback or something in the API documentation.

SOAP-request No 'Access-Control-Allow-Origin' header soapUI header

Im trying to accomplish SOAP-post to get back XML data.
Problem is that "No 'Access-Control-Allow-Origin' header" and I suppose that the server needs to add the header.
So I created a MockService in SOAPui and copied the server response. But I still get the same problem. In soapUI in the response I added this http://imgur.com/TZXM2Ca
function soap() {
var sr = MySoapRequest;
$.ajax({
url: url,
beforeSend: function(xhr) {
xhr.setRequestHeader("SOAPAction", "x");
},
type: "POST",
dataType: "xml",
data: sr,
crossDomain: true,
success: function (data) {
console.log(data);
},
error: function (error) {
},
contentType: "text/xml; charset=\"utf-8\""
});
}
By default, browsers cannot make POST requests via AJAX to URLs which are not in the same origin as the current page. For example, if you have open a page that sits in the URL http://foo.com, and that page tries to post some data (via AJAX) to http://bar.com, you will normally get the error you are seeing now.
If you want to make this work, you have to configure your server to accept requests via Cross-Origin Resource Sharing (CORS). I suggest that you get some information about CORS, you can find a lot of documentation online about it. An extensive overview can be found here.
As for the actual implementation of CORS on your server, it depends on which platform you are using. If you are using PHP, have a look at this question.

How can i receive data from external url using json?

Recently i am learning json to create apps.I have a doubt in a Json , php based chat system .
In this , the code work fine for same origin policy.But for sending and receiving data from external url, it successfully sends data to external php.But not receiving any data from server.I search in internet to solve this problem , and found jsonp as alternative. I tried jsonp , but i m not sure if am correct because i am new to ajax itself.
Please don't mis understand my question.I want to load a index.html file from localhost , when i send request to external url (anysite.com/xx/ajax.php) .It process and returns the data back to index.html.But the problem is my data is sended finely and processed on the server but it doesn't return to remote file.But it works fine for same server.
$.tzPOST = function(action,data,callback)
{
$.post('http://anysite.com/xx/ajax.php?action='+action,data,callback,'json');
}
$.tzGET = function(action,data,callback){
$.get('http://anysite.com/xx/ajax.php?action='+action,data,callback,'json');
}
please help me with a code.
You cant receive JSON from external web by JavaScript, because of the policy.
But you can do AJAX request on your PHP file and there you can get the JSON by file_get_content http://cz2.php.net/file_get_contents function.
For using(working) with jsonp, u can take ready solution jquery-jsonp
from GitHub.
Example of using (by you question):
$.tzGET = function(action,data,callback){
var url = 'http://anysite.com/xx/ajax.php?action='+action;
$.jsonp({
type: 'GET',
url: url,
callbackParameter: callback,
dataType: 'jsonp',
data: data,
timeout: 10000,
success: function(json){
alert('success')
},
error: function(){
alert('error')
}
});

jQuery and Ajax - cannot POST

I am trying to login to a website using a known username and password and to get some data displayed from the site for a specific user account on that website. I am using jQuery and Ajax for this purpose. This is my code:
$.ajax({
async: false,
cache: false,
type: 'POST',
dataType: 'json', // json...just for example sake
data: ({
'login_username': username,
'secretkey': password
}),
url: 'https://mail.someserver.com/src/redirect.php',
success: function (data) {
alert("SUCCESS!")
if (data === '1') { // server returns a "1" for success
// success!
// do whatever you need to do
} else {
// fail!
}
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
// something went wrong with the request
alert("Failed!");
}
});
I've already made my search around the web and I know that browsers do not permit cross server ajax calls to prevent security issues, but I've already tried to use "jsonp" as dataType to no avail :(
So, what am I doing wrong?
Be sure that your url is not breaking the same origin policy -- that is, the request coming from the client cannot request data from a server from a different domain (there are exceptions to this rule, namingly CORS, but that requires that you make changes to the server/application you're talking to).
The solution to your problem would be to make the request from some server-side script, then in turn having your client application query that script, based on the same machine that's serving the application to the web.
My fault isn't at the code above, my fault was that in my manifest file (I am building a Google Chrome extension) I didn't have set proper permissions (https://*).
Sorry for the frustration!

Categories