Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Not a valid origin for the client from Google API Oauth

I'm receiving this error from Google API Oauth:

idpiframe_initialization_failed", details: "Not a valid origin for the client: http://127.0.0.…itelist this origin for your project's client ID

I'm trying to send a request from this local path:

http://127.0.0.1:8887/

And I already added this URL to the Authorized JavaScript origins section: enter image description here

This is my code:

<!-- The top of file index.html --> <html itemscope itemtype="http://schema.org/Article"> <head>   <!-- BEGIN Pre-requisites -->   <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js">   </script>   <script src="https://apis.google.com/js/client:platform.js?onload=start" async defer>   </script>   <!-- END Pre-requisites -->  <!-- Continuing the <head> section -->   <script>     function start() {       gapi.load('auth2', function() {         auth2 = gapi.auth2.init({           client_id: 'MY CLIENT ID.apps.googleusercontent.com',           // Scopes to request in addition to 'profile' and 'email'           //scope: 'https://www.google.com/m8/feeds/'         });       });     }   </script>     </head> <body>   <button id="signinButton">Sign in with Google</button> <script>   $('#signinButton').click(function() {     // signInCallback defined in step 6.     auth2.grantOfflineAccess().then(signInCallback);   }); </script>    <!-- Last part of BODY element in file index.html --> <script> function signInCallback(authResult) {   if (authResult['code']) {      // Hide the sign-in button now that the user is authorized, for example:     $('#signinButton').attr('style', 'display: none');      // Send the code to the server     $.ajax({       type: 'POST',       url: 'http://example.com/storeauthcode',       // Always include an `X-Requested-With` header in every AJAX request,       // to protect against CSRF attacks.       headers: {         'X-Requested-With': 'XMLHttpRequest'       },       contentType: 'application/octet-stream; charset=utf-8',       success: function(result) {         // Handle or verify the server response.       },       processData: false,       data: authResult['code']     });   } else {     // There was an error.   } } </script>   <!-- ... --> </body> </html> 

How can I fix this?

like image 415
Filipe Ferminiano Avatar asked May 19 '17 11:05

Filipe Ferminiano


People also ask

How do I whitelist origin on Google API?

Please go to https://console.developers.google.com/apis/credentials, click on the 'edit' button of your Client ID, and add your site to the origin whitelist.


1 Answers

Reseting Chrome cached solved it for me. Long press on Reload button, then Empty Cache and Hard Reload.

Note: Make sure your Chrome Dev tools panel is open otherwise long press wont work.

enter image description here

like image 118
Kirill Kovalevskiy Avatar answered Oct 02 '22 10:10

Kirill Kovalevskiy