tonyxu-io/google-oauth-login.html

## google-oauth-login.html
<!doctype html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Index</title>
    <button onclick="openWindow()">Login</button>
    <pre id="access_token"></pre>
    <pre id="tokenInfo"></pre>
    <pre id="userInfo"></pre>
    <script type="text/javascript">
    function openWindow() {
        var openUrl = 'https://accounts.google.com/o/oauth2/v2/auth?scope=https://www.googleapis.com/auth/drive.metadata.readonly https://www.googleapis.com/auth/userinfo.profile&include_granted_scopes=true&state=state_parameter_passthrough_value&redirect_uri=http://localhost/Test/redirect.html&response_type=token&client_id=765779371392-vo1dqknaksp3a55omol03ia8qqa425u3.apps.googleusercontent.com'
        window.open(openUrl);
    }

    function handleAccessToken(access_token) {
        document.getElementById("access_token").innerHTML = access_token
        printTokenInfo(access_token)
        printUserInfo(access_token)
    }

    function printTokenInfo(access_token) {
        var xhr = new XMLHttpRequest();
        xhr.open('GET', `https://www.googleapis.com/oauth2/v3/tokeninfo?access_token=${access_token}`, true);
        xhr.onload = function() {
            document.getElementById("tokenInfo").innerHTML = JSON.stringify(JSON.parse(xhr.responseText), null, 2)
        };
        xhr.send(null);
    }

    function printUserInfo(access_token) {
        var xhr = new XMLHttpRequest();
        xhr.open('GET', `https://www.googleapis.com/oauth2/v1/userinfo?access_token=${access_token}`, true);
        xhr.onload = function() {
            document.getElementById("userInfo").innerHTML = JSON.stringify(JSON.parse(xhr.responseText), null, 2)
        };
        xhr.send(null);
    }
    </script>
</head>

<body>
</body>

</html>

## google-oauth-redirect.html
<!doctype html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Index</title>
    <script type="text/javascript">
    if (window.opener && "" != window.opener.location) {

        // If access_token is in hash params
        var hash = window.location.hash.substr(1);

        var params = hash.split('&').reduce(function(result, item) {
            var parts = item.split('=');
            result[parts[0]] = parts[1];
            return result;
        }, {});

        // If access_token is in url params
        // var url = new URL(window.location.href)
        // var access_token = url.searchParams.get("access_token")

        window.opener.handleAccessToken(params["access_token"]);
    }
    window.close();
    </script>
</head>

<body>
</body>

</html>
	<!doctype html>
	<html lang="en">

	<head>
	<meta charset="UTF-8">
	<title>Index</title>
	<button onclick="openWindow()">Login</button>
	<pre id="access_token"></pre>
	<pre id="tokenInfo"></pre>
	<pre id="userInfo"></pre>
	<script type="text/javascript">
	function openWindow() {
	var openUrl = 'https://accounts.google.com/o/oauth2/v2/auth?scope=https://www.googleapis.com/auth/drive.metadata.readonly https://www.googleapis.com/auth/userinfo.profile&include_granted_scopes=true&state=state_parameter_passthrough_value&redirect_uri=http://localhost/Test/redirect.html&response_type=token&client_id=765779371392-vo1dqknaksp3a55omol03ia8qqa425u3.apps.googleusercontent.com'
	window.open(openUrl);
	}

	function handleAccessToken(access_token) {
	document.getElementById("access_token").innerHTML = access_token
	printTokenInfo(access_token)
	printUserInfo(access_token)
	}

	function printTokenInfo(access_token) {
	var xhr = new XMLHttpRequest();
	xhr.open('GET', `https://www.googleapis.com/oauth2/v3/tokeninfo?access_token=${access_token}`, true);
	xhr.onload = function() {
	document.getElementById("tokenInfo").innerHTML = JSON.stringify(JSON.parse(xhr.responseText), null, 2)
	};
	xhr.send(null);
	}

	function printUserInfo(access_token) {
	var xhr = new XMLHttpRequest();
	xhr.open('GET', `https://www.googleapis.com/oauth2/v1/userinfo?access_token=${access_token}`, true);
	xhr.onload = function() {
	document.getElementById("userInfo").innerHTML = JSON.stringify(JSON.parse(xhr.responseText), null, 2)
	};
	xhr.send(null);
	}
	</script>
	</head>

	<body>
	</body>

	</html>