javascript 用户通过javascript将文件上传到谷歌驱动器？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/32272188/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
User uploaded file to google drive via javascript?
提问by Jacob Guthrie
I have a web app that I would like the user to be able to add a file from their computer and upload it to my google drive. I have the choose file button working but I'm not sure as to how the function should look to access my google drive account and send the file upon a button click.
我有一个网络应用程序，我希望用户能够从他们的计算机添加文件并将其上传到我的谷歌驱动器。我有选择文件按钮工作，但我不确定该功能应该如何访问我的谷歌驱动器帐户并在单击按钮时发送文件。
<h4>Upload a file:</h4>
<div class="form-group">
<input type="file" id="fileInput" name="fileInput"/>
</div><br>
I put this inside a infowindow and I'm able to search for and select a file from the user's computer. I really just looking for the JS function to send it to my google drive. Any help would be appreciated.
我把它放在一个信息窗口中，我可以从用户的计算机中搜索和选择一个文件。我真的只是在寻找将它发送到我的谷歌驱动器的 JS 函数。任何帮助，将不胜感激。
回答by Klokan Technologies
We had the same problem - and therefore developed a web service for anonymous uploading into the website owner's Google Drive.
我们遇到了同样的问题 - 因此开发了一个网络服务，用于匿名上传到网站所有者的 Google Drive。
See https://driveuploader.com/
You can easily create a reliable upload component, which can be embedded in any website with an iframe code, similarly like YouTube - or used as a part of other applications with a basic JavaScript APIwith webhooks.
您可以轻松创建一个可靠的上传组件，该组件可以使用 iframe 代码嵌入到任何网站中，与 YouTube 类似，或者作为其他应用程序的一部分使用带有 webhook的基本JavaScript API。
After you create the uploader - embedding is done with the code like:
创建上传器后 - 使用如下代码嵌入：
<iframe src="https://driveuploader.com/upload/{uploader key}/embed/"></iframe>
It runs in all latest web browsers - and supports unlimited file size uploads (tested on files with hundreds of gigabytes, yes GIGABYTES).
它在所有最新的网络浏览器中运行 - 并支持无限文件大小上传（在数百 GB 的文件上进行测试，是 GIGABYTES）。
Because the component is responsive - it is perfect also for Wordpress or Google Sites websites.
因为该组件是响应式的 - 它也非常适合 Wordpress 或 Google Sites 网站。
If you need only a basic page where your friends, students, colleagues can securely drop into your Google Drive some (possibly large) files, then this is offered too - and completely for free.
如果您只需要一个基本页面，您的朋友、学生、同事可以在其中安全地将一些（可能很大）文件放入您的 Google 云端硬盘，那么这也可以提供 - 并且完全免费。
Disclaimer: we are developers of this service.
免责声明：我们是此服务的开发者。
回答by rmn36
You can find all the information you need and then some in Google's API reference but I've copied the important stuff for upload below. However, you will definitely need to look at their information regarding authentication which can be found at this link: https://developers.google.com/api-client-library/javascript/start/start-js. I have also included their authentication example below.
您可以在 Google 的 API 参考中找到您需要的所有信息，然后找到一些信息，但我已经复制了下面要上传的重要内容。但是，您肯定需要查看他们有关身份验证的信息，这些信息可以在此链接中找到：https: //developers.google.com/api-client-library/javascript/start/start-js。我还在下面包含了他们的身份验证示例。
<!--Add a button for the user to click to initiate auth sequence -->
<button id="authorize-button" style="visibility: hidden">Authorize</button>
<script type="text/javascript">
var clientId = '837050751313';
var apiKey = 'AIzaSyAdjHPT5Pb7Nu56WJ_nlrMGOAgUAtKjiPM';
var scopes = 'https://www.googleapis.com/auth/plus.me';
function handleClientLoad() {
// Step 2: Reference the API key
gapi.client.setApiKey(apiKey);
window.setTimeout(checkAuth,1);
}
function checkAuth() {
gapi.auth.authorize({client_id: clientId, scope: scopes, immediate: true}, handleAuthResult);
}
function handleAuthResult(authResult) {
var authorizeButton = document.getElementById('authorize-button');
if (authResult && !authResult.error) {
authorizeButton.style.visibility = 'hidden';
makeApiCall();
} else {
authorizeButton.style.visibility = '';
authorizeButton.onclick = handleAuthClick;
}
}
function handleAuthClick(event) {
// Step 3: get authorization to use private data
gapi.auth.authorize({client_id: clientId, scope: scopes, immediate: false}, handleAuthResult);
return false;
}
// Load the API and make an API call. Display the results on the screen.
function makeApiCall() {
// Step 4: Load the Google+ API
gapi.client.load('plus', 'v1').then(function() {
// Step 5: Assemble the API request
var request = gapi.client.plus.people.get({
'userId': 'me'
});
// Step 6: Execute the API request
request.then(function(resp) {
var heading = document.createElement('h4');
var image = document.createElement('img');
image.src = resp.result.image.url;
heading.appendChild(image);
heading.appendChild(document.createTextNode(resp.result.displayName));
document.getElementById('content').appendChild(heading);
}, function(reason) {
console.log('Error: ' + reason.result.error.message);
});
});
}
</script>
// Step 1: Load JavaScript client library
<script src="https://apis.google.com/js/client.js?onload=handleClientLoad"></script>
One you have authentication set up the code below is how you can upload a document. You can also use a 'PUT' request. See this link for more information: https://developers.google.com/drive/web/manage-uploads
您已通过以下代码进行身份验证设置的是如何上传文档。您还可以使用“PUT”请求。有关更多信息，请参阅此链接：https: //developers.google.com/drive/web/manage-uploads
POST /upload/drive/v2/files?uploadType=media HTTP/1.1
Host: www.googleapis.com
Content-Type: image/jpeg
Content-Length: number_of_bytes_in_file
Authorization: Bearer your_auth_token
