---
schema_version: "1"
id: 9fbb1ef79775826ea868705fbe6ca019c42358a4f846aa698cf334de523e6beb
title: Referencing Untrusted Third-Party Content with iframes
collection: developer
version: current
locale: en-us
portal_url: https://docs.salesforce.com/developer/current/en-us/platform/salesforce-pages-developers-guide/guides/pages/resources/pages-resources-iframe.md
canonical_url: https://developer.salesforce.com/docs/platform/salesforce-pages-developers-guide/guide/pages-resources-iframe.html
source_site: developer.salesforce.com
content_type: documentation
content_hash: b205105686c6fb1ba6cfb0462580b5fba4a239f3f4bc9999c1962e680a62c450
products:
  - Visualforce Developer Guide
  - Platform Developer Content
---

# Referencing Untrusted Third-Party Content with iframes

It’s a good idea to isolate static resources downloaded from an untrusted source. You can use an iframe to separate third-party content from your Visualforce page to provide an extra layer of security and help you protect your assets.

To reference a static HTML file on a separate domain, use `$IFrameResource.<resource_name>` as a merge field, where _resource_name_ is the name you specified when you uploaded the resource. For example:

```nolang
<apex:iframe src="{!$IFrameResource.TestHtml}" id ="theiframe" width="500" height="500"/>
```

The iframe tag injects JavaScript into both the parent document and the child iframe to establish a secure communication between the two elements. The parent document can have multiple iframes. Each uniquely named static resource lives in its own subdomain of `force-user-content.com`.

Access to an iframe is not authenticated, so any third-party content it contains can’t access a user’s session ID.

## Communicating with the iframe in the Parent Document

You can write JavaScript code in the parent document to communicate with the iframe.

-   To send a message to theiframe:

    ```nolang
    SfdcApp.iframe.sendMessage('theiframe', {
        key1: value1, 
        key2: value2
    });
    
    ```

-   To receive messages from theiframe:

    ```nolang
    SfdcApp.iframe.addMessageHandler('theiframe', function(data) {
        if(data.key1) {
            …
        }
    });
    
    ```

-   To catch an error from theiframe:

    ```nolang
    SfdcApp.iframe.addErrorHandler('theiframe', function(error) {
        console.log(error);
    });
    
    ```


## Communicating with the Parent Document in the iframe

You can also communicate the other way from the iframe document.

-   To send a message to the parent document:

    ```nolang
    LCC.onlineSupport.sendMessage('containerUserMessage', {
        key1: value1, 
        key2: value2
    });
    
    ```

-   To set up a handler to receive messages from the parent document:

    ```nolang
    LCC.onlineSupport.addMessageHandler(function(message) {
        if(data.key1) {
            …
        }
    });
    
    ```

    To remove this handler:

    ```nolang
    LCC.onlineSupport.removeMessageHandler(function)
    ```

-   To set up a handler for message errors from the parent document:

    ```nolang
    LCC.onlineSupport.addMessageErrorHandler(function(message) {
        if(data.key1) {
            …
        }
    });
    
    ```

    To remove this handler:

    ```nolang
    LCC.onlineSupport.removeMessageErrorHandler(function)
    ```

-   To set up a handler for other types of errors:

    ```nolang
    LCC.onlineSupport.addErrorHandler(function(message) {
        if(data.key1) {
            …
        }
    });
    
    ```

    To remove this handler:

    ```nolang
    LCC.onlineSupport.removeErrorHandler(function)
    
    ```


