SyuanYu 2 vuotta sitten
vanhempi
commit
eff10e4925
3 muutettua tiedostoa jossa 18 lisäystä ja 1 poistoa
  1. 1 0
      frontend/index.html
  2. 4 0
      frontend/src/main.ts
  3. 13 1
      frontend/src/views/Login.vue

+ 1 - 0
frontend/index.html

@@ -15,6 +15,7 @@
 <body>
   <div id="app"></div>
   <script type="module" src="/src/main.ts"></script>
+  <!-- <script src="https://apis.google.com/js/platform.js" async defer></script> -->
 </body>
 
 </html>

+ 4 - 0
frontend/src/main.ts

@@ -4,6 +4,7 @@ import App from "./App.vue";
 import { vuetify } from "./plugins/vuetify";
 import { pinia } from "./plugins/pinia";
 import i18n from './plugins/i18n'
+import vue3GoogleLogin from 'vue3-google-login'
 
 const app = createApp(App);
 
@@ -11,5 +12,8 @@ app.use(pinia);
 app.use(router);
 app.use(vuetify);
 app.use(i18n);
+app.use(vue3GoogleLogin, {
+    clientId: '136107811725-n71808u8t465f1afhpe2e5j7mn606nd8.apps.googleusercontent.com'
+})
 
 app.mount("#app");

+ 13 - 1
frontend/src/views/Login.vue

@@ -8,6 +8,15 @@ import { useI18n } from "vue-i18n";
 import { googleTokenLogin } from "vue3-google-login";
 import { saveLocalToken } from "@/utils";
 import Navbar from "@/components/Navbar.vue";
+import { decodeCredential } from "vue3-google-login";
+
+const callback = (response: any) => {
+  // This callback will be triggered when the user selects or login to
+  // his Google account from the popup
+  console.log("Handle the response", response);
+  const userData = decodeCredential(response.credential);
+  console.log("Handle the userData", userData);
+};
 
 const GOOGLE_CLIENT_ID =
   "136107811725-n71808u8t465f1afhpe2e5j7mn606nd8.apps.googleusercontent.com";
@@ -23,7 +32,8 @@ const handleGoogleAccessTokenLogin = () => {
     data.value = response;
     saveLocalToken(response.access_token);
     mainStore.setToken(response.access_token);
-    mainStore.googleLogin(response.access_token);
+    const userData = decodeCredential(response.credential);
+    console.log("Handle the userData", userData);
   });
 };
 
@@ -130,6 +140,8 @@ onMounted(() => {
               <span></span>
             </section>
 
+            <GoogleLogin :callback="callback" prompt auto-login class="mt-5" />
+
             <v-btn
               class="google-btn"
               type="button"