New to Vue3 - What is after authentication?

[p10tyr]

It took me a few weeks to eventually work out how to get this to work. I am a Vue newbie.
Once I found this Super easy to integrate, log in works great! Thank you 💯💯💯💯

But, can somebody please help or explain how do I now use the DataAPI's?
The authentication documentation is excellent, maybe a little push on with an example?
Sorry I am a full newb with Vue3 and really struggling with all the previous versions of pakcages and blogs not really helping me.

What I have in mind is to query YopuTube API. Just get subscribers count. So the examples show using GAPI?
Do I need to install another package, is it included with this? Thank you in advance

gapi.client.youtube.channels.list({
       "part": [
         "statistics"
       ],
       "mine": true
     })

[philippedasilva-orizone]

Hi @ppumkin

Yes, you'll want to dive into the great gapi implementation universe. I've been through what you're going for as I learned to use gapi to retrieve gmail data.

I didn't spend time on it but you might found some existing packages that would do the trick for you: I imagine that requesting the Youtube API is pretty common requirement... Give it a try on npmjs.com using Youtube gapi and vue as search keywords, you may find what you're looking for.

Otherwise, you can implement your own gapi access but it'd require some more efforts. If you're there to acquire some knowledge on how things are done, you'll be fine ;)
If you get down that rabbit hole, I can share my approach:
Install vueuse/core npm package so you can use the useScript composable in your App.vue script section to install the gapi script on your application.
Make sure to initialize the gapi library (you should find plenty of tutorials for that) including setting up your project on the Google Developers Console for your own projet so you can get a clientId to use with your gapi calls.
Once the user gets authenticated, you'll want to ask his/her consent to use the Youtube API and this is done through setting the access_token in gapi.client
You can retrieve the user consent through the use of vue3-google-signin useTokenClient composable (https://vue3-google-signin.syetalabs.io/composables/use-token-client.html)
You'll need to setup a page that will get called by google once the user consent is done so you can retrieve the access_token value
Once this is all done, then you should be able to call Youtube API methods using gapi.

It took me somewhat 5 days to set it up properly (approximately 2 hours per day for a total of 10 hours) but depending on your skillset and knowledge, it may take you less time ;)

GL & HF ;)

[p10tyr]

Hello @philippedasilva-orizone
Thank you for the generous reply. It all makes sense now I understand. I can see from the example code the token gets logged into the console. So I can really use that token now even in the back end server to make requests... but I guess its pretty easy to include the GAPI script.. main issue is that I am new to VUE and dont understand the eco system that well.

Thanks again
💯 💯💯 💯 💯 💯 💯 💯 💯 💯 💯 💯