Create File with Google Drive Api v3 (javascript) - javascript

I want to create a file with content using Google Drive API v3. I have authenticated via OAuth and have the Drive API loaded. Statements like the following work (but produce a file without content):
gapi.client.drive.files.create({
"name": "settings",
}).execute();
Unfortunately I cannot figure out how to create a file that has a content. I cannot find a JavaScript example using Drive API v3. Are there some special parameters that I need to pass?
For simplicity, assume that I have a String like '{"name":"test"}' that is in JSON format that should be the content of the created file.

Unfortunately, I have not found an answer using only the google drive api, instead I followed Gerardo's comment and used the google request api. Below is a function that uploads a file to google drive.
var createFileWithJSONContent = function(name,data,callback) {
const boundary = '-------314159265358979323846';
const delimiter = "\r\n--" + boundary + "\r\n";
const close_delim = "\r\n--" + boundary + "--";
const contentType = 'application/json';
var metadata = {
'name': name,
'mimeType': contentType
};
var multipartRequestBody =
delimiter +
'Content-Type: application/json\r\n\r\n' +
JSON.stringify(metadata) +
delimiter +
'Content-Type: ' + contentType + '\r\n\r\n' +
data +
close_delim;
var request = gapi.client.request({
'path': '/upload/drive/v3/files',
'method': 'POST',
'params': {'uploadType': 'multipart'},
'headers': {
'Content-Type': 'multipart/related; boundary="' + boundary + '"'
},
'body': multipartRequestBody});
if (!callback) {
callback = function(file) {
console.log(file)
};
}
request.execute(callback);
}

here is the solution with gapi.client.drive,
var parentId = '';//some parentId of a folder under which to create the new folder
var fileMetadata = {
'name' : 'New Folder',
'mimeType' : 'application/vnd.google-apps.folder',
'parents': [parentId]
};
gapi.client.drive.files.create({
resource: fileMetadata,
}).then(function(response) {
switch(response.status){
case 200:
var file = response.result;
console.log('Created Folder Id: ', file.id);
break;
default:
console.log('Error creating the folder, '+response);
break;
}
});
you'll need to connect/authorise with either of the following scopes
https://www.googleapis.com/auth/drive
https://www.googleapis.com/auth/drive.file
EDIT: it is possible to create google files (doc, sheets and so on) by changing the mimeType from application/vnd.google-apps.folder to one of the supported google mime types. HOWEVER, as of now it not possible to upload any content into created files.
To upload files, use the solution provided by #Geminus. Note you can upload a text file or a csv file and set its content type to google doc or google sheets respectively, and google will attempt to convert it. I have tested this for text -> doc and it works.

Using gapi.client.drive, it is not possible to upload file content. You can only upload metadata.
Instead it is recommended to work directly with the Google REST API. This solution uses a FormData object to build the multipart form body, which simplifies the implementation, and gapi.auth.getToken() to retrieve the required access token. The solution also works with Google shared drives:
var fileContent = "sample text"; // fileContent can be text, or an Uint8Array, etc.
var file = new Blob([fileContent], {type: "text/plain"});
var metadata = {
"name": "yourFilename",
"mimeType": "text/plain",
"parents": ["folder id or 'root'"], // Google Drive folder id
};
var accessToken = gapi.auth.getToken().access_token;
var form = new FormData();
form.append('metadata', new Blob([JSON.stringify(metadata)], { type: 'application/json' }));
form.append('file', file);
fetch("https://www.googleapis.com/upload/drive/v3/files?uploadType=multipart&supportsAllDrives=true", {
method: 'POST',
headers: new Headers({ 'Authorization': 'Bearer ' + accessToken }),
body: form,
}).then((res) => {
return res.json();
}).then(function(val) {
console.log(val);
});

