How to implement Google Drive in an ionic application

Question

I need to connect my ionic application to Google Drive, show all the files and, possibly, download, download, delete, edit. So I will try this https://github.com/Raza-Dar/ionic-google-drive2

errors: Failed to load the resource: the server responded with a status of 404 (not found) https://apis.google.com//scs/apps-static//JS/ = oz.gapi.en.RArmLpCIYB0.O / m .. .1 / Ed. = 1 / i = QQ / Rs = AGLTcCOEiG2RgKkKDvOG7y5PZ-fMFMsJXQ / t = zcms / centibar = gapi.loaded_01

Uncaught TypeError: cannot call the 'load' method from undefined

Could not find InAppBrowser plugin

and this http://blog.ionic.io/oauth-ionic-ngcordova/1 there are no errors on the console ... but after authentication return to the main page

and this is http://excellencenodejsblog.com/cordova-ionic-google-oauth-login-for-your-mobile-app/ with this I get user information, but not a file on disk

any suggestion? Please, I need a sample start code. Thank you.

Answer 1

Have you created the project for your application in the Google Developer Console? Is the Google Drive API enabled? Setting credentials and authentication to work with your application? Well, using any Google Api endpoint, you will go through two steps:

• Register the user with your api key and the required areas , if you succeed, you will get access_token to be able to use the API for an hour : in your case, prefer to use $ cordovaOauth.google (YOUR_API_KEY, YOUR_SCOPES), the scope is an array of permissions such as [' https://www.googleapis.com/auth/drive '], which in this case means that “APPName requires you to manage (crud) your files”

• Make a request using the access token and your api key , for example, to create a folder:

  $http.post( 'https://www.googleapis.com/drive/v2/files&access_token='+ACCESS_TOKEN, { title:"FolderName", mimeType: "application/vnd.google-apps.folder", // special mimeType for google drive folders key: YOUR_API_KEY } ).success(function (data) { console.log(data.id); // id of the created folder console.log(data.alternateLink); // Web link to created folder }).catch(function(err){ console.log(err); }) 

  The url used is https://www.googleapis.com/drive/v2/files , designed for metadata requests, for downloading you prefer https://www.googleapis.com/ to upload / drive / v2 / files, for more documentation there https://developers.google.com/drive/v3/reference/files#resource-representations

Do not forget that ngCordova functions only work on the device or emulator, and not in the browser / navigator.

Answer 2

You need to authenticate your cordova app with Google in order to use the API. First, follow the official Google guidelines for each platform (iOS and Android), if you haven’t already, to create the necessary credentials for your application. Then try the plugin from the link below:

Google Plugin for Google Cordoba Plugin

I created this plugin for a personal mobile project. This plugin supports upload, download and file list.

To get a list of files created / uploaded by your Android application, you can try this on the Java side:

 private void fileList() { Query query = new Query.Builder().addFilter(Filters.and( Filters.eq(SearchableField.MIME_TYPE, "application/octet-stream"), Filters.eq(SearchableField.TRASHED, false))).build(); Drive.DriveApi.query(mGoogleApiClient, query) .setResultCallback(new ResultCallback<DriveApi.MetadataBufferResult>() { @Override public void onResult(DriveApi.MetadataBufferResult result) { if (!result.getStatus().isSuccess()) { mCallbackContext.sendPluginResult(new PluginResult(PluginResult.Status.ERROR,"failed to retrieve file list")); return; } MetadataBuffer flist = result.getMetadataBuffer(); Log.i(TAG,flist.get(0).getClass().getName()); JSONArray response = new JSONArray(); for (Metadata file: flist ) { try { response.put(new JSONObject().put("name", file.getTitle()).put("created", file.getCreatedDate().toString()).put("id", file.getDriveId().toString())); }catch (JSONException ex){ex.getMessage();} } JSONObject flistJSON = new JSONObject(); try{ flistJSON.put("flist", response); } catch (JSONException ex){} mCallbackContext.sendPluginResult(new PluginResult(PluginResult.Status.OK,flistJSON)); flist.release(); //Log.i(TAG,flist.toString()); } }); }