通过 API 发送图像缓冲区以添加到 IPFS

Question

我正在尝试将图像上传到 IPFS。我是这样做的：

我从我的网站 UI 上传图像，将其转换为我的 angular 组件中的缓冲区，通过 put/post 请求（使用 httpclient ）将其发送到我的 nodeJS Express 服务器，我的服务器连接到 IPFS 网络并保存图像。

我遇到的问题是我无法将图像上传到 IPFS，而且我一直收到此错误：

Content submission error: Error: Invalid arguments, data must be an object, Buffer or readable stream

这就是我在发送之前获取缓冲区的方式：

const that = this;
      that.ConfirmButtonDisabled=true;
        let NativeInput = jQuery(this.ImageInput.nativeElement);
        NativeInput.trigger('click');
        NativeInput.change('file-select',function (file) {
            const reader = new FileReader();
            reader.onload = (e) => {
                let file=reader.result
                let buffer = new Buffer(file);
                const buff: ArrayBuffer = buffer.buffer;
                that.CustomerInfo["KImage"] = buff;
                console.log("read the file into buffer", that.CustomerInfo)
                that.ConfirmButtonDisabled=false;
            }
            reader.readAsArrayBuffer(NativeInput.prop('files')[0]);
            console.log(NativeInput.prop('files')[0])
            that.SelectedImage = NativeInput.prop('files')[0].name;
        })

通过这种方式登录浏览器时，我得到如下信息：image:ArrayBuffer(6924) {}

如果我不使用 buffer.buffer，我会得到一个像这样记录的 uint8array： image:Uint8Array(6924) [255, 216, 255, 224, 0, 16, 74, 70, 73, 70, ... ]

如果我在服务器端登录，最后一个版本不会以同样的方式显示，数组的每个元素都变成 \u0000 之类的东西，就好像它们是 ascii 或 utf8 字符一样（这可能是 console.log() 函数的作用，但我不确定）例如：��\u0000\u0010JFIF\u0000\u0001\u0001\u0000\u0000\u0001\u0000\u0001\u0000\u0000��\u0000�\u0000\t\u0006\u0007\r\r\r\u0010\r\r\u0010\u000f\r\r\r\u000e\r\r\r\r

在这两种情况下，IPFS 输出相同的错误。

注意： 我确实通过 Web 客户端直接使用 IPFS（没有 nodeJS 服务器），并且它有效。所以我认为相同的代码可以工作，因为它都是 javascript。

我该怎么做？我如何通过 nodeJS 将缓冲区（或图像）从我的 angular 5 客户端正确发送到 IPFS ；

Answer 1

我通过 HTTP 发送 uint8array 并在我的 nodeJs 代码中创建一个带有 buffer.from 的缓冲区来解决这个问题。一个相当简单的修复。

通过 API 发送图像缓冲区以添加到 IPFS

Sending image Buffer through API to add to IPFS

javascript

jquery

node.js

ipfs

angular