Tunneling and proxy servers, and not only for Ajax

Because of its ability to communicate with the server, the object XmlHttpRequest (XHR), used in the technology Ajax (which stands for Asynchronous JavaScript and XML, which should be pronounced "egiacs" even if we Italians prefer "aiacs"), has a security lock that prevents you from running applications outside the domain in which it operates. This protection is necessary to prevent Javascript Injection (techniques of "injection" extremely dangerous code in order to break the system) of various kinds, with the ultimate objective of "break" in the system.
This limit is now taken into serious consideration and you're thinking, somehow, to solve it - XmlHttpRequest object directly - without compromising security (see also: Third Proposal for cross-site extensions to XMLHttpRequest ).

However, the situation today is as follows:

XHR

The JavaScript code that uses the XmlHttpRequest object (on the page yourWebApp.html) can only make requests to the domain miodominio.com, ie the domain where the Javascript code. Delivering this type scenario, then:

XHR

Will not work ...!

Furthermore, as shown on The Same Origin Policy of Mozilla:

[..] Mozilla considers two pages to have the examination origin if the protocol, port (if given), and host are the examination for Both pages. To illustrated this table Gives examples of origin comparisons to the URL http://store.company.com/dir/page.html .

The Same Origin Policy

It's not just the domain to make things difficult. In addition, consider that each browser has its own implementation XmlHttpRequest object and its own rules.
Anyway to solve this problem there are various techniques.

1. Proxy Server

This technique uses a server-side language to "trick", so to speak, the XHR object so as to create a tunnel between the XHR object and our external domain target. PHP, for example, is able to retrieve information from other domains in various ways, according to the type of installation and set restrictions on our server. In the general case that we tend to do is this:

XHR

In short, the XHR object communicates with our domain, where a page specially written retrieves information from an external domain. There is thus a proxy in PHP, that is, a "page through" that retrieves information for us, returning XHR object. One of the simplest proxy server is proprosto, for example, from Yahoo:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
<? Php
/ / PHP Proxy example for Yahoo! Web services.
/ / Responds to Both HTTP GET and POST requests
/ /
/ / Author: Jason Levitt
/ / December 7th, 2005
/ /

/ / Allowed hostname (api.local and api.travel Also possible are here)
'HOSTNAME' , 'http://search.yahooapis.com/' ) ; define ('HOSTNAME', 'http://search.yahooapis.com/');

/ / Get the REST call path from the AJAX application
/ / Is it a POST or a GET?
( $_POST [ 'yws_path' ] ) ? $_POST [ 'yws_path' ] : $_GET [ 'yws_path' ] ; $ Path = ($ _POST ['yws_path'])? $ _POST ['Yws_path']: $ _GET ['yws_path'];
HOSTNAME . $path ; Url = $ HOSTNAME. $ Path;

/ / Open the Curl session
curl_init ( $url ) ; $ Session = curl_init ($ url);

/ / If it's a POST, put the POST data in the body
$_POST [ 'yws_path' ] ) { if ($ _POST ['yws_path']) {
'' ; $ Postvars ='';
$element = current ( $_POST ) ) { while ($ element = current ($ _POST)) {
key ( $_POST ) . '=' . $element . '&' ; $ Postvars. = key ($ _POST). '='. $ element. '&';
$_POST ) ; next ($ _POST);
}
$session , CURLOPT_POST , true ) ; curl_setopt ($ session, CURLOPT_POST, true);
$session , CURLOPT_POSTFIELDS , $postvars ) ; curl_setopt ($ session, CURLOPT_POSTFIELDS, $ postvars);
}

/ / Do not return HTTP headers. Do return the contents of the call
$session , CURLOPT_HEADER , false ) ; curl_setopt ($ session, CURLOPT_HEADER, false);
$session , CURLOPT_RETURNTRANSFER , true ) ; curl_setopt ($ session, CURLOPT_RETURNTRANSFER, true);

/ / Make the call
curl_exec ( $session ) ; $ Xml = curl_exec ($ session);

/ / The web service returns XML. Set The Content-Type Appropriately
"Content-Type: text/xml" ) ; header ("Content-Type: text / xml");

; echo $ xml;
$session ) ; curl_close ($ session);
?>

, fread() etc… Basterebbe, infatti, aprire la destinazione sul nostro dominio esterno con una delle tante funzioni messe a disposzione da PHP, come readfile() . In this codcie you use curl , a known PHP library used to bypass any restrictions on the most simple and known commands fopen() , fread() etc ... It would be enough, in fact, open the target on our external domain with one of the many functions put at our disposal by PHP, such as readfile() . Unfortunately, often these functions are disabled or limited on some hosting, for security reasons. The curl , however, are almost always available.

2. The good old IFRAME TAG

