Rate this page:
An iframe instance whose parent and child reside on different domains or hostnames constitutes a sandboxed environment. The contained page has no access to its parent. These restrictions are imposed by the browser's same origin policy.
There are a few limitations applicable to iframes:
Only content within an element with the class will be resized automatically. Content without this identifier is sized according to the element, and is not dynamically resized. The recommended DOM layout for your app is:
1 2 3 4 5 6 7 8
<div class="ac-content"> <p>Hello World</p> <div id="your-id-here"> <p>Addon content goes here</p> </div> ...this area reserved for our resize sensor divs </div>
The resize sensor div is added on the iframe's load event. Removing the element after this, will prevent resizing from working correctly.
A single app can generate multiple iframes in a particular page in the target application. Depending on the use case for the app, the iframes may need to share information between each other.
A common scenario in which a single app presents multiple iframes in a page is where a web panel or other page element spawns a dialog box.
The only restriction on the data shared in this manner is that it must be serializable using the structured clone algorithm.
For more information on the event API visit the events documentation.
This library establishes the cross-domain messaging bridge with its parent. It also provides several methods and objects that you can use in your pages without making a trip back to your app server.
You must add the script to your pages in order to establish the cross-domain messaging bridge. Make sure your pages include the following script:
If you're using the atlassian-connect-express client library to build your app, this will automatically be inserted into your pages at run time.
Don't download the file and serve it up from your app server directly. The all.js file must be served up by Atlassian in order for the cross-domain messaging bridge to be established.
The file is only intended for use in an iframe inside an Atlassian product and does not work for standalone web pages.
<script src="https://connect-cdn.atl-paas.net/all.js" data-options="option1:value;option2:value"></script>
If you are using requirejs or other dynamic script loader, use an element with an id of in place of a script tag.
<div id="ac-iframe-options" data-options="option1:value;option2:value"></div>
The following options are currently supported:
|or||You can deactivate the automatic resizing by setting .|
|or||With , the iframe will take up its parent's space (instead of being sized to its internal content).|
|or||If , the option sets the body element's top, right and left margin to 10px for dialogs, and to 0 for non-dialog pages.|
|or||With , a base tag pointing to the host page is injected: . This can be useful for embedded links to product pages.|
1 2 3
<script src="https://connect-cdn.atl-paas.net/all.js"></script> <!-- replace with --> <script src="https://connect-cdn.atl-paas.net/all-debug.js"></script>
To make errors available to scripts running in your iframe (eg. front end monitoring such as Sentry or New Relic), you'll need to make a CORS request:
<script src="https://connect-cdn.atl-paas.net/all.js" crossorigin="anonymous"></script>
Rate this page: