问题
I have published a web app with Google sign in using Google apps script. Every time you log into your google account on another computer to access this web-app, an error will appear: "redirect_uri_mismatch".
I see that on each computer login to google account, the published web app has different javaScript origin in the request link and I have add this link into Authorized JavaScript origins on the Google developer console for this computer login as well to make Google sign in work.
I want my console.developers.google.com to have just only one authorized JavaScript origin (link app script). I expect all users access and login without error "redirect_uri_mismatch"
It is inconvenient if there are thousands of users, how to improve?
code html :
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="google-signin-client_id" content="1xxxxxxxxxx-xxxxxxxxi87eht.apps.googleusercontent.com">
<title>Oauth2 web</title>
<!-- Google library -->
<script src="https://apis.google.com/js/platform.js" async defer></script>
<!-- Jquery library to print the information easier -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
<!-- Bootstrap library for the button style-->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
</head>
<body>
<div id="profileinfo">
</div>
<div class="g-signin2" data-onsuccess="onSignIn"></div>
<script>
function onSignIn(googleUser) {
var profile = googleUser.getBasicProfile();
console.log('ID: ' + profile.getId()); // Do not send to your backend! Use an ID token instead.
console.log('Name: ' + profile.getName());
console.log('Image URL: ' + profile.getImageUrl());
console.log('Email: ' + profile.getEmail()); // This is null if the 'email' scope is not present.
$("#profileinfo").append("<h2>Sup " + profile.getName() + ", welcome home my friend</h2>");
$("#profileinfo").append("<img style='width:250px;height:250px' src='" + profile.getImageUrl() + "'><br><br>");
$("#profileinfo").append("<p>Your email is: " + profile.getEmail() + "</p>");
}
</script>
<button type="button" class="btn btn-danger" onclick="signOut();">Sign out</button>
<script>
function signOut() {
var auth2 = gapi.auth2.getAuthInstance();
auth2.signOut().then(function () {
console.log('User signed out.');
$("#profileinfo").empty();
$("#profileinfo").append("<h2>Goodbye old friend</h2>");
});
}
</script>
</body>
</html>
Error when logging in on another computer:
The change of the link is highlighted in yellow:
回答1:
This may not work, but you can default to 0 using this script at index.html:
<script>
if(!/-0lu/.test(location.href)){
location.href = location.href.toString().replace(/-\d+lu/,'-0lu');
}
</script>
Your web-app script.google.com has a sandboxed iframe *[DIGIT]lu-script.googleusercontent.com. We're just trying to change the location of this iframe using regex. If something other than 0lu is present as iframe, We replace it to 0lu
来源：https://stackoverflow.com/questions/56862586/different-javascript-origin-for-the-same-web-app-on-each-computer-causes-error