Vue 3 Google登录用户身份验证在控制台中显示不推荐的警告

Question

我试图在我的Vue 3应用程序中实现使用Google的标志，我找到了一些npm包来实现这个特性，但是这些软件包很快就会被废弃(此警告显示在控制台中。)。

我喜欢使用谷歌身份服务在使用Google功能时添加到我的web应用程序中，它提供了一键登录和自动登录等功能，我如何在Vue 3中轻松地实现这个功能呢？

Answer 1

我已经创建了一个小型插件Vue3-google-登录，它使用谷歌身份服务来实现像Google登录、一键登录和自动登录这样的功能。

下面是使用Vue3-google-登录在Button中创建一个简单谷歌签名的示例代码

第一个在main.js中初始化插件和你的Google客户端ID

import { createApp } from 'vue'
import App from './App.vue'
import vue3GoogleLogin from 'vue3-google-login'

const app = createApp(App)

app.use(vue3GoogleLogin, {
  clientId: 'YOUR_GOOGLE_CLIENT_ID'
})

app.mount('#app')

然后像这样使用GoogleLogin组件

<script setup>
const callback = (response) => {
  console.log("Handle the response", response)
}
</script>

<template>
  <GoogleLogin :callback="callback"/>
</template>