this works fine usin v3:
var fileMetadata = {
'name' : 'MaxBarrass',
'mimeType' : 'application/vnd.google-apps.folder'
};
gapi.client.drive.files.create({
resource: fileMetadata,
fields: 'id'
}).execute(function(resp, raw_resp) {
console.log('Folder Id: ', resp.id);
});

/* Now to create a new file */
function insertNewFile(folderId)
{
var content = " ";
var FolderId = "";
var contentArray = new Array(content.length);
for (var i = 0; i < contentArray.length; i++)
{
contentArray[i] = content.charCodeAt(i);
}
var byteArray = new Uint8Array(contentArray);
var blob = new Blob([byteArray], {type: 'text/plain'});
insertFile(blob, fileInserted, folderId);
}
function fileInserted(d)
{
setPercent("100");
var FI = FolderId;
if(FI !== myRootFolderId)
{
insertFileIntoFolder(FI, d.id);
removeFileFromFolder(d.parents[0].id,d.id);
}
openFile(d.id);
}
function insertFileIntoFolder(folderId, fileId)
{
var body = {'id': folderId};
var request = gapi.client.drive.parents.insert({
'fileId': fileId,
'resource': body });
request.execute(function(resp) { });
}
Source: https://gist.github.com/mkaminsky11/8624150

Related

Rename video with Vimeo API

I'm looking to rename my videos with the Vimeo Api and Google Apps Script. I succesfully have the API moving videos into folders (using pretty much identical syntax to below) but can't for the life of me get the renaming working. It's extremely frustrating.
Here is the reference and below is my code - it just returns the video info as if I'm not trying to change anything, even though I'm clearly using a 'PATCH' call, not a 'GET'.
Where am I meant to put the 'name' parameter??
function renameVideo(){
var newName = 'thisismynewname';
var url = 'https://api.vimeo.com/videos/_________?name=' + newName;
var options = {
'method': 'PATCH',
'muteHttpExceptions': true,
'contentType': 'application/json',
'headers': {
'Accept':'application/vnd.vimeo.*+json;version=3.4',
'Authorization': "Bearer " + token,
},
//Note that I've also tried 'name' : 'thisismynewname' here too
};
var response = UrlFetchApp.fetch(url, options);
Logger.log(JSON.parse(response).name); //it just returns the *current* name not the new one, and doesn't change it
}
When I saw the official document of Edit a video, it seems that name is included in the request body. So how about this modification?
Modified script:
function renameVideo(){
var newName = 'thisismynewname';
var url = 'https://api.vimeo.com/videos/_________'; // Modified
var options = {
'method': 'PATCH',
'muteHttpExceptions': true,
'contentType': 'application/json',
'headers': {
'Accept':'application/vnd.vimeo.*+json;version=3.4',
'Authorization': "Bearer " + token,
},
'payload': JSON.stringify({name: newName}) // Added
};
var response = UrlFetchApp.fetch(url, options);
Logger.log(JSON.parse(response).name);
}
The content type is application/json.
Reference:
Edit a video

Sending files from client (angular) to server Asp.net wed api, request always has empty prorerty "files"

