Created
January 13, 2013 16:56
-
-
Save csusbdt/4525042 to your computer and use it in GitHub Desktop.
How to store JSON data into the user's Google drive storage.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <html> | |
| <head> | |
| <!-- | |
| In this example, I started with the 5-minute example provided by Google | |
| on the following page: | |
| https://developers.google.com/drive/ | |
| I modified the example code, so that I could write the following | |
| Javascript object as a json string into a file called | |
| csusbdt-drive-example-app-state.txt. | |
| var appState = { | |
| number: 12, | |
| text: 'hello' | |
| }; | |
| --> | |
| <meta http-equiv="Content-type" content="text/html;charset=UTF-8"> | |
| <script type="text/javascript"> | |
| var CLIENT_ID = '427813993638.apps.googleusercontent.com'; | |
| var SCOPES = 'https://www.googleapis.com/auth/drive'; | |
| /** | |
| * Called when the client library is loaded to start the auth flow. | |
| */ | |
| function handleClientLoad() { | |
| window.setTimeout(checkAuth, 1); | |
| } | |
| /** | |
| * Check if the current user has authorized the application. | |
| */ | |
| function checkAuth() { | |
| gapi.auth.authorize( | |
| {'client_id': CLIENT_ID, 'scope': SCOPES, 'immediate': true}, | |
| handleAuthResult); | |
| } | |
| /** | |
| * Called when authorization server replies. | |
| * | |
| * @param {Object} authResult Authorization result. | |
| */ | |
| function handleAuthResult(authResult) { | |
| var authButton = document.getElementById('authorizeButton'); | |
| var doitButton = document.getElementById('doitButton'); | |
| authButton.style.display = 'none'; | |
| doitButton.style.display = 'none'; | |
| if (authResult && !authResult.error) { | |
| // Access token has been successfully retrieved, requests can be sent to the API. | |
| doitButton.style.display = 'block'; | |
| doitButton.onclick = uploadFile; | |
| } else { | |
| // No access token could be retrieved, show the button to start the authorization flow. | |
| authButton.style.display = 'block'; | |
| authButton.onclick = function() { | |
| gapi.auth.authorize( | |
| {'client_id': CLIENT_ID, 'scope': SCOPES, 'immediate': false}, | |
| handleAuthResult); | |
| }; | |
| } | |
| } | |
| /** | |
| * Start the file upload. | |
| * | |
| * @param {Object} evt Arguments from the file selector. | |
| */ | |
| function uploadFile(evt) { | |
| gapi.client.load('drive', 'v2', function() { | |
| insertFile(); | |
| }); | |
| } | |
| /** | |
| * Insert new file. | |
| */ | |
| function insertFile() { | |
| const boundary = '-------314159265358979323846264'; | |
| const delimiter = "\r\n--" + boundary + "\r\n"; | |
| const close_delim = "\r\n--" + boundary + "--"; | |
| var appState = { | |
| number: 12, | |
| text: 'hello' | |
| }; | |
| var fileName = 'csusbdt-drive-example-app-state.txt'; | |
| var contentType = 'application/json'; | |
| var metadata = { | |
| 'title': fileName, | |
| 'mimeType': contentType | |
| }; | |
| var base64Data = btoa(JSON.stringify(appState)); | |
| var multipartRequestBody = | |
| delimiter + | |
| 'Content-Type: application/json\r\n\r\n' + | |
| JSON.stringify(metadata) + | |
| delimiter + | |
| 'Content-Type: ' + contentType + '\r\n' + | |
| 'Content-Transfer-Encoding: base64\r\n' + | |
| '\r\n' + | |
| base64Data + | |
| close_delim; | |
| var request = gapi.client.request({ | |
| 'path': '/upload/drive/v2/files', | |
| 'method': 'POST', | |
| 'params': {'uploadType': 'multipart'}, | |
| 'headers': { | |
| 'Content-Type': 'multipart/mixed; boundary="' + boundary + '"' | |
| }, | |
| 'body': multipartRequestBody}); | |
| request.execute(function(arg) { | |
| console.log(arg); | |
| }); | |
| } | |
| </script> | |
| <script type="text/javascript" src="https://apis.google.com/js/client.js?onload=handleClientLoad"></script> | |
| </head> | |
| <body> | |
| <input type="button" id="doitButton" style="display: none" value="Do it" onclick="alert('hiiii')" /> <br> | |
| <input type="button" id="authorizeButton" style="display: none" value="Authorize" /> | |
| </body> | |
| </html> | |
To retrieve saved data you may use example from https://developers.google.com/drive/v2/reference/files/get
"file" passed to "downloadFile" is what you receive in "request.execute()". But, of course, you need to save somewhere the saved file ID.
Hello please , everything is ok , I can found the uploaded files into the uploader drive , but I can't found data centralized into one drive ? .
i am unable to upload file please give me code to store in google drive using java or java script
I am trying to do the "wallpaperboard" app using Google Drive, that shouldn't need any extra config though should it?
The insertFile() worked perfectly to me.
I wonder how to send images either png or jpg.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Thank you for this! I was able to get my JSON data to save to my Google drive, but when I open it in Drive Notepad, it looks like trash data. How do I pull it back down into JSON data?