如何在 nodejs 后端使用 dropbox API v2 上传图片
How do I upload images using dropbox API v2 in nodejs backend
我一直在尝试使用我的 nodejs 后端中的 dropbox API v2 将图像上传到 dropbox 应用程序文件夹,但是每张成功上传的图像都已损坏并且只有 15 个字节大并且无法从中预览在 Dropbox 应用程序文件夹中。
这是我的代码;
const express = require("express");
const router = express.Router();
const fetch = require("isomorphic-fetch");
const Dropbox = require("dropbox").Dropbox;
const dbx = new Dropbox({
accessToken:
"my access token",
fetch: fetch
});
router.post("/dbx", (req, res) => {
let imageArray;
//I receive either a single image or an array of images from the front end and
//its placed in req.files by express-fileupload
if (req.files.itemImage.length) {
imageArray = [...req.files.itemImage];
} else {
imageArray = [req.files.itemImage];
}
imageArray.forEach(image => {
console.log("Image==>>",image)
dbx
.filesUpload({
path: `/${image.name}`,
contents: image
})
.then(response => {
console.log(response);
})
.catch(err => {
console.log(err);
});
});
});
下面是我在终端
中通过命令console.log("Image==>>",image)
发送的典型图像
{ name: 'ImageName.jpg',
data:
<Buffer ff d8 ff e1 1f 39 45 78 69 66 00 00 4d 4d 00 2a 00 00 00 08 00 07 01 12 00 03 00 00 00 01 00 01 00 00 01 1a 00 05 00 00 00 01 00 00 00 62 01 1b 00 05 ... >,
size: 1865542,
encoding: '7bit',
tempFilePath: '',
truncated: false,
mimetype: 'image/jpeg',
md5: '133bda2ce6d52b4bada8ba31349c4910',
mv: [Function: mv] }
以下是我从终端的保管箱收到的回复
{ name: 'ImageName.jpg',
path_lower: '/imageName.jpg',
path_display: 'ImageName.jpg',
id: 'id:R0fPv_de0wAAAAAAAAAAJw',
client_modified: '2019-07-08T10:21:36Z',
server_modified: '2019-07-08T10:21:36Z',
rev: '0130000000015cb7a8c0',
size: 15,
is_downloadable: true,
content_hash:
'87bfbb905f228845cfb691920551882f446042da2ef9576e26ca97c5374c3eef' }
图像名称在 name:
字段中正确显示,但图像只有 15 字节大小,无法从 Dropbox 应用程序文件夹中预览。我不明白出了什么问题,因此我不知道如何解决。谁能帮我解释我做错了什么?如果我的问题有任何不清楚的地方,请指出,我会相应地进行编辑。
我尝试将请求的内容作为 JSON.stringify(image)
发送,但得到了一个比我发送的文件大 3 倍的损坏文件,我看到了一种方法,我必须先将图像上传到我的服务器然后使用 fs 命令将每个文件的内容写入请求,但我不想在服务器上有这样的文件夹,我宁愿尽可能立即发送图像。
我希望从 Dropbox 服务器收到正确的图像大小的肯定消息,然后能够在我创建的 Dropbox 应用程序文件夹中预览图像。
我自己想出来了。仅在有人遇到相同问题时发布。
内容应该从图片改为image.data
即而不是这样做;
dbx
.filesUpload({
path: `/${image.name}`,
contents: image
})
.then(response => {
console.log(response);
})
.catch(err => {
console.log(err);
});
应该是这个
dbx
.filesUpload({
path: `/${image.name}`,
contents: image.data
})
.then(response => {
console.log(response);
})
.catch(err => {
console.log(err);
});
将此作为供未来搜索者参考的信息发布,因为我也很难理解这一点。如果可以改进此解释,欢迎提出意见。
Dropbox 的 /files/upload endpoint is expecting the binary data of the file (among other things). In the server-side JavaScript world, the Buffer
class 是 Node 处理二进制数据的方式。虽然有时您可以在请求或响应中发现文件的二进制数据(Buffer
对象),但 Buffer
class 还提供了多种方法来制作您自己的 Buffer
在需要时从文件中删除对象。
我发现 this article about Buffers from FreeCodeCamp 是有用的资源。
我一直在尝试使用我的 nodejs 后端中的 dropbox API v2 将图像上传到 dropbox 应用程序文件夹,但是每张成功上传的图像都已损坏并且只有 15 个字节大并且无法从中预览在 Dropbox 应用程序文件夹中。
这是我的代码;
const express = require("express");
const router = express.Router();
const fetch = require("isomorphic-fetch");
const Dropbox = require("dropbox").Dropbox;
const dbx = new Dropbox({
accessToken:
"my access token",
fetch: fetch
});
router.post("/dbx", (req, res) => {
let imageArray;
//I receive either a single image or an array of images from the front end and
//its placed in req.files by express-fileupload
if (req.files.itemImage.length) {
imageArray = [...req.files.itemImage];
} else {
imageArray = [req.files.itemImage];
}
imageArray.forEach(image => {
console.log("Image==>>",image)
dbx
.filesUpload({
path: `/${image.name}`,
contents: image
})
.then(response => {
console.log(response);
})
.catch(err => {
console.log(err);
});
});
});
下面是我在终端
中通过命令console.log("Image==>>",image)
发送的典型图像
{ name: 'ImageName.jpg',
data:
<Buffer ff d8 ff e1 1f 39 45 78 69 66 00 00 4d 4d 00 2a 00 00 00 08 00 07 01 12 00 03 00 00 00 01 00 01 00 00 01 1a 00 05 00 00 00 01 00 00 00 62 01 1b 00 05 ... >,
size: 1865542,
encoding: '7bit',
tempFilePath: '',
truncated: false,
mimetype: 'image/jpeg',
md5: '133bda2ce6d52b4bada8ba31349c4910',
mv: [Function: mv] }
以下是我从终端的保管箱收到的回复
{ name: 'ImageName.jpg',
path_lower: '/imageName.jpg',
path_display: 'ImageName.jpg',
id: 'id:R0fPv_de0wAAAAAAAAAAJw',
client_modified: '2019-07-08T10:21:36Z',
server_modified: '2019-07-08T10:21:36Z',
rev: '0130000000015cb7a8c0',
size: 15,
is_downloadable: true,
content_hash:
'87bfbb905f228845cfb691920551882f446042da2ef9576e26ca97c5374c3eef' }
图像名称在 name:
字段中正确显示,但图像只有 15 字节大小,无法从 Dropbox 应用程序文件夹中预览。我不明白出了什么问题,因此我不知道如何解决。谁能帮我解释我做错了什么?如果我的问题有任何不清楚的地方,请指出,我会相应地进行编辑。
我尝试将请求的内容作为 JSON.stringify(image)
发送,但得到了一个比我发送的文件大 3 倍的损坏文件,我看到了一种方法,我必须先将图像上传到我的服务器然后使用 fs 命令将每个文件的内容写入请求,但我不想在服务器上有这样的文件夹,我宁愿尽可能立即发送图像。
我希望从 Dropbox 服务器收到正确的图像大小的肯定消息,然后能够在我创建的 Dropbox 应用程序文件夹中预览图像。
我自己想出来了。仅在有人遇到相同问题时发布。 内容应该从图片改为image.data
即而不是这样做;
dbx
.filesUpload({
path: `/${image.name}`,
contents: image
})
.then(response => {
console.log(response);
})
.catch(err => {
console.log(err);
});
应该是这个
dbx
.filesUpload({
path: `/${image.name}`,
contents: image.data
})
.then(response => {
console.log(response);
})
.catch(err => {
console.log(err);
});
将此作为供未来搜索者参考的信息发布,因为我也很难理解这一点。如果可以改进此解释,欢迎提出意见。
Dropbox 的 /files/upload endpoint is expecting the binary data of the file (among other things). In the server-side JavaScript world, the Buffer
class 是 Node 处理二进制数据的方式。虽然有时您可以在请求或响应中发现文件的二进制数据(Buffer
对象),但 Buffer
class 还提供了多种方法来制作您自己的 Buffer
在需要时从文件中删除对象。
我发现 this article about Buffers from FreeCodeCamp 是有用的资源。