gravity.script.injection
For client requirement; please see gravity.client.requirement
GRAVITY can be integrated to your application via browser extension or using direct script injection, which might be useful in case if source code of the target application can be modified accordingly.
Script injection
Script #1: simple injection
One of the options to add GRAVITY on your own site is to inject it via simple code snippet
<script>
var head = document.getElementsByTagName('head')[0];
var script = document.createElement('script');
var baseUrl = 'https://your.host/gravity/';
script.type = 'text/javascript';
script.onload = function() {
pi.gravity.inject.setup(baseUrl, baseUrl + 'inject/', 'Static inject');
}
script.src = baseUrl + 'inject/js/pi.gravity.inject.js';
head.appendChild(script);
</script>
Script #2: injection with user authentication
In case if user need to be automatically authenticated within specified email address the following snippet can be used
var head = document.getElementsByTagName('head')[0];
var script = document.createElement('script');
var baseUrl = 'https://your.host/gravity/';
var options = { email: 'user@mail.com' };
script.type = 'text/javascript';
script.onload = function() {
pi.gravity.inject.setup(baseUrl, baseUrl + 'inject/', 'Static inject', options);
}
script.src = baseUrl + 'inject/js/pi.gravity.inject.js';
head.appendChild(script);
Script #3: injection with activation only on some pages of the application
More complex solution for cases when GRAVITY might not be activated for all sites on which the script is injected
/* Gravity injection code */
var baseUrl = "https://your.host/gravity/";
var options = { email: 'user@mail.com' };
(function init() {
window.onload = function () {
injectGravity();
};
})();
function injectGravity() {
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function () {
// if gravity is enabled for current page, then load inject scripts
if (xhr.readyState === 4 && xhr.status === 200 && xhr.responseText === "true") {
loadInjectScripts();
}
};
xhr.open("GET", baseUrl + "services/info/gravity/enabled?url=" + encodeURI(location.href), true);
xhr.send();
}
function loadInjectScripts() {
var script = document.createElement('script');
script.onload = function () {
var startScript = document.createElement('script');
var srcBody = document.createTextNode("pi.gravity.inject.setup('" + baseUrl + "', '" + baseUrl + 'inject/' + "', 'Static inject', " + JSON.stringify(options) + ")");
startScript.appendChild(srcBody);
document.head.appendChild(startScript);
};
script.src = baseUrl + "inject/js/pi.gravity.inject.js";
document.head.appendChild(script);
}
CSP rules
Required headers
The following CSP headers must configured to let GRAVITY work properly in CSP secured context of the target application.
style-src
Having of 'unsafe-inline'
for styles is required as a temporary solution while we fix our and third party code to avoid this. The improved version is scheduled to be delivered in late March 2024.
script-src
The most secure way to integrate GRAVITY in CSP protected product will be:
for each document request generate a random base64-encoded string of at least 128 bits from a cryptographically secure random number generator (for example ZDNn103nceIOfn33fn6e1h3dhrs
) and use that value as the CSP header (script-src 'nonce-ZDNn103nceIOfn33fn6e1h3dhrs' https://your.gravity.host;
) and as a part of GRAVITY integration script:
If, for some technical reason, it is not possible to generate the random nonce for every request, a static value can be used instead, but this reduces the level of protection.
Optional headers
Depending on the additional content types and functionality used for Callouts, the following CSP headers must be added additionally to the base configuration described above.
Attached PDF documents or additional images
Loading of images or documents as data:
must be allowed via connect-src
connect-src data: https://your.gravity.host;
Content type: Image
Required image hosts must be allowed via img-src
img-src https://your.gravity.host https://your.images.host;
Content type: Video
Required video hosts must be allowed via media-src
media-src https://your.video.host;
img-src
must be modified also if video posters are needed.
img-src https://your.gravity.host https://your.video-posters.host;
Content type: IFrame
Required frame hosts must be allowed via frame-src
frame-src https://your.gravity.host https://your.frames.host;
Content type: YouTube video
YouTube hosts must be allowed
Content type: Vimeo video
Vimeo hosts must be allowed