Проблемы с загрузкой файлов с помощью Dropbox JavaScript SDK

#javascript #dropbox-api #download #dropbox-sdk-js

#javascript #dropbox-api #Скачать #dropbox-sdk-js

Вопрос:

Я пытаюсь загрузить файл в само веб-приложение на стороне клиента, используя Dropbox Javascript SDK.

Я хочу пояснить, что я хочу загрузить файл только в папку в веб-приложении; Я понимаю, что из-за соображений безопасности это может быть невозможно.

Я следую документации, представленной в:

http://dropbox.github.io/dropbox-sdk-js/index.html

http://dropbox.github.io/dropbox-sdk-js/Dropbox.html#filesDownload__anchor

Это мой код контроллера:

 $scope.testDownload = function() {
  console.log('Testing Download');
  dbx.filesDownload( {path: '/Collorado Springs.jpg'} ) // Just a test file
    .then(function(response) {
      console.log(response);
    })
    .catch(function(error) {
      console.log(err);
  });
};
  

Я определенно вижу, что загрузка действительно происходит, как показано в сетевом инструменте Chrome, как показано ниже:

(У меня недостаточно репутации для вставки нескольких ссылок, поэтому, пожалуйста, вставьте эту общую «ссылку», которую я создал)

https: // www.dropbox.com/s/s0gvpi4qq2nw23s/dbxFilesDownload.JPG?dl=0

Я полагаю, что либо мне не хватает знаний о работе с загрузками файлов, либо неправильно используется JavaScript.

Заранее благодарим вас за любую помощь, которую вы можете предоставить.

Комментарии:

1. На чем именно вы застряли? Похоже, вы получаете ожидаемые инструкции журнала. Если вы ищете способ предложить эти данные пользователю для загрузки на свой компьютер, ознакомьтесь с этим примером . (Это другой метод API, но он работает так же.)

2. Приносим извинения за отсутствие ясности. Общая цель здесь — загрузить файл из пользовательского dropbox в папку «загрузки» в самом веб-приложении (это может быть клиентская или серверная сторона, я не беспокоюсь); Я не имею в виду папку «Загрузки пользователей». Я попробовал метод, на который вы любезно ссылались, и он делает то, что вы говорите, что, к сожалению, не то, что я хочу. Я могу загрузить, используя метод ‘filesDownload’, но я не знаю, как переместить результирующий файл или работать с ним, чтобы получить желаемый результат. Идея в том, что все это происходит за кулисами с помощью JavaScript.

3. Я не уверен, что понимаю, но похоже, что вызов API Dropbox работает правильно, поэтому, боюсь, я не смогу больше помочь, так как это звучит скорее как общий вопрос об обработке данных JavaScript.

4. Спасибо за вашу помощь @Greg

Ответ №1:

Если вы хотите загружать и использовать файлы в веб-приложении, гораздо лучше настроить внутренний сервер и использовать его для временного хранения содержимого, конечно, с разрешения пользователей.

Для этого выполните HTTP-запрос, затем используйте Express для обработки запроса путем вызова службы Dropbox на стороне сервера, затем используйте код, подобный следующему:

 'use strict';
var Dropbox = require('dropbox');
var fs = require('fs');
var path = require('path');

exports.downloadFile = function(token, id, eventID, fileType, callback) {
  var dbx = new Dropbox({ accessToken: token });  // creates post-auth dbx instance
  dbx.filesDownload({ path: id })
    .then(function(response) {
      if(response.fileBinary !== undefined) {
        var filepath = path.join(__dirname, '../../images/Events/'   eventID   '/'   fileType   '/Inactive/', response.name);
        fs.writeFile(filepath, response.fileBinary, 'binary', function (err) {
          if(err) { throw err; }
          console.log("Dropbox File '"   response.name   "' saved");
          callback('File successfully downloaded');
        });
      }
    })
    .catch(function(err) {
      console.log(err);
      callback('Error downloading file using the Dropbox API');
    })
}

module.exports = exports;
  

Ответ №2:

Существует способ сделать это и на клиенте, не прибегая к собственной серверной реализации, как предполагает принятый ответ.

Для всех, у кого есть эта проблема, вы можете использовать FileReader API.

 $scope.testDownload = function() {
  console.log('Testing Download');
  dbx.filesDownload( {path: '/Collorado Springs.jpg'} ) // Just a test file
    .then(function(response) {
      console.log(response);
      const reader = new FileReader();
      const fileContentAsText = reader.readAsText(response.result.fileBlob);
      reader.onload = (e) => {
        console.log({ file: reader.result }); // Logs file content as a string
      };
    })
    .catch(function(error) {
      console.log(err);
  });
};