I have a https site. I'm running LifeRay on Tomcat. I'm using the following URL:
http://gdata.youtube.com/feeds/api/videos/ID?v=2&alt=jsonc
and
jQuery.ajax({
url: URL,
dataType: 'jsonp',
async: false,
success: function (obj) {
processData(obj);
}
});
to get the data and then processing it. It works on all the browsers. The only problem is that I get a security warning in IE8.
Question 1: Is there any way to get the JSON data securely and processing the data without IE throwing any warning messages?
Question 2: How and where can I set this: Access-Control-Allow-Origin: http://youtube.com, so that maybe IE won't throw any warning messages?
Try using
https://gdata.youtube.com/feeds/api/videos/ID?v=2&alt=jsonc
Since you are in https, IE wants all resources accessible within that domain to be secured. I feel previously you were using http:// in the request URL of youtube. Change it https, it may solve the security warning issue.
If a secure page loads any nonsecure resource, its going to throw the warning. The only way to get around it is to load everything from https.
Here you are trying to load a non secured resource (http://gdata.youtube....) in the secured website.
HTH
Related
Hi i have the following code
var dataString = "email=jdoe#example.com&fname=John&lname=Doe&phone=7851233&vid=726&size=2&date=2013-05-28%202:15%20PM&request=Testing%20A%20Message";
$.ajax({
type: "GET",
timeout: 5000,
url: "http://www.livepicly.com/app/api.php?method=add_reservation",
data: dataString,
success: function(data, textStatus) {
alert(data.result);
},
error: function(xhr, textStatus, errorThrown){
alert("ERROR");
}
});
return false;
Where basically i would like to submit a piece of string to this URL:
http://www.livepicly.com/app/api.php?method=add_reservation
The formatted string (as displayed by firebug) is like this:
http://www.livepicly.com/app/api.php?method=add_reservation&email=jdoe#example.com&fname=John&lname=Doe&phone=7851233&vid=726&size=2&date=2013-05-28%202:15%20PM&request=Testing%20A%20Message
When the string is executed via browser (straight copy-pasting) it works perfectly. It displayed the corresponding message.
However, when i execute the code, it always returns error. Does anyone know why this happen?
Cheers,
The API in question is not RESTful.
Anyway, your problem is a combination of factors. What it definitely is NOT is the API actually throwing an error, as all errors are returned as 200 status codes. (Not RESTful Point #1). So, even if livepicly returned an error, it'd still count as success on jQuery handlers.
In no particular order:
The API is not throwing Access-Control-Allow-Origin headers. It does not support JSONP either. (This can be seen by querying http://www.livepicly.com/app/api.php?method=add_reservation&callback=test ). This will completely prevent jQuery from loading any data of performing any queries to the API due to cross-domain restrictions
That's the only thing that is failing! This is also completely preventing jQuery usage. You'll need to make a choice to go around this one, which may or may not include:
Proxying the API locally. This is trivial if your webserver is running thanks to Apache or nginx. For Apache, use ProxyPass and ReverseProxyPass directives using mod_proxy, or use a rewrite rule with the [P,L,QSA] set of flags. On nginx, use the proxy_pass directives. If you have access to neither, proxy it using curl through PHP.
Giving the developers of the API a slap in order for them to simply add Access-Control-Allow-Origin: * to the headers, which will make your call work
Giving the developers of the API a slap in order for them to support JSONP
Overall, just point them to https://en.wikipedia.org/wiki/Representational_state_transfer and give them a slap for me. Please?
As the title says, I'm trying to access (POST) using jQuery AJAX call to a web url, http://host:port/... or http://localhost:8080/... from a local HTML file, c:\home.html. I can't get it to work.
I did Google and also saw several questions here but I can't get it to work. I need some help here. Here is what I've tried so far.
dataType: jsonp
crossDomain: true
Setting the header in my response:
response.setHeader("Access-Control-Allow-Origin", "*");
None of the three browsers are working - IE, FF or Chrome. The request is never reaching the server. Here are some of the errors I'm seeing.
No Transport (IE) if not jsonp is used.
NS_BINDING_ABORTED / Error loading content (NS_ERROR_DOCUMENT_NOT_CACHED) in FF
This is my code. I would appreciate any help. I'm using jquery-1.8.2.min.js.
var http_host = "http://localhost:8080";
function su (pc, p) {
var suUrl = http_host + "/ps/api/v2/authorize.json";
$.ajax({
type: 'POST',
url: suUrl,
data: {
phone_cell: pc,
password: p,
},
dataType: "json",
crossDomain: true,
success: osu,
error: oe
});
return false;
}
function osu (d) {
console.log(d);
}
function oe(xhr, ts, et) {
alert("ServerError: " + et);
}
An example would be a perfect pointer.
I suppose my code got messed up w/ all the different solutions that I was trying. I was finally able to get it to work w/ setting the header (solution that was recommended and worked for others). All that I had to do to get it to work is add the following to my REST service response.
response.setHeader("Access-Control-Allow-Origin", "*");
Update:
I thought I figured this out but I've not. There is more it than just setting the header. Anyways, in my specific situation. I was trying to run my app (html, js) off of the hard drive specifically on chrome and trying to access web services available on the cloud.
Here is how I finally solved the problem. I started the chrome w/ the following parameters.
--disable-web-security -–allow-file-access-from-files
Like I mentioned earlier, this app is really a desktop application that will be run as part of the chromium embedded framework.
Thanks every one for your input.
You can't make a cross-domain request from a local file because it's not on a domain. You need to host C:\home.html on a local webserver instance in order for it to work.
I am having a rather frustrating problem with the jquery post function that probably stems from not understanding how it works correctly.
I have a function that should post some form information to a php script that I wrote and that script then runs curl requests against an API to get around the cross-domain policy of javascript. It seems to work fine as long as it submits to "http" but when I send it to "https" the form never gets submitted.
I ran wireshark on my computer and it showed no traffic towards the destination ip until I made the url use http. I have basic auth on the server so I am passing the user and password through the url, but tested without that there and got the same results.
Here is the not working code:
$j.post("https://<api user>:<password>#<ip>:444/ProxyScript.php",
$j("#spoke_ticket").serialize(),
function(msg) {
log_status(msg);
fade_status();
$j(':input','#createtheticket')
.not(':button, :submit, :reset, :hidden')
.val('')
.removeAttr('checked')
.removeAttr('selected');
});
Here is the working function:
$j.post("http://<other ip>/ProxyScript.php",
$j("#spoke_ticket").serialize(),
function(msg) {
log_status(msg);
fade_status();
$j(':input','#createtheticket')
.not(':button, :submit, :reset, :hidden')
.val('')
.removeAttr('checked')
.removeAttr('selected');
});
Any ideas as to why the traffic is not being sent?
Let me know if I left out some key information or anything.
Thanks for the help
If you are doing the AJAX post from a http page to a https URL then the Cross-Domain policy kicks in because the protocol is also part of the origin specification, as it is described here. The browser will refuse to make the AJAX call, so that's why you're not seeing any traffic.
A solution is discussed here:
Ajax using https on an http page
So your best bet is the Access-Control-Allow-Origin header which should be supported on most modern browsers now.
So make your server add the following header to the responses:
Access-Control-Allow-Origin: https://www.mysite.com
If for some reason you cannot enforce this, then the only choice left would be JSONP.
Why not use a proxy to get over the cross-domain issue? It sounds more easy. An simple example is when i want to retrieve the danish administration national geo-data for counties,road names and so on (lucky for me, their data is in json or XML optional)
simplified proxy.php
<?
header('Content-type: application/json');
$url=$_GET['url'];
$html=file_get_contents($url);
echo $html;
?>
in ajax, get the lat/longs for a county borderline
var url= "proxy.php?url=https://geo.oiorest.dk/"+type+"/"+nr+"/graense.json";
$.ajax({
url: url,
dataType: 'json',
success: function (data) {
...
});
notice the https - the url could be, real example, https://geo.oiorest.dk/kommuner/0810/graense.json
I'm using jQuery (1.7.0) to make a json/ajax call to Spotify. The following code works fine in Chrome and Firefox, but causes an error (Error: Access is denied.) in IE.
$.ajax({
url: 'http://ws.spotify.com/lookup/1/.json',
type: 'GET',
dataType: 'json',
cache: true,
data: {
uri: "someartist",
extras: "album"
},
success: successfn,
error:function(xhr, status, errorThrown) {
alert("networking error: "+errorThrown+'\n'+status+'\n'+xhr.statusText);
}
});
The success function is called in Chrome and FF, but the error function is called in IE with the above message. I have set cors to true: jQuery.support.cors = true;.
It works on Chrome and FF both locally and on my server, it works in IE locally but not on the server. Changing cache: false causes problems at the spotify end - doesn't line additional parameters, so I get a "bad request" error.
Grateful for any pointers.
Thanks
Abo
You are relying on the spotify url to give a Access-Control-Allow-Origin:* in their header to allow cross domain requests from all domains. Internet explorer however doesn't support this, so it gives access denied.
access-control-allow-origin explained. (TLDR: Servers may allow cross domain ajax in their headers)
If you need this to work in IE, you could use spotify's JSONP API if they have one or make the AJAX request in flash, which works in all browsers and passes the requests response data to your javascript.
The above answer about using jsonp is correct; I want to add:
Don't set
jquery.support.cors = true;
I'm not sure why so many questions begin by stating they took that step. This property is meant to be read to find out if the browser supports CORS. You should only override it if you know differently, and in my experience it's accurate for all major browsers. Setting it to true doesn't enable the browser to use CORS, it just denies you the info that CORS is going to fail.
http://api.jquery.com/jQuery.support/
can you give an example of returned data?
at a /guess/, it either has something to do with the filename ".json", or the JSON returned has something weird about it.
I'm surprised this works on Chrome or Firefox. You shouldn't be able to run cross-domain JSON requests.
If Spotify API supports it, you should use JSONP in order to access resources from other domains.
Also see: No response from jQuery ajax call
I don't see this working in FF. You can't make cross-domain Ajax calls. So I'm not sure what's going on when you say that it works in FF. But I just tried the following in FF and I got the error. So all you can do is make the call on the server side and then include the results in your page.
http://jsfiddle.net/2XWGn/
Ok, Here we go. I have already searched the Stack for the answer i have found some useful info but i want to clear up some more things. I also search the net for the answer but no real help.
I have worked with some api (yelp, ouside.in). In yelp i use to inject the script to head with the url request to the api with a callback funcion. I worked fine in all browsers. But while using outside.in api when i call the url the callback in not working.
In yelp they have a url field can be used like that callback=callbackfuncion so the callback will automatically called.
But in outside.in there is not such field available. Is there are any standard command for callback function which will work regardless of any server/api?
I also tried a standard ajax request using jQuery $.ajax() function. It worked for my local pc for both IE and other browser but did not working in IE showing the error: access denied, other borwser seems ok. Firebug in my FF also don't notice any errors.
Outside.in has an javascript example but it is too hard to me to understand
github.com/outsidein/api-examples/tree/master/javascript/browser/
site i am working: http://citystir.com
yelp: yelp.com
outside.in: outside.in
Techniqual info:
i am using: wampserver in local, wordpress for hosting, Godaddy, apache for remote with linux.
Codes:
Using Jquery $.ajax
url is like: "http://hyperlocal-api.outside.in/v1.1/states/Illinois/cities/chicago/stories?dev_key="+key+"&sig="+signeture+"&limit=3
function makeOutsideRequest(url){
$.ajax({
url: url, dataType: 'json', type: 'GET',
success: function (data, status, xhr) {
if (data == null) {
alert("An error occurred connecting to " + url +
". Please ensure that the server is running and configured to allow cross-origin requests.");
}else{
printHomeNews(data);
}
},
error: function (xhr, status, error) {
alert("An error occurred - check the server log for a stack trace.");
}
});
}
Thanks!
This question was asked in the Outside.in developer forums this morning as well (presumably by the same person). Here's a link to that discussion: http://developers.outside.in/forum/read/97053
To summarize, the Outside.in API does not support JSONP, but CORS support is included in the next release of the API, which will hit in the near future.