个人中心
gpt4 book ai didi

javascript - 如何在保持目录结构的情况下将文件夹上传到 Google 云端硬盘？

转载 作者：行者123 更新时间：2023-11-30 10:01:48 30 4
gpt4 key购买 nike

我正在尝试通过使用 javascript drive api 将文件夹上传到 google drive 并保持其目录结构。我实现了上传所有文件而不是文件夹中的文件夹。我还实现了通过 drive api 将一个空文件夹上传到 google drive。但是我找不到解释上传文件夹并保持其所有目录结构的资源。例如我有一个这样的文件夹:(我添加了一个链接来显示我的示例文件夹。由于我的声誉低，我无法添加直接图像。) http://postimg.org/image/h52bvb71v/

但是当我选择文件夹时，我只能上传 .txt 文件。至少 google drive api Javascript Quickstart 为我提供了该代码。我不想破坏文件夹的结构，我想将其上传到具有原始结构的驱动器。你知道我怎样才能用谷歌驱动器 api 和 javascript 做到这一点吗？谢谢。

这是我的代码。它只上传文件夹内的文件，而不上传文件夹。

<html>
<head>
<meta http-equiv="Content-type" content="text/html;charset=UTF-8">
<script type="text/javascript">
    var CLIENT_ID = 'xxxxxxxxxxxxxxxxxxx';
    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 filePicker = document.getElementById('filePicker');
        authButton.style.display = 'none';
        filePicker.style.display = 'none';
        if (authResult && !authResult.error) {
            // Access token has been successfully retrieved, requests can be sent to the API.
            filePicker.style.display = 'block';
            filePicker.onchange = 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 () {
            var output = document.getElementById('output');


            var files = evt.target.files; // FileList object

            var totalFiles = files.length; // important

            for (var i = 0; i < totalFiles; i++) {
                var file = evt.target.files[i];
                insertFile(file);
          /*      if (file.isFile) {
                    document.write("OLDUUUUUUU");
                } else if (file.isDirectory) {
                    document.write("haydaaaaa");
                }*/
                console.debug(file.webkitRelativePath);
                output.innerText = output.innerText + file.webkitRelativePath + "\n";
            }

        //    var file = evt.target.files[0];
         //   insertFile(file);
        });
    }

    /**
     * Insert new file.
     *
     * @param {File} fileData File object to read data from.
     * @param {Function} callback Function to call when the request is complete.
     */
    function insertFile(fileData, callback) {
        const boundary = '-------314159265358979323846';
        const delimiter = "\r\n--" + boundary + "\r\n";
        const close_delim = "\r\n--" + boundary + "--";

        var reader = new FileReader();
        reader.readAsBinaryString(fileData);
        reader.onload = function (e) {
            var contentType = fileData.type || 'application/octet-stream';
            var metadata = {
                'title': fileData.name,
                'mimeType': contentType,
                'parents': [{ "id": "0B-WlbPCzbAQpfmhpNXVRWmFlT2daWC1xNEUyQUJEbnViZThYUXVzMFpvdTNuYTc4aDJmb0E" }]
            };

            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_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
            });

         /*   var request = gapi.client.request({
                'path': '/drive/v2/files',
                'method': 'POST',
                'params': { 'uploadType': 'multipart' },
                'body': {
                    "title": "cat",
                    "mimeType": "application/vnd.google-apps.folder",
                    "description": "Some"
                }
            });*/

            if (!callback) {
                callback = function (file) {
                    console.log(file)
                };
            }
            request.execute(callback);
        }
    }

</script>
<script type="text/javascript" src="https://apis.google.com/js/client.js?onload=handleClientLoad"></script>
</head>
<body>
 <!--Add a file picker for the user to start the upload process 
     <input type="file" name="files[]" multiple directory webkitdirectory mozdirectory>
    -->
 <div>
    <input type="file" id="filePicker" multiple directory webkitdirectory mozdirectory />
    <input type="button" id="authorizeButton" style="display: none" value="Authorize" />
</div>      
<div id="output"></div>

最佳答案

该 api 不支持您想要的。然而，正如您发现的那样，您可以创建空文件夹。然后递归地创建所需的文件夹并将文件上传到它。

关于javascript - 如何在保持目录结构的情况下将文件夹上传到 Google 云端硬盘？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/31222578/

30 4 0
文章推荐： javascript - 如何从 JSON 值创建动态表？
文章推荐： swift - 日期选择器，用户无法返回到之前的日期 Swift
文章推荐： objective-c - Objective C 到 Swift 的调度过程
文章推荐： javascript - 使用 BabelJs 转译时如何忽略一段代码？
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com