Need help with - Failed to execute 'postMessage' on 'DOMWindow'

[SaiK99]

Using the Angular samples provided in the SDK kit I have been able to create a simple POC for my Mean stack app that runs locally on my localhost. I ended up using the PreviewFileUsingFilePromise method wherein I am providing my file as a blob (and not as the URL unlike the other method requires). This apporach works fine in some instances and not in others. Unfortunately the issue is sporadic and hard to understand. (fails 4 times out of 10).

Everytime the issue occurs, there is no pdf loaded in the iframe and my console keeps throwing this error - Failed to execute 'postMessage' on 'DOMWindow': The target origin provided ('<URL>') does not match the recipient window's origin ('<URL>'). 

Upon digging a little deeper, the error is caused in the following lines of the embedded javascript file (ViewSDKInterface.js):

e.isInstanceStillAlive() && e._iframeElement.contentWindow.postMessage(t, r)

A little research and googling has led me to the following:

https://stackoverflow.com/questions/27573017/failed-to-execute-postmessage-on-domwindow-https-www-yo...

Having said that, the questions that I have are

1. Could this be the very reason for my issues as well (http vs https)? If so, how can I get around it with localhost? Also, it does not explain why it works sometimes while not at other times. 

2. If not, then what could be causing it?

3. Somewhat unrealted, but I guess valid in my case. Since I am using the PreviewFileUsingFilePromise method and providing the file blob to process for pdf. Does Adobe use this blob or any file related content and store them on the Adobe server's? 

Thanks and any help would be much appreciated!

[Sumona Ghosh]

Thanks for using View SDK.

Would it be possible for you to share the code snippet so we can debug and try to find out what's causing the issue?

In response to your third question, Adobe DC View SDK doesn't store any user data and file related content on its servers.

[SaiK99]

Thanks so much for your response. 

So the issue was something to do with the way I was displaying different pdf's in my Angular app using the material tabs. I was able to get around it by clearing the old iframe element that still remains in the div when I tab off. Once the old iframe was cleared there was no conflict and the pdf renders fine.

[aknoerig]

I just ran into this issue myself, using the VueJS framework. I think the problem runs deeper, and you might have "accidentally" solved it by refactoring your code.

In VueJS, the error appears if you declare the viewer variable in the component data:

export default defineComponent({
  ...
  data () {
    return {
      adobeViewer: undefined
    }
  },
  ...
  mounted () {
    this.adobeViewer = new AdobeDC.View(...)
  }
}

This can be an issue when the instantiated object is very complex, as VueJS attempts to make it reactive.

Instead, define it outside of the component (or locally):

const adobeViewer: undefined

export default defineComponent({
  ...
  data () {
    return {
    }
  },
  ...
  mounted () {
    adobeViewer = new AdobeDC.View(...)
  }
}

Not sure how this translates to Angular, though. 🙂