External Content Properties: Difference between revisions
No edit summary |
No edit summary |
||
Line 8: | Line 8: | ||
== Accessing context variables in external content webpages == | == Accessing context variables in external content webpages == | ||
[[Context#Effective_Context_and_Context_Inheritance|Context variables]] in the session context can be get and set in the external content webpage using the '''getSessionVariable(variableName)''' | [[Context#Effective_Context_and_Context_Inheritance|Context variables]] in the session context can be get and set in the external content webpage using the following javascript functions: | ||
* '''getSessionVariable(variableName)''' where variableName is the name of the read session context variable | |||
* '''setSessionVariable(variableName, variableValue)''' where variableName is the name of the set session context variable and variableValue is its value (the value must be string) | |||
Following code example demonstrates how the context variables can be set and get though '''window.parent''': | |||
<pre> | <pre> | ||
window.parent.setSessionVariable("variable1", "value1"); | window.parent.setSessionVariable("variable1", "value1"); | ||
Line 20: | Line 24: | ||
Note that these functions read only the session context - not the external presentation object's effective context. To access the effective context, you can pass context variable names in the iFrame url. If the variables are after the hashtag (#) sign, the whole external web page is not updated. Url changes can be monitored through '''onhashchange''' event in the '''window''' object. Example | Note that these functions read only the session context - not the external presentation object's effective context. To access the effective context, you can pass context variable names in the iFrame url. If the variables are after the hashtag (#) sign, the whole external web page is not updated. Url changes can be monitored through '''onhashchange''' event in the '''window''' object. Example | ||
<pre> | <pre> | ||
window.onhashchange = function() { | window.onhashchange = function() { | ||
var iFrameUrl = window.location.href; | var iFrameUrl = window.location.href; | ||
var listOfParameters = iFrameUrl.substr(iFrameUrl.indexOf("#") + 1)); | var listOfParameters = iFrameUrl.substr(iFrameUrl.indexOf("#") + 1)); | ||
} | } | ||
</pre> | |||
== Web browser security considerations == | == Web browser security considerations == | ||
Some websites prevent themselves to be embedded into other websites using iFrame. In those cases, the external content presentation object will be left blank (in Chrome and Firefox) or there may be an error message "This content cannot be displayed in a frame" (in Internet Explorer). The way to workaround the issue is to have '''X-Frame-Options''' HTTP response header changed in the embedded website (more information: https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/X-Frame-Options). | Some websites prevent themselves to be embedded into other websites using iFrame. In those cases, the external content presentation object will be left blank (in Chrome and Firefox) or there may be an error message "This content cannot be displayed in a frame" (in Internet Explorer). The way to workaround the issue is to have '''X-Frame-Options''' HTTP response header changed in the embedded website (more information: https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/X-Frame-Options). |
Revision as of 16:27, 16 April 2017
With the External Content presentation object you can show content from some other website or web portal. The External Content presentation object uses html's iframe element to embed the websites. Using the External Content presentation object enables integrating multiple Web applications into a single UI.
Properties Tab
The following properties can be set on the Properties tab:
- Name: Name of the External Content presentation object.
- Description: Description for the External Content presentation object.
- External Content URL: The URL of the external page you want to embed in QPR MobileDashboard. You can also use a relative path (e.g. "/examples/test.html"), if the page you want to embed is accessible by the same protocol, host, and port as QPR MobileDashboard.
Accessing context variables in external content webpages
Context variables in the session context can be get and set in the external content webpage using the following javascript functions:
- getSessionVariable(variableName) where variableName is the name of the read session context variable
- setSessionVariable(variableName, variableValue) where variableName is the name of the set session context variable and variableValue is its value (the value must be string)
Following code example demonstrates how the context variables can be set and get though window.parent:
window.parent.setSessionVariable("variable1", "value1"); var variable1 = window.parent.getSessionVariable("variable1");
Context variable values must be strings.
There is also a text page available in QPR MobileDashboard installation where the functioning of the variables can be tested: http(s)://SERVERNAME:8080/mobiledash/examples/test.html
Note that these functions read only the session context - not the external presentation object's effective context. To access the effective context, you can pass context variable names in the iFrame url. If the variables are after the hashtag (#) sign, the whole external web page is not updated. Url changes can be monitored through onhashchange event in the window object. Example
window.onhashchange = function() { var iFrameUrl = window.location.href; var listOfParameters = iFrameUrl.substr(iFrameUrl.indexOf("#") + 1)); }
Web browser security considerations
Some websites prevent themselves to be embedded into other websites using iFrame. In those cases, the external content presentation object will be left blank (in Chrome and Firefox) or there may be an error message "This content cannot be displayed in a frame" (in Internet Explorer). The way to workaround the issue is to have X-Frame-Options HTTP response header changed in the embedded website (more information: https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/X-Frame-Options). Template:MDBTutorialExternalContent