cordova 相机插件DATA_URL不返回文件名或扩展名

xoefb8l8  于 2022-11-15  发布在  其他
关注(0)|答案(2)|浏览(189)

由于性能问题,不建议使用DATA_URL,但我需要字节数组直接上传到我的服务器
我想知道是否可以将DATA_URL与ALLMEDIA一起使用,因为DATA_URL只会返回一个字节数组,而不知道文件名或文件扩展名是什么。如果我们总是上传图像,这不是什么大问题,但我希望用户也上传文档和PDF
有没有办法提取这些信息?

u5rb5r59

u5rb5r591#

文件名对于其文件内容是任意的。你可以使用cordova-plugin-file API动态地得到一个文件名,但是你可以告诉服务器是否应该使用一个特定的文件名,并且服务器可以实际使用这个信息。我将在下面提供两种不同的方法。
DATA_URL也不返回字节数组,它返回的是base64编码的字符串。如果你想要一个字节数组,你可以使用文件插件通过readAsArrayBuffer读取ArrayBuffer文件。XMLHttpRequest可以接受ArrayBufferBlob对象来发送原始二进制数据,这比处理base64字符串要高效得多。这将在下面的两个示例中显示。

HTTP标头方法

您可以使用cordova-plugin-file API获取文件名,并通过HTTP头将其发送到服务器。

function readBinaryFile(fileEntry) {

    fileEntry.file(function (file) {
        var reader = new FileReader();

        reader.onloadend = function() {

            console.log("Successful file write: " + this.result);
            displayFileData(fileEntry.fullPath + ": " + this.result);

            var blob = new Blob([new Uint8Array(this.result)], { type: "image/png" });
            var xhr = new XMLHttpRequest();
            xhr.open('POST', 'https://example.com/upload');
            xhr.setRequestHeader('X-FILENAME', file.name);
            xhr.send(blob);
        };

        reader.readAsArrayBuffer(file);

    }, onErrorReadFile);
}

表单数据方法

或者,如果由于某种原因不能使用HTTP头,那么可以构造一个FormData对象,并将blob和字符串作为多部分表单请求附加。示例如下:

function readBinaryFile(fileEntry) {

    fileEntry.file(function (file) {
        var reader = new FileReader();

        reader.onloadend = function() {

            console.log("Successful file write: " + this.result);
            displayFileData(fileEntry.fullPath + ": " + this.result);

            var blob = new Blob([new Uint8Array(this.result)], { type: "image/png" });
            var form = new FormData();
            form.append('filename', file.name);
            form.append('file', blob);

            var xhr = new XMLHttpRequest();
            xhr.open('POST', 'https://example.com/upload');
            xhr.send(form);
        };

        reader.readAsArrayBuffer(file);

    }, onErrorReadFile);
}

使用FormData方法时,您可能希望使用一个可以读取/解析多部分表单的FormData库。
免责声明:示例未经测试,但大多来自cordova-plugin-file docs
最后,不要忘记清理文件名,您不希望用户通过上传一个名为../someImportantDataFile的文件来刺激您的服务器,并覆盖某些内容;)

sqxo8psd

sqxo8psd2#

DATA_URL永远不会传回文件名称或副档名。
如果您希望获得包含文件名的完整路径,请改用FILE_URI。如果您根本没有提到destinationType,则默认情况下将返回FILE_URI。
然后,可以使用以下命令将其从本机路径转换为cdv路径:

resolveLocalFileSystemURL(imageFinal, function(entry) {

console.log("here is the file path: " + entry.toInternalURL());

});

相关问题