/vue-gapi

Google API Client Library wrapper for Vue.js

Primary LanguageJavaScriptMIT LicenseMIT

npm vuejs3

VueGapi

Google API Client Library wrapper for Vue.js

Requirements

Version 2 requires Vue.js v3.x.

If you are looking for a Vue.js v2.x compatible version, use Version 1.

Installation

npm install --save vue-gapi

or

yarn add vue-gapi

Usage

Installing the plugin with gapi.client.init configuration parameters:

import Vue from 'vue'
import VueGapi from 'vue-gapi'

const app = Vue.createApp({})

app.use(VueGapi, {
  apiKey: '<YOUR_API_KEY>',
  clientId: '<YOUR_CLIENT_ID>.apps.googleusercontent.com',
  discoveryDocs: ['https://sheets.googleapis.com/$discovery/rest?version=v4'],
  scope: 'https://www.googleapis.com/auth/spreadsheets',
})

exposes a $gapi global property accessible inside the application:

<script>
  export default {
    methods: {
      login() {
        this.$gapi.login().then(({ currentUser, gapi, hasGrantedScopes }) => {
          console.log({ currentUser, gapi, hasGrantedScopes })
        })
      },
    },
  }
</script>

See Examples for a comprehensive example.