I still remember when in 1996 implementai one of the first techniques of Remote Scripting (as it was then called, when Ajax was just a detergent). The IFRAME tag is still used today, abused, loved and despised, depending on the programmer who uses it. The IFRAME tag is often hailed as "what not to do," a dangerous door to a hacker. Ultimately, then, with the introduction in the browser XmlHttpRequest object, the IFRAME is despised even more by the "purists Ajax." In reality it is still used a lot, both for the inclusion of Widgets, Gadgets and antipixel in Blog (if you have a blog it is likely that your page is full of "holes" IFRAME and do not even know), is to bypass any block or lack of the same object XmlHttpRequest.
An IFRAME fact, opens a browser within the browser. This window can display an IFRAME external domain and can be accessed with JavaScript on the page parent. Here is a different way to bypass the blocking object XmlHttpRequest.

3. Other techniques

There are also many other alternatives as appropriate and the circumstances in which we are (you can install specific tools to manipulate the Web Server or low level). di apache o librerie come JSON per superare il problema. You can use mod_rewrite or mod_proxy apache or libraries like JSON to overcome the problem.
Other techniques (follow the link below on the "see also") are nice variations, but some have restrictions on browsers that support them, so be careful. The best, in my opinion, is the use of a simple proxy server in PHP.

4. Flash

Allow me to add Flash between the techniques of overcoming the cross-domain, if only because I mentioned in a previous post: Ajax without the HTTPRequest . Flash, of course, has nothing to do with the XHR object, and more than ever, nothing to do with JavaScript. However keep in mind some important features:

  1. A Flash movie can interact with JavaScript and the DOM of the web page
  2. Javascript can interact with a Flash movie
  3. Adobe AIR is a system in which HTML, Javascript / Ajax and Flash coexist in a harmonious and functional

Flash, unlike XHR object, so no restrictions on access cross-domain binding. In Flash there are a number of features aimed at security and access control to domains different from that which is "turning" our movie. However they are easily set by the code and substantially depend on the choices of svilupparore who wrote the code. Log on, then, to an RSS file of any domain is, in Flash, which is very simple. Moreover, instead of using a PHP page as a proxy, you can take advantage of the ability to communicate with JavaScript and Flash and then use it as a proxy.

An example of a PHP proxy server for all

A simple example of how to write a PHP page that runs a proxy server, minimal, I use very often ... ;)

1
2
3
4
5
6
7
8
9
10
11
$url ) { function getContent ($ url) {
curl_init ( ) ; $ Ch = curl_init ();
5 ; // set to zero for no timeout $ Timeout = 5; / / set to zero for no timeout
$ch , CURLOPT_URL , $url ) ; curl_setopt ($ ch, CURLOPT_URL, $ url);
$ch , CURLOPT_RETURNTRANSFER , 1 ) ; curl_setopt ($ ch, CURLOPT_RETURNTRANSFER, 1);
$ch , CURLOPT_CONNECTTIMEOUT , $timeout ) ; curl_setopt ($ ch, CURLOPT_CONNECTTIMEOUT, $ timeout);
curl_exec ( $ch ) ; $ File_contents = curl_exec ($ ch);
$ch ) ; curl_close ($ ch);
/ / Display file
$file_contents ) ; return ($ file_contents);
}

This simple function uses just the curl libraries to access a page that might be, for example, an XML RSS Feed. In this way an Ajax call will receive the results via this simple PHP proxy servers.

See also

4 comments to "Tunneling and Proxy Server for Ajax and beyond"

  1. December 10, 2007 upnews.it :

    undolog  »Blog Archive » Tunneling and Proxy Server for Ajax and more ...

    Because of its ability to communicate with the server € ™ s object XmlHttpRequest (XHR), used in Ajax (which stands for Asynchronous JavaScript and XML, which should be pronounced â € œegiacsâ €? Even if we Italians prefer â € œaiacs ...

  2. January 22, 2008 Napolux :

    Great article, I'll "deliciousizzo" on the fly : D

  3. December 22, 2008 Very short trick: proxy RSS with SimplePie | Undolog.com :

    [...] Equip yourself with a proxy (tunneling) because of the protections imposed by both technologies (see tunneling and proxy servers for Ajax and beyond). If your site or blog SimplePie is already present, you can write a simple proxy [...]

Leave a comment

TAG XHTML PERMITS: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> INSERTION CODE:
 <pre></pre> // blocco generico <code></code> // blocco generico [cc_actionscript][/cc_actionscript] // Actionscript [cc_actionscript3][/cc_actionscript3] // Actionscript 3 [cc_css][/cc_css] // CSS Style Sheet [cc_html][/cc_html] // HTML [cc_js][/cc_js] // Javascript [cc_objc][/cc_objc] // Objective-C [cc_php][/cc_objc] // PHP [cc_sql][/cc_sql] // SQL 


Stop SOPA