everyone, have a trouble with sending files
I have angularjs client:
var fd = new FormData();
var myEl = angular.element( document.querySelector( '#someId' ) );
fd.append('file', myEl[0].files[0]);
fd.append('test', 'value');
var vv = $resource('api/:domen/:url', { url: "", domen: 'Options' }, {
'saveF': {
headers: {
'Authorization': 'Bearer ' + currentUser.getProfile().token,
'Content-Type': false
},
method: 'POST'
}
});
vv.saveF({ url: "UploadData", domen: 'Info' }, fd, function (el) {
console.log(el);
});
The client code send fields, I can check it via Fiddler, the file is in body
and backend code on ASP.NET Web Api:
public async Task<IHttpActionResult> UploadData()
{
// var a = HttpContext.Current.Request;
// var f = a.Files.Get(0);
if (!Request.Content.IsMimeMultipartContent())
throw new HttpResponseException(HttpStatusCode.UnsupportedMediaType);
var provider = new MultipartMemoryStreamProvider();
await Request.Content.ReadAsMultipartAsync(provider);
foreach (var file in provider.Contents)
{
var filename = file.Headers.ContentDisposition.FileName.Trim('\"');
var buffer = await file.ReadAsByteArrayAsync();
and so on
The request always fails, because of "Request.Content.IsMimeMultipartContent()" or var f = a.Files.Get(0);
and I cannot get the file, server never see a content in request, but can see content-length
Already try to white content type 'multipart/form-data' but id didn`t help
Please, if somebody knows how to fix it - answer
See back-end implementation of Web API 2: https://www.asp.net/web-api/overview/advanced/sending-html-form-data-part-2
Also, you can use ng-file-upload for AngularJS
And example: https://github.com/stewartm83/angular-fileupload-sample
If you upload unknown MIME type and host your application on IIS,
it would be good add MIME type to IIS.

Using Facebook's Mobile Hosting API with Parse Cloud Code for App Links

I am having trouble getting App Links working with Parse.
Since my App is mobile only i wanted to use Facebook's Mobile Hosting API.
And since you need to send your Facebook App Secret with the request i wanted to do it with Parse Cloud Code.
All i coud find on the Facebook documentation was how to do it with cURL:
curl https://graph.facebook.com/app/app_link_hosts \
-F access_token="APP_ACCESS_TOKEN" \
-F name="iOS App Link Object Example" \
-F ios=' [
{
"url" : "sharesample://story/1234",
"app_store_id" : 12345,
"app_name" : "ShareSample",
}, ]' \
-F web=' {
"should_fallback" : false, }'
so this is what i came up with in cloud code
Parse.Cloud.httpRequest({
method: 'POST',
url: 'https://graph.facebook.com/app/app_link_hosts',
headers: {
'Content-Type': 'multipart/form-data'
},
body: {
access_token : "APP_ACCESS_TOKEN",
name : "iOS App Link Object Example",
ios : '[{"url" : "sharesample://story/1234","app_store_id" : 12345,"app_name" : "ShareSample",},]',
web : '{"should_fallback" : false,}'
}
the response i get is: Request failed with response code 400
now i just read that multipart/form-data is not supported withParse.Cloud.httpRequest
so is there another way to do this?
update: just found out that you can send multipart data with a Buffer,
so this is my code now
var Buffer = require('buffer').Buffer;
var access_token = new Buffer('APP_ACCESS_TOKEN','utf8');
var name = new Buffer('iOS App Link Object Example','utf8');
var ios = new Buffer('[{"url" : "sharesample://story/1234","app_store_id" : 12345,"app_name" : "ShareSample",},]','utf8');
var web = new Buffer('{"should_fallback" : false,}','utf8');
var contentBuffer = Buffer.concat([access_token, name, ios, web]);
Parse.Cloud.httpRequest({
url: 'https://graph.facebook.com/app/app_link_hosts',
method: 'POST',
headers: {
'Content-Type': 'text/html; charset=utf-8'
},
body: contentBuffer
}
however i am still getting the same result :(
update2: got it working with content type application/x-www-form-urlencoded and normal body. But i think the error was somewhere in my parameters since i tested it with curl and got the same response
It took me a few hours, but I finally got it working:
// Returns the canonical url, like https://fb.me/....
Parse.Cloud.define("createAppLink", function(request, response) {
// see https://developers.facebook.com/docs/graph-api/reference/v2.5/app/app_link_hosts
var storyId = request.params.storyId + ''; // param identifying a single "post"
var appId = 'APP_ID';
var appSec = 'APP_SECRET';
var appToken = appId + '|' + appSec; // your app token
Parse.Cloud.httpRequest({
url: 'https://graph.facebook.com/app/app_link_hosts',
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({ // you need to stringify it
access_token: appToken,
name: 'LINK TO ' + storyId, // it is needed but not public
android: [{
url: 'app://story/' + storyId, // deep link url
package: 'com.package', // your package name
app_name: 'APP' // your app name
}],
web: { should_fallback: 'false' }
})
}).then(function(httpResponse) {
// We get an id, by which we can fetch
// the canonical url with a get request
var data = JSON.parse(httpResponse.text);
var id = data.id;
return Parse.Cloud.httpRequest({
url: 'https://graph.facebook.com/' + id,
method: 'GET',
headers: {
'Content-Type': 'application/json'
},
params: {
access_token: appToken,
fields: 'canonical_url',
pretty: 'true'
}
});
}).then(function(httpResponse) {
var data = JSON.parse(httpResponse.text);
var canonicalUrl = data.canonical_url;
response.success(canonicalUrl);
}, function(error) {
response.error(error);
})
});

Add ListItem to List Folder using Rest-Api

I have a problem with adding a ListItem in a specified Folder while using SharePoint 2013 REST api.
With the Client Object Model it would look like this:
var creationInfo = new SP.ListItemCreationInformation();
creationInfo.FolderUrl = "/Lists/MyList/MyFolder";
var item = list.addItem(creationInfo );
item.update();
ctx.executeQueryAsync(
Function.createDelegate(this, onSuccess),
Function.createDelegate(this, onFail));
But when i'm trying to set the FolderUrl via the Rest Service
{ '__metadata' : { 'type': 'SP.Data.MyListListItem' }, 'Title': 'NewItemInFolder', 'FolderUrl': '/sites/example/Lists/MyList/MyFolder' }
I got an 400 Bad Request
I have also tried to first add a ListItem to the List and then update the FolderUrl but this also didn't work.
How can I add ListItem's to a List Folder in SharePoint using the Rest-Api ?
Edit:
{ '__metadata' : {
'type': 'SP.Data.MyListListItem',
'type': 'SP.Data.ListItemCreationInformation'
},
'Title': 'NewItemInFolder',
'FolderUrl': '/sites/example/Lists/MyList/MyFolder'
}
I have now tried to use both ListItemEntityTypeFullName the Entity from my List and the ListItemCreationInformation but I also only get a 400 Bad Request.
And when i'm looking into the request with Fiddler I see that SharePoint is ignoring now my List Entity Type SP.Data.MyListItem
You should not use the REST api but instead use the listdata.svc
url: /_vti_bin/listdata.svc/[Name of List]
Header:Content-Type: application/json;odata=verbose
Body: {Title: "Title", Path: "/ServerRelativeUrl"}
I had the same problem but with REST api it won't work with the old svc it will.
You could consider the following solution, it consists of 3 steps listed below:
create a ListItem resource
get associated File resource and finally move it into folder
Example
function executeJson(options)
{
var headers = options.headers || {};
var method = options.method || "GET";
headers["Accept"] = "application/json;odata=verbose";
if(options.method == "POST") {
headers["X-RequestDigest"] = $("#__REQUESTDIGEST").val();
}
var ajaxOptions =
{
url: options.url,
type: method,
contentType: "application/json;odata=verbose",
headers: headers
};
if("payload" in options) {
ajaxOptions.data = JSON.stringify(options.payload);
}
return $.ajax(ajaxOptions);
}
function createListItem(webUrl,listTitle,properties,folderUrl){
var url = webUrl + "/_api/web/lists/getbytitle('" + listTitle + "')/items";
return executeJson({
"url" :url,
"method": 'POST',
"payload": properties})
.then(function(result){
var url = result.d.__metadata.uri + "?$select=FileDirRef,FileRef";
return executeJson({url : url});
})
.then(function(result){
var fileUrl = result.d.FileRef;
var fileDirRef = result.d.FileDirRef;
var moveFileUrl = fileUrl.replace(fileDirRef,folderUrl);
var url = webUrl + "/_api/web/getfilebyserverrelativeurl('" + fileUrl + "')/moveto(newurl='" + moveFileUrl + "',flags=1)";
console.log(url);
return executeJson({
"url" :url,
"method": 'POST',
});
});
}
Usage
var webUrl = _spPageContextInfo.webAbsoluteUrl;
var listTitle = "Requests"; //list title
var targetFolderUrl = "/Lists/Requests/Archive"; //folder server relative url
var itemProperties = {
'__metadata': { "type": "SP.Data.RequestsListItem" },
"Title": 'Request 123'
};
createListItem(webUrl,listTitle,itemProperties,targetFolderUrl)
.done(function(item)
{
console.log('List item has been created');
})
.fail(function(error){
console.log(JSON.stringify(error));
});
Gist
Microsoft.SharePoint.Client.ClientContext clientContext = new Microsoft.SharePoint.Client.ClientContext("URL");
Microsoft.SharePoint.Client.List list = clientContext.Web.Lists.GetByTitle("FolderName");
var folder = list.RootFolder;
clientContext.Load(folder);
clientContext.Credentials = new NetworkCredential(username, password, domain);
clientContext.ExecuteQuery();
folder = folder.Folders.Add("ItemName");
clientContext.Credentials = new NetworkCredential(username, password, domain);
clientContext.ExecuteQuery();
creationInfo.set_folderUrl("http://siteURL/Lists/Docs/Folder1");

How to create a folder on Google Drive using javascript

Right now I'm using this code to upload files to Google Drive:
https://stackoverflow.com/a/11657773/1715263
It works fine with a textfile.
With the same code I'm trying to create a folder, using this information from Google:
https://developers.google.com/drive/folder
so Google says "Content-Type: application/json" goes into the header and "application/vnd.google-apps.folder" should be the mimetype in the body(?), thats what I'm doing in my code, which looks like this now:
function createFolder()
{
var access_token = googleAuth.getAccessToken();
var json = JSON.stringify({
mimeType: 'application/vnd.google-apps.folder',
title: 'Folder',
});
var body = "Content-Type: application/json" + "\r\n" +
"Content-Length: " + json.length + "\r\n" + "\r\n" +
json;
gapi.client.request({
'path': '/upload/drive/v2/files/',
'method': 'POST',
'params': {'uploadType': 'multipart'},
'headers': {
'Content-Type': 'application/json',
'Authorization': 'Bearer ' + access_token,
},
'body': body
}).execute(function(file) {
document.getElementById("info").innerHTML = "Created folder: " + file;
});
But it's only creating a file named "Untitled", it's no folder and you can't open it.
When I change the "Content-Type" in the "headers" section to "application/vnd.google-apps.folder" and remove the "body" part, it's creating a folder named "Untitled".
How can I get it to create a folder with a specific title?
Finally got it working by googling Claudios code which led me to this piece of code: https://stackoverflow.com/a/11361392/1715263
The important thing that changed is the 'path', its now "/drive/v2/files/" instead of "/upload/drive/v2/files/".
I just removed the 'gapi.client.load'-function, added headers information and changed the bodys mimeType.
So here's the code:
function createFolder() {
var access_token = googleAuth.getAccessToken();
var request = gapi.client.request({
'path': '/drive/v2/files/',
'method': 'POST',
'headers': {
'Content-Type': 'application/json',
'Authorization': 'Bearer ' + access_token,
},
'body':{
"title" : "Folder",
"mimeType" : "application/vnd.google-apps.folder",
}
});
request.execute(function(resp) {
console.log(resp);
document.getElementById("info").innerHTML = "Created folder: " + resp.title;
});
}
Try the following code:
function createFolder(folderName) {
var body = {
'title': folderName,
'mimeType': "application/vnd.google-apps.folder"
};
var request = gapi.client.drive.files.insert({
'resource': body
});
request.execute(function(resp) {
console.log('Folder ID: ' + resp.id);
});
}

Categories

Resources