How to bypass token protection against CSRF in HTML 5

This article would explain how it is possible to bypass token based protection against CSRF attacks as a result of improper usage of HTML 5 XDR/COR mechanism.

As we all know, today popular browsers implement the SOP (Same Origin Policy) mechanism in order to prevent from sites to access and get other sites' content via Javascript. However, there are sometimes business needs which require such cross domain access and technologies such as flash and silverlight already have implemented the well known crossdomain.xml file which defines a list of allowed sites that can access a site.

HTML5 brings us a similar mechanism the XDR (Cross Domain Request) also known as COR (Cross Origin Request). This mechanism allows a website to be accessible by foreign websites via Ajax calls. In contrary to flash/silverlight, XDR works on a per-page access control model. Every page that is supposed to be accessed by foreign sites, should respond with the ‘Access-Control-Allow-Origin' header in the HTTP Response header and specify a white list of websites that are allowed to access its content.

The big security concern is that programmers would set the Access-Control-Allow-Origin with the wildcard '*', which means that all websites are allowed to access the pages which contains such definition via ajax calls.
Example: Response.AddHeader("Access-Control-Allow-Origin", "*");

Such bad coding practice will allow every website on the internet to access and get the content of the page that contains such definition via javascript (ajax call).
But there is another big security issue: well known token based protection against CSRF attacks could be easily bypassed. In case of page that inserts/updates/deletes data in the database and implements the famous token based protection against CSRF attacks and also allows access to foreign sites, the attacker can steal the csrf protection token by sending two ajax requests as described in the following steps:

1. The victim is logged-in to application A and simultaniously accesses attacker's siteB.
2. Attacker's page B sends and ajax request to the page on site A (which contains Access-Control-Allow-Origin:* definition and by that allows cross domain access) and gets the csrf token from the response!
3. Finally, attacker's page B sends a request to the page from site A with the token that the server of site A expects to get.
In such way the attacker will bypass the protection against CSRF attack and send a valid request with a valid token to the server of site A which will process the request as it was sent by the victim.

The solution is quite simple: Pages should define a white list of sites that are allowed to get the content in the "Access-Control-Allow-Origin" header.
Wildcard '*', shouldn't be used in pages with insert/update/delete and even view functionality.