I understand the way to make an ajax call in YUI 3 is using the IO utility.
I want to get the address of a location from Google's geocoding API.
<script type="text/javascript"><!--
YUI().use('io-base', function(Y) {
function complete(id, o) {
var data = o.responseText; // Response data.
alert(o.responseText);
};
Y.on('io:complete', complete, Y);
var request = Y.io("http://maps.googleapis.com/maps/api/geocode/json?language=en&sensor=false&latlng=12,34);
});
//-->
</script>
I get a reply with method OPTIONS and status code 405 Method Not Allowed.
I believe this is because of some "preflight" permission check. I do not receive the desired response. If I copy and paste the url into the browser, I see the json data.
I could post the ajax request to a php script on my own domain and get the json response with curl.
But why have this extra step if I could just get the data in javascript?
So what can I do to solve this? Is the IO utility not the right library to use?
You're making a cross-domain XHR request, and running into the "Same origin policy", a generic restriction in client-side JavaScript. See for example Why do I still receive 405 errors even though both URLs are from XXXX.com?
There are various ways to work around this problem:
1) Make a server-side request in PHP, as you suggest
2) Use the YUI jsonp module
3) Use the YUI YQL module, which proxies your request through Yahoo! servers and handles JSONP housekeeping for you
There are many other ways to tackle this problem, but those three should get you started.
Y.io has support for cross domain requests. See http://yuilibrary.com/yui/docs/io/#cross-domain-transactions
You need to properly config it with the "xdr" property, and load the "io-xdr" module, etc. This example uses it as well: http://yuilibrary.com/yui/docs/io/weather.html
Related
I am trying to pull information from Google Finances stock screener. There is no official api, so I am just making a get request to the same URL that they use on the site. I am using the URL at the bottom of the question, it can get a bit long. I can go to the url myself and it will give me a text file with the JSON information. In my javascript I am using $.getJSON on the url to get the screener results. But I get a Access-Control-Allow-Origin error, so I change output=json to output=jsonp&callback=?. But it only returns ();. From what I can tell this means that it is not set up on the other end to respond to a jsonp request and cannot return the proper information.
I have also tried output=json&callback=?, which produces the (); and output=json&callback=callbackFunction and output=json&callback=callbackFunction which both give me Access-Control-Allow-Origin.
Is there any way that I can make this work?
https://www.google.com/finance?output=json&start=0&num=20&noIL=1&q=[currency%20%3D%3D%20%22USD%22%20%26%20%28%28exchange%20%3D%3D%20%22OTCMKTS%22%29%20%7C%20%28exchange%20%3D%3D%20%22OTCBB%22%29%20%7C%20%28exchange%20%3D%3D%20%22NYSEMKT%22%29%20%7C%20%28exchange%20%3D%3D%20%22NYSEARCA%22%29%20%7C%20%28exchange%20%3D%3D%20%22NYSE%22%29%20%7C%20%28exchange%20%3D%3D%20%22NASDAQ%22%29%29%20%26%20%28market_cap%20%3E%3D%200%29%20%26%20%28market_cap%20%3C%3D%200.1%29]&restype=company&ei=GLyhVKmcDpOb8gbm7IGQAQ
If the service doesn't provide a JSONP endpoint or use CORS to grant you permission to access some other kind of endpoint, then there is no way to access the data using client side code.
Use server side code instead. You can use that to present the data to your client side code.
I am sending an (HTTP GET) $.ajax request (from jsfiddle) to my Google Apps Script server and I get the following error:
XMLHttpRequest cannot load https://script.google.com/macros/s/mykey?params.
Origin http://fiddle.jshell.net is not allowed by Access-Control-Allow-Origin.
What is the best way to solve this problem?
I have successfully implemented jsonp $.ajax requests to retrieve json data and javascript using this GAS/jsfiddle configuration. However, I seem unable to accomplish this jsonp success this time. Possibly because I am going through an .updaterow() function (per jqWidgets?)
My research:
This post almost asks a similar question except it is not specific to GAS.
I do not think GAS allows one to set server-side response headers. But surely there must be a way to get my request to execute?
Perhaps this question explains it better? (GAS issue) Is there a workaround solution? (Come on creative people.)
GAS does not allow CORS headers at this time.
(extremely ignorant question, I freely admit)
I have a simple web page with a button and a label. When I click the button, I want to make a REST call to an entirely different domain (cross-domain, I know that much) and display the results (HTML) in the label.
With other APIs, I've played around with using JSON/P and adding a element on the fly, but this particular API doesn't support JSON so I'm not sure how to go about successfully getting through.
The code I have is:
function getESVData() {
$.get('http://www.esvapi.org/v2/rest/passageQuery?key=IP&passage=John+1', function (data) {
$('#bibleText').html(data);
app.showNotification("Note:", "Load performed.");
});
}
I get an "Access denied." Is there anyway to make this call successfully without JSON?
First off, JSON and JSONP are not the same. JSON is a way of representing information, and JSONP is a hack around the same-origin policy. JSONP works by requesting information from another domain, and that domain returns a script which calls a function (with the name you provided) with the information. You are indeed executing a script on your site that another domain gave to you, so you should trust this other domain.
Now when trying to make cross domain requests you basically have 3 options:
Use JSONP. This has limitations, including the fact that it only works for GET requests, and the server you are sending the request to has to support it.
Make a Cross Origin Resource Sharing (CORS) request. This also must be supported by the server you are sending the request to.
Set up a proxy on your own server. In this situation you set an endpoint on your site that simply relays requests. ie you request the information from your server, your server gets it from the other server and returns it to you.
For your situation, it the other server doesn't have support for other options, it seems like you will have to go with options 3.
Yesterday, I read some nice articles about how to prevent Json Hijacking with Asp.Net MVC. The rule is: never send sensible data in json format over a get request. With a simple search on google, you can easily learn how to define a script that will be use to extract data from another use with the help of his auth cookie.
But after reading all these articles, I don't know why it's not possible to do Json Hijacking with Ajax Jquery post request. I read that Ajax requests are subject to the same origin policy but JQuery have a property to be able to do cross-domain request.
In this case, is it possible to do Json Hijacking with a script using $.postJSON on the document ready event? If yes or no, could you explain my exactly why?
Here is a simple bunch of code to do what I'm thinking:
$.postJSON = function (url, data, callback) {
$.post(url, data, callback, "json");
};
<script>
$(function(){
$.postJSON("/VulnerableSite/ControllerName/ActionName",
{ some data parameters }, function() {
// Code here to send to the bad guy the data of the hacked user.
}
});
</script>
Thank you very much.
but JQuery have a property to be able to do cross-domain request.
Yeah, but it works only with GET requests. You cannot do cross domain AJAX calls with POST requests. Also most modern browsers have already fixed the possibility to override the __defineSetter__ method. The idea of this attack relies on including a <script> tag pointing to your website from a malicious site. But the browser sends a GET request in order to retrieve this script and not POST. That's why it is safer to use POST to transmit sensitive information with JSON.
Ok, so basically.
I inject some javascript code into a web page and it uploads an image on that page to another server.
Now I have it working when I run it on my domain (of course), but I need to post the multipart/form-data request to a PHP file that I do not own.
Since it is a upload and not a simple request to just get data, I cannot use jsonp in the initial call since the response would not be in json.
Using James Padolsey's cross domain script, I am able to do $.get and $.post request across domains, but since I am using $.ajax it does not work.
He uses the Yahoo Query Language to acomplish this
This is basically how I am making the request
$.ajax({
url: 'http://website.com/upload.php',
type: 'POST',
contentType:'multipart/form-data',
data: postData,
success: successCallback,
error : function(XMLHttpRequest, textStatus, errorThrown) {
console.log('Error');
}
});
I want to make it completely JavaScript based to avoid making my server do the request.
So to re-cap, I can get the image bytes and make the request with javascript. But so far I cannot make it cross domain since I am $.ajax to set the content Type to "multipart/form-data".
Is there another way to make the request cross domain with or without the YQL?
Making the request with an iframe will not work since the domain of the iframe would change and I would not have access to the response.
This is a well known and difficult problem for web development, know as the Same Origin Policy
Javascript prevents access to most methods and properties to pages across different origins. The term "origin" is defined using the domain name, application layer protocol, and (in most browsers) port number of the HTML document running the script. Two resources are considered to be of the same origin if and only if all these values are exactly the same.
There are several ways around this.
Create your own proxy
Create a page that simply forwards the request to the other server, and returns its response
or, Use Apache's rules to form a proxy (see above link)
Use someone else's proxy
For GET requests which are typical Use YQL to access yahoo's proxy
For POST requests, if the 3rd party supports Open Data Tables
or, Use some other public proxy
See if the 3rd party conforms to the CORS specification
Cross domain POST query using Cross-Origin Resource Sharing getting no data back
If you are willing to allow a little flash on your page, try flXHR
it claims to implement the exact XHR api and also has a jquery plugin
These are pretty much your only options