google sign-in Storagerelay URI is not allowed for 'NATIVE' client type

Question

I have been trying this simple google sign-in by following this tutorials:

• https://developers.google.com/identity/sign-in/web/
• http://www.codexworld.com/login-with-google-account-using-javascript/

The code is very simple and I'm exactly following the same steps as given in these tutorials, but I end up in the below error.

---

400. That’s an error.

Error: invalid_request

Storagerelay URI is not allowed for 'NATIVE' client type

In my credentials I have the configuration like below:

My Code goes like below:

<meta name="google-signin-client_id" content="377345478968-2opk94iompa38gja0stu1vi821lr3rt0.apps.googleusercontent.com">
<script src="https://apis.google.com/js/client:platform.js?onload=renderButton" async defer></script>

<div id="gSignIn"></div>


function onSuccess(googleUser) {
    var profile = googleUser.getBasicProfile();
    gapi.client.load('plus', 'v2', function () {
        var request = gapi.client.plus.people.get({
            'userId': 'me'
        });
        //Display the user details
        request.execute(function (resp) {
            console.log(resp);
        });
    });
}
function onFailure(error) {
    alert(error);
}
function renderButton() {
    gapi.signin2.render('gSignIn', {
        'scope': 'profile email',
        'width': 240,
        'height': 50,
        'longtitle': true,
        'theme': 'dark',
        'onsuccess': onSuccess,
        'onfailure': onFailure
    });
}
function signOut() {
    var auth2 = gapi.auth2.getAuthInstance();
    auth2.signOut().then(function () {
        $('.userContent').html('');
        $('#gSignIn').slideDown('slow');
    });
}

Every time when I click "Sign in with Google" button, new pop-up opens and 400 error throws up.

I also tried growing throw these answers in stackoverflow, but now luck.

1. Google OAuth 2 authorization - Error: redirect_uri_mismatch
2. Google Sign-in is not working

My Basic idea is to integrate sign in with google for my web-app, as said in this video, let me know whether this approach is good.

Solution 1

It's because you haven't got your client Id for web server. You did not opt it correctly while doing set up for getting client Id.(You opted it for "Others"). I was facing the exactly same problem but then i changed my client Id for web server and now it's working perfectly.

Solution 2

I know this has been answered but in my case, while developing a desktop app with Electron and React, I had set the OAuth2 credential type as "Desktop". Changing it to "Web application" solved it for me.

Comments

[Sibelius Seraphini]

have u found the answer?

[yashhy]

@SibeliusSeraphini nope :(

[Sibelius Seraphini]

I've found the problem, you are using a clientId from a native device (ios/android), you should we one for the web instead. Try to create a new one if needed

[yashhy]

Thanks. I cannot verify as I moved to other project. Accepting the answer coz you tried it out.

[Raphael St]

Could @Harshit edit his answer to make it less vague, i'm still lost..

[Alexander]

@RaphaelSt I've just edited the response with what I believe is the correct answer.