Connect to Google Drive using Angular, REST services, OAuth and Radzen

This blog post demonstrates how to create an Angular app with Radzen that will access Google Drive using OAuth authorization!

  1. Create new OAuth credentials in Google Console for Web Application: google-console1.png google-console2.png google-console3.png
  2. Create REST data-source with OAuth authorization in Radzen with following settings:
    • End point: https://www.googleapis.com/drive/v3
    • ClientID: Your ClientID from step 1.
    • Authorization Url: https://accounts.google.com/o/oauth2/auth
    • Scope: https://www.googleapis.com/auth/drive google-drive1.png google-drive2.png google-drive3.png
  3. Create new page, call getFiles() method on Page Load event and assign ${result.files} to files variable. google-drive4.png
  4. Drag and drop DataGrid component from Radzen toolbox, bind it to files and add desired columns. google-drive5.png
  5. Run the application, login using your Google credentials and browse your Drive files and folders. google-drive6.png google-drive7.png

Enjoy!

Leverage Radzen on LinkedIn

Yes, we are on LinkedIn and you should follow us!

Now, you have the opportunity to showcase your expertise by adding Radzen Blazor Studio and Radzen Blazor Components as skills to your LinkedIn profile. Present your skills to employers, collaborators, and clients.

All you have to do is go to our Products page on LinkedIn and click the + Add as skill button.

by Vladimir Enchev

Master pages with Angular 5 for fun and profit

Checkout Radzen Demos and download latest Radzen!
Read more