Restricting access to some elements in Javascript

Question

Hi everyone,

For a project that will let developers add their own Javascript applications, I need to limit scope of Javascript to a certain div. For example, each developer will have access to their own div.

<div id="md5_of_a_salt_and_app_id">
    <script>
        /* This area should not be able to modify window element 
         * or other divs than parent one 
         */
    </script>
</div>

Is there such possibility?

Thanks in advance.

Answer 1

There are two well-known possibilities:

Google Caja

Caja is a Google project for "virtual iframes" based on the principles of object-capabilities. Caja takes JavaScript, HTML, and CSS input and rewrites it into a safe subset of HTML and CSS, plus a single JavaScript function with no free variables. That means the only way such a function can modify an object is if it is given a reference to the object by the host page.

Adsafe

The ADsafe subset blocks a script from accessing any global variables or from directly accessing the Document Object Model or any of its elements. Instead, ADsafe gives the script access to an ADSAFE object that is provided by the page's server, giving indirect access to the guest code's DOM elements and other page services.

Note that Adsafe doesn't modify scripts, while Caja does.