I think the whole Google OAuth and API setup is a bit daunting for some (it was for me!), so I thought I would go through the steps of setting up the API and OAuth credentials, and then using them in Wappler to log a user into their Google account and then get their photo albums. I’ll both list the albums with their images, and also show you how to create a slideshow from each album. I’m not very experienced at creating tutorials so forgive me if something isn’t clear enough. Feel free to ask questions if something doesn’t make sense. Ok, here we go…
First thing you need to do is setup a new project at https://console.developers.google.com/ . I assume you already have a google login.
-
Select the dropdown
-
This screen will come up. Select New Project
-
Enter your project name (whatever you want) and select your organization, there’s probably only one choice, and the location, again, probably only one choice. Click Create
-
When the project is created you’ll be taken back to the Dashboard. Make sure the project you just created is selected
-
Now click on APIs & Services and then Credentials
-
Click on Create Credentials and then API key
-
Your API Key is now created. Click on Restrict Key
-
Fill in the form as noted and Save
-
Now click on Library
-
Search for Photos Library API and click on it
-
Click Enable
-
Click on Create Credentials
-
Select the Photos API, Web Browser and User Data then click What Credentials do I need
-
Click Setup consent screen
-
Fill in the form as noted and then Save
-
Click on Credentials
-
Click on Create Credentials and then OAuth client ID
-
Select Web application and then fill in your website url in the Authorized JavaScript origins. In the Authorized redirect URI’s you need to have the server connect file that we will create in Part 2. You can leave this blank and come back and put this in later if you need to. Click Create.
-
Voila! You now have an API key, and OAuth Client ID and Client Secret
-
Stay Tuned for Part Two where we we create the Google Login on Wappler and Part Three where we get the users Photo Albums, list images in each album, and create a slideshow for each album.
