Skip to content

Instantly share code, notes, and snippets.

@neno-tech

neno-tech/code.gs

Last active October 8, 2021 03:54
Show Gist options
  • Save neno-tech/9aa467814a2d4885c08592f04e042535 to your computer and use it in GitHub Desktop.
Save neno-tech/9aa467814a2d4885c08592f04e042535 to your computer and use it in GitHub Desktop.
Download ZIP
การทำระบบ Login WebApp ด้วยบัญชี Google โดยใช้ Firebase
Raw
code.gs
function doGet(e) {
return HtmlService.createHtmlOutputFromFile('login')
.setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL)
.setSandboxMode(HtmlService.SandboxMode.IFRAME)
.setTitle('FirebaseUI | Firebase Authentication');
}
function webAppUrl() {
return ScriptApp.getService().getUrl();
}
Raw
login.html
<!DOCTYPE html>
<html>
<head>
<base target="_top">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<script src="https://www.gstatic.com/firebasejs/7.14.2/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/7.14.2/firebase-auth.js"></script>
<script src="https://cdn.firebase.com/libs/firebaseui/3.5.2/firebaseui.js"></script>
<link type="text/css" rel="stylesheet" href="https://cdn.firebase.com/libs/firebaseui/3.5.2/firebaseui.css" />
<script>
var firebaseConfig = { // enter the details below
// apiKey: "AIzaSyAETAg6kj9AHtcjJmHkpT17Htxzffa60Mg",
// authDomain: "login--webapp.firebaseapp.com",
// projectId: "login--webapp",
// storageBucket: "login--webapp.appspot.com",
// messagingSenderId: "58151056786",
// appId: "1:58151056786:web:f5016fc8bfa62db886bd4b"
};
firebase.initializeApp(firebaseConfig);
</script>
<script>
google.script.run.withSuccessHandler(function(url) {
var uiConfig = {
signInFlow: 'popup',
signInSuccessUrl: url,
signInOptions: [
firebase.auth.GoogleAuthProvider.PROVIDER_ID,
firebase.auth.FacebookAuthProvider.PROVIDER_ID,
firebase.auth.EmailAuthProvider.PROVIDER_ID
],
};
var ui = new firebaseui.auth.AuthUI(firebase.auth());
var user = firebase.auth().currentUser;
if (user) {
window.open('https://www.youtube.com');
document.getElementById("signOut").style.display = "inline-block";
} else {
ui.start('#firebaseui-auth-container', uiConfig);
}
}).webAppUrl();
</script>
<script>
initApp = function() {
firebase.auth().onAuthStateChanged(function(user) {
if (user) {
user.getIdToken().then(function(accessToken) {})
} else {
document.getElementById('account-details').textContent = '';
}
});
};
window.addEventListener('load', function() {
initApp();
});
</script>
</head>
<body>
<div class="container center-align">
<br /><br /><h1>เว็บแอประบบลงชื่อเข้าใช้งาน</h1><br />
<div id="firebaseui-auth-container"></div>
<div class="row">
<div class="col s12 m3 offset-m4">
<pre id="account-details" class="left-align"></pre>
</div>
</div>
<button style="display: none" id="signOut" class="firebaseui-idp-button mdl-button mdl-js-button mdl-button--raised firebaseui-idp-google firebaseui-id-idp-button" data-provider-id="google.com" data-upgraded=",MaterialButton">
<span class="firebaseui-idp-icon-wrapper"><img class="firebaseui-idp-icon" alt="" src="https://www.gstatic.com/firebasejs/ui/2.0.0/images/auth/google.svg"></span>
<span class="firebaseui-idp-text firebaseui-idp-text-long">Sign out (ออกจากระบบ)</span>
</button>
<script>
document.getElementById('signOut').addEventListener('click', function(event) {
firebase.auth().signOut();
reload();
});
function reload() {
google.script.run.withSuccessHandler(function(url) {
window.open(url, '_top');
}).webAppUrl();
}
</script>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment