sdoomz / react-google-picker

Google Picker for React
MIT License
45 stars 46 forks source link

Invalid Developer Key #23

Closed kunalgorithm closed 5 years ago

kunalgorithm commented 5 years ago

Hi, I created a developer key and allocated a client ID for my app and am able to authenticate with Google using react-google-picker, but I'm subsequently met with an error screen

image

And a error message in a console that indicates a seperate error:

Failed to execute 'postMessage' on 'DOMWindow': The target origin provided ('https://docs.google.com') does not match the recipient window's origin ('localhost:3000')

Any suggestions or insights into how to fix are appreciated!

NarendraChouhan0021 commented 5 years ago

@kunalgorithm Did you find any solutions, I am also facing this issue. Please have a look

kunalgorithm commented 5 years ago

@NarendraChouhan0021 Yes, I allocated a new Google developer key and it resolved the issue. Make sure you provision the write permissions (Drive files), and mind the distinction between the developer key and the client ID. I also used the following createPicker prop:

createPicker={(google, oauthToken) => {
        const googleViewId = google.picker.ViewId.DOCS;
        const docsView = new google.picker.DocsView(googleViewId)
          .setIncludeFolders(false)
          .setMimeTypes(
            pickerType === "document"
              ? ["application/vnd.google-apps.document"]
              : ["application/vnd.google-apps.spreadsheet"]
          )
          .setSelectFolderEnabled(false);
        const picker = new window.google.picker.PickerBuilder()
          .addView(docsView)
          .setOAuthToken(oauthToken)
          .setDeveloperKey(process.env.REACT_APP_GOOGLE_PICKER_KEY)
          .setCallback(res => {
            setDoc(res.docs);
          });

        picker.build().setVisible(true);
      }}
bhedashakil commented 4 years ago

I faced same issue, please remove following line from createPicker(), it will work.

function createPicker() { var picker = new google.picker.PickerBuilder() .addView(new google.picker.DocsView()) .setOAuthToken(oauthToken) //.setDeveloperKey('AIzaSyDPs9U-dgOC9h1jRFNwOwhRtARCph8_3HM') .setCallback(pickerCallback) .build(); picker.setVisible(true); }

GeniusWiki commented 3 years ago

@bhedashakil Can not believe this is the answer, but it is, thank you!

I remember this is 2nd time google picker API broken without any notice. I use it in our live product. That is so fxxxxk to google.