Как получить access_token, используя пакет vue-google-api для дальнейшего использования в Google api? - PullRequest
0 голосов
/ 12 ноября 2019

Я новичок в VueJS и Google API, поэтому я внедряю Google Drive в свой проект, используя этот vue-google-api https://www.npmjs.com/package/vue-google-api Я просто могу использовать пример кодаиз средства выбора Google, но я предпочитаю использовать vue-google-api для более короткого кода и дальнейшего использования для других API , поэтому после того, как я вошел в систему ( я успешно вошел в систему ), яхочу сделать кнопку, которая откроет модал сборщика, который позволит мне забрать файлы на Google Диске (скриншоты ниже), я использую это из Документации, это в моих методах компонентов для @click:

        loadPicker(){
            this.$gapi._libraryLoad('picker')
            .then(picker => {
                console.log('picker object :', picker.api); // Just log it out to see what's this, nothing weird

                var view = new google.picker.View(google.picker.ViewId.DOCS); // From Docs
                view.setMimeTypes("image/png,image/jpeg,image/jpg,application/vnd.google-apps.folder");

                var newPicker = new google.picker.PickerBuilder() // From Docs
                    .enableFeature(google.picker.Feature.NAV_HIDDEN)
                    .enableFeature(google.picker.Feature.MULTISELECT_ENABLED)
                    .setAppId("MY_PROJECT_ID")
                    .setOAuthToken(THIS_IS_WHAT_IM_MISSING_AKA_ACCESS_TOKEN)
                    .addView(view)
                    .addView(new google.picker.DocsUploadView())
                    .setDeveloperKey("MY_API_KEY")
                    .setCallback(this.pickerCallback)
                    .build();

                    newPicker.setVisible(true);
                    console.log('send help pls reponse!');

            });            
        },
        pickerCallback(data) {
            var fileId = data.docs[0].id;
            alert('The user selected: ' + fileId);
        }

и я включаю пакет следующим образом:

import VueGoogleApi from 'vue-google-api';

const config = {
  apiKey: 'MY_API_KEY',
  clientId: 'MY_CLIENT_ID',
  scope: 'https://www.googleapis.com/auth/drive.file',
  discoveryDocs: ['https://www.googleapis.com/discovery/v1/apis']
};

Vue.use(VueGoogleApi, config);

Мой снимок экрана для более подробной информации https://i.stack.imgur.com/SkLXh.png конечно, это происходит, я не вставил свой access_token, у меня естьответил прямо здесь: https://i.stack.imgur.com/oD0f6.png, но я не знаю, как получить его, используя vue-google-api , это Laravel - Vue, кстати, если это имеет какое-то значение. Мой код для входа, если это поможет:

var mixin = {
    methods:{
        //
        googleSignIn: () => {
            app.$gapi.signIn()
            .then(user => {
                alert('Signed in as ' + user.name);
                console.log('Signed in as '+ user.name);
            })
            .catch(err => {
                console.error('Not signed in: %s', err.error);
            })
        },
        googleSignOut: () => {
            // Google API 
            app.$gapi.signOut()
            .then(() => {
                alert('Signed out!');
                console.log('Signed out');
            });
        },
        checkGoogleSignIn: () => {
            app.$gapi.isSignedIn()
            .then(result => {
                app.$gapi.currentUser()
                .then(user => {
                    if (user) {
                        console.log('Signed in as '+ user.name);
                    } else {
                        console.log('No user is connected.');
                    }
                })
            });
        },
        //
    },
}

Спасибо за все ваши ответы

...