介绍
@webdav-server/dropbox 是一个基于 Node.js 的 npm 包，可以实现在前端中使用 Dropbox 进行文件上传、下载、管理等操作。在使用该包之前，您需要注册一个 Dropbox 开发者账号并创建一个应用程序。
安装
使用 npm 安装 @webdav-server/dropbox：
npm install @webdav-server/dropbox
使用
首先，导入该包：
const Dropbox = require('@webdav-server/dropbox');在创建 Dropbox API 实例之前，需要先完成授权流程。授权可以通过以下三种方式完成：
1. 授权码流
授权码流程需要用户登录 Dropbox，并授权您的应用程序访问其 Dropbox 账号。该流程需要执行两个步骤：获取授权码和通过授权码获取令牌。
获取授权码：
const authUrl = Dropbox.oauth2.getAuthorizationUrl({
clientId: 'YOUR_CLIENT_ID',
redirectUri: 'https://example.com/auth',
responseType: 'code'
});
console.log(authUrl);在浏览器中打开上述 URL，将会提示用户登录 Dropbox 并确认授权。
获取令牌：
-- -------------------- ---- ------- ----- ---- - ---------------------------------- ----- ------ - ----- --------------------------------- --------- ----------------- ------------- --------------------- ----- ----- ------------ -------------------------- --- --------------------------------
2. 授权码简化流
授权码简化流（Implicit Flow）将授权码流中的第一步和第二步合并为一步。该流程不需要应用后端，但在某些情况下安全性较低。
const authUrl = Dropbox.oauth2.getAuthorizationUrl({
clientId: 'YOUR_CLIENT_ID',
redirectUri: 'https://example.com/auth',
responseType: 'token'
});
console.log(authUrl);在浏览器中打开上述 URL，将会提示用户登录 Dropbox 并确认授权。
3. 令牌流
令牌流（Token Flow）是最简单的一种授权方式，只需用户授权后应用程序即可获取令牌。该流程不需要应用后端，但同样安全性较低。
获取令牌：
const result = await Dropbox.oauth2.getToken({
clientId: 'YOUR_CLIENT_ID',
clientSecret: 'YOUR_CLIENT_SECRET',
grantType: 'client_credentials'
});
console.log(result.accessToken);接下来，您需要使用上述步骤获取到的令牌来创建 Dropbox API 实例。例如：
const dbx = new Dropbox({
accessToken: 'YOUR_ACCESS_TOKEN'
});现在，您可以使用 API 实例来访问 Dropbox。例如，列出文件：
const response = await dbx.filesListFolder({path: ''});
console.log(response.entries);示例代码
以下代码展示了如何使用 @webdav-server/dropbox 上传文件：
-- -------------------- ---- -------
----- -- - --------------
----- ------- - ----------------------------------
----- -------- ------------ -
-- -- ------- --- --
----- --- - --- ---------
------------ -------------------
---
-- ----
----- -------- - --------------------------------
----- -------- - ----- -----------------
----- ---------------------
--------- --------
---
----------------------
-
-------------总结
本文介绍了如何使用 @webdav-server/dropbox 包，在前端中实现对 Dropbox 的文件上传、下载、管理等操作。在使用该包之前，需要先完成授权流程。最后，给出了上传文件的代码示例。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60066b4d51ab1864dac66839