The target origin provided ('https://docs.google.com') does not match the recipient window's origin ('http://localhost:3000')

Question

Hi I am trying to access google drive from my react application, When I am signing in an iframe appears and and shows 'The developer key is invalid'. I am using a google drive library react-google-picker.

I am getting a message like this Failed to execute 'postMessage' on 'DOMWindow': The target origin provided ('https://docs.google.com') does not match the recipient window's origin ('http://localhost:3000') in the browser console .

I cannot understand why does it says The target origin provided ('https://docs.google.com'), I entered http://localhost:3000 in the google developers console as Javascript origin url. Is it an issue of the iframe ?

Answer 1

What fixed it for me was using the suggestion by Ilia:

1. Go to Google Drive > Settings > Manage Apps > Scroll Down and find your (App Name) on the right side of the container you will see "Options" click on it and press "Disconnect from Drive"

And then also checking my network request to see that I was missing an API key.