initUI() {
var url = myfilesUrl + ‘/word.docx’;
var viewerElement = this.template.querySelector(‘div’);
let _this = this;
var webViewer = new PDFTron.WebViewer({
path: libUrl,
config: myfilesUrl + ‘/config.js’
}, viewerElement);
viewerElement.addEventListener(‘ready’, () => {
console.log(‘Ready event listener’);
_this.iframeWindow = viewerElement.querySelector(‘iframe’).contentWindow;
console.log(‘Attempting to post message’);
_this.iframeWindow.postMessage({type: ‘LOAD_WEBVIEWER’, file: url}, ‘*’);
console.log(‘Exiting Ready event listener’);
});
The goal is to customize the WebViewer, add annotations, loadDocument, etc after the ready event via the config.js file.
But, before I can even get to the receiveMessage function inside config.js, I’m given the following error:
Viewer is on a different domain, the promise from WebViewer function is rejected and API functions will not work because of cross domain permissions. See http://r.pdftron.com/kb_cross_origin for more information.