del.icio.us direc.tor: Creating A Client-Side Web Service Broker
June 20, 2005
The most frustrating part of creating any client-side application is the security model that applies to just about all executable objects that can be accessed by the browser. Designed the prevent cross-site scripting attacks (XSS), the same-origin policy effectively prohibits a page served from
www.mydomain.org to access any document served from a different domain, via XmlHTTPRequest, IFRAME's, or similar DOM methods. Therefore, a page with a URL of
http://www.mydomain.org:80/ cannot access another page that does not share the same protocol, domain, and port.
One exception to this rule is when the
document.domain property is set. This exception stipulates that in an FRAME/IFRAME situation, documents served from different subdomains of the same base domain may access each other's DOM tree if both pages set their respective
document.domain property to the base domain. For example, if a page
blue.domainA.org/master.html contains an IFRAME of the page
document.domain = "domainA.org";, then access to the DOMs will be granted. What is somewhat confusing is that all pages have a valid
document.domain property that is set, but is considered null by the security model until it is set explicitly. Unfortunately, XmlHTTPRequest objects are not affected by the
document.domain property. XmlHTTPRequest will only fetch documents from the originating server. In fact, you have to specify a relative URL, since it completely ignores any URL's with a fully-qualified domain name.
None of these security policies apply when executing a web page served from
localhost. You can use IFRAME's and XmlHTTPRequest objects to access any valid URL to your heart's content.
<script> reference to any valid URL, i.e.
<script> string, but by way of DOM node creation:
// Create a new script node var element = document.createElement('script'); // set the 'src' attribute of the element element.setAttribute('src', 'http://johnvey.com/features/deliciousdirector/dboot.js'); // insert the new node into the current document document.body.appendChild(element);
Resetting the Page
Once the foreign code is loaded, you may want to clear the content from the page in order to start from a clean slate: