index.ejs 3.46 KB
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <script src="https://apis.google.com/js/platform.js" async defer></script>
    <meta name="google-signin-client_id" content="94679084723-s5f0686p2porp9mkakrp1p89a48n24nj.apps.googleusercontent.com">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>first</title>
    <link rel="stylesheet" href="stylesheets/bootstrap.css">
    <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@700&display=swap" rel="stylesheet">

    <style>
        img{
            max-width: 100%;
            height: 100% !important;
        }
        h1{font-family: 'Noto Sans KR', sans-serif;}
        h4{font-family: 'Noto Sans KR', sans-serif;}
        h2{font-family: 'Noto Sans KR', sans-serif;}
        h3{font-family: 'Noto Sans KR', sans-serif;}
        h5{font-family: 'Noto Sans KR', sans-serif;}
        .middle{
            display: inline-block;
            vertical-align: middle;
        }
    </style>

</head>

<body>
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
    <a class="navbar-brand" href="/"><img src="images/home.png" width="40" height="40" alt="">
    </a>
    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-icon"></span>
    </button>
    <div class="collapse navbar-collapse" id="navbarSupportedContent">
        <a class="navbar-brand" href="/" ><strong>Home</strong></a>
        <ul class="navbar-nav mr-auto mt-2 mt-lg-0">

            <li class="nav-item active">
                <a class="nav-link" style="color:#ffffff" href="/" onclick="signOut();">Logout<span class="sr-only">(current)</span></a>
            </li>

        </ul>
    </div>
</nav>
<div class="pricing-header px-3 py-1 pt-md-3 pb-md-1 mx-auto text-center">
    <h3 class="display-6 font-weight-bold" >Login</h3>
</div>
<section id="carousel-3" class="text-center">
    <div class="row">
        <div class="col-4"></div>

        <div class="col-4"><div class="g-signin2" class="text-center" data-onsuccess="onSignIn"></div></div>


    <a href="#" onclick="signOut();">Sign out</a>
            </div>
    </div>
</section>
</body>


<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.
        var id_token = googleUser.getAuthResponse().id_token;
        // console.log(id_token);
        var xhr = new XMLHttpRequest();
        xhr.open('POST', '/index');
        xhr.setRequestHeader('Content-Type', 'application/json');
        xhr.onload = function() {
            console.log('Signed in as: ' + xhr.responseText);
            if(xhr.responseText == 'success'){
                signOut();
                location.assign('/login')
            }
        };
        xhr.send(JSON.stringify({token : id_token}));
    }
    function signOut() {
        var auth2 = gapi.auth2.getAuthInstance();
        auth2.signOut().then(function () {
            console.log("User signed out.");
        });
    }
</script>
<script src="javascripts/bootstrap.js"></script>
</html>