Easy Steps to Synchronize Google Drive with JS 2 File Manager

The File Manager is a component similar to Windows File Explorer that allows users to efficiently manage, browse, download, and upload files.

In order to access the files from the Google Drive, we need the Google Drive file provider, which is an interface between the Google Drive and our File Manager. This helps in managing the files in the Google Drive Storage.

git clone https://github.com/SyncfusionExamples/ej2-google-drive-aspcore-file-provider ej2-google-drive-aspcore-file-provider

cd ej2-google-drive-aspcore-file-provider

3. Provide a name for the project and tap CREATE.

4. The created project will show in the notifications. Select VIEW to open it.

5. On the left page, select APIs & Services -> Library,

Look for the Google Drive API and select it. Then, select Enable.

6. Select API & Services-> OAuth consent screen, provide the application name, and click Save.

7. Now, in the left pane, select Credentials, click CREATE CREDENTIALS, and select OAuth client ID.

Choose Web application as the application type, give it a name, and click CREATE.

OAuth Client will be created and the Client ID and client secret will be displayed. Click OK.

8. Now the OAuth Client IDs will be listed. Select Download and save it.

After generating the client secret data, copy the JSON data to the following specified JSON files in the cloned project location.

Once cloned, open the solution file in Visual Studio. Build the project and run it after restoring the NuGet packages.

To perform the basic file actions of read, delete, copy, move, rename, and search, and to retrieve the details of files from the Google Drive service, start mapping the following service URLs to the ajaxSettings property of File Manager.

Here, the hostUrl will be your locally hosted port number.

To perform a download operation, initialize the downloadUrl property in the ajaxSettings of the File Manager component.

To perform upload operation, initialize the uploadUrl property in the ajaxSettings of the File Manager component.

To perform image preview, initialize the getImageUrl property in the ajaxSettings of the File Manager component.

Related posts:

When social media gauge your happiness vane

When I read about business leadership, rarely do I find a nugget of wisdom so concise and relevant to work as well as the rest of life, as “disagree and commit”. Jeff Bezos, founder and CEO of…

The potentiality of computers pursues to improve rapid pace with novel and existing technologies and concepts. By combining existing technologies with novel concepts can provide innovations. Computer…