Я новичок в 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.');
}
})
});
},
//
},
}
Спасибо за все ваши ответы