I am currently developing a chrome extension that is designed to intercept specific downloads, like .doc and .docx files, and automatically upload them to a designated folder in Google Drive. Below is the manifest for this extension:
{
// Manifest details.
"manifest_version": 2,
"name": "Extension",
"description": "Application for SpartaHack 2016",
"version": "1.0",
"browser_action": {
"default_icon": "icon.png",
"default_popup": "popup.html"
},
// Content security policy for accessing gapi script.
"content_security_policy": "script-src 'self' https://apis.google.com; object-src 'self'",
// Necessary permissions for downloads and identity access.
// Additional permissions required for external file access.
"permissions": [
"downloads",
"identity",
"http://*/",
"https://*/"
],
// Authorization information.
"oauth2": {
"client_id": "id",
"scopes": [
"https://www.googleapis.com/auth/drive.file",
"https://www.googleapis.com/auth/userinfo.profile"
]
},
// Background scripts.
"background": {
"scripts": ["client.js", "eventPage.js"]
}
}
In addition to the manifest, I have implemented the following method for authorization when necessary:
chrome.identity.getAuthToken({
"interactive": true
}, sendAuthToken);
function sendAuthToken(token) {
var xhr = new XMLHttpRequest();
xhr.open('GET', 'https://www.googleapis.com/oauth2/v1/userinfo?alt=json&access_token=' + token, true);
xhr.onload = function() {
console.log(xhr.response);
}
//TODO:
xhr.send();
console.log(token);
watchDownloads();
}
This code snippet serves the purpose of obtaining user authorization and fetching their information using the provided token. The process works smoothly without any issues.
Below is the implementation of the watchDownloads() method:
function watchDownloads() {
chrome.downloads.onCreated.addListener(function(download) {
if(download.url.endsWith(".doc") || download.url.endsWith(".docx")) {
// Fetch blob from URL
var xhr = new XMLHttpRequest();
xhr.open("GET", download.url, true);
xhr.responseType = "blob";
xhr.onload = function(error) {
if(this.status == 200) {
insertFile(this.response, function(resp) {
console.log(resp);
});
}
};
xhr.send();
}
});
}
In summary, the watchDownloads() function is responsible for identifying the specified file extensions, retrieving the respective files through direct HTTP requests, and then uploading them to Google Drive using the insertFile() method which has been constructed based on various online references.
function insertFile(fileData, callback) {
const boundary = "-------314159265358979323846";
const delimiter = "\r\n--" + boundary + "\r\n";
const close_delimiter = "\r\n--" + boundary + "--";
//TODO: Remove
console.log(fileData);
var reader = new FileReader();
reader.readAsBinaryString(fileData);
reader.onload = function(error) {
var contentType = fileData.type || "application/octet-stream";
var metadata = {
// "title": fileData.filename,
"title": "Potato",
"mimeType": contentType
};
var base64Data = btoa(reader.result);
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_delimiter;
//TODO: Remove
console.log(multipartRequestBody);
var request = gapi.client.request({
"path": "/upload/drive/v3/files",
"method": "POST",
"params": {
"key": "key",
"uploadType": "multipart"
},
"headers": {
"Content-Type": 'multipart/mixed; boundary="' + boundary + '"'
},
"body": multipartRequestBody
});
//TODO: Remove
console.log(request);
if(!callback) {
callback = function(file) {
console.log(file)
};
}
request.execute(callback);
}
}
However, an error occurs at this stage and prevents the successful execution of the operation as depicted here https://i.sstatic.net/Rh0dj.png.
I am facing challenges in implementing the correct login procedure. Even after adding an Authorization property in the header, the issue persists. Any guidance on resolving this would be greatly appreciated.