由于性能问题,不建议使用DATA_URL,但我需要字节数组直接上传到我的服务器我想知道是否可以将DATA_URL与ALLMEDIA一起使用,因为DATA_URL只会返回一个字节数组,而不知道文件名或文件扩展名是什么。如果我们总是上传图像,这不是什么大问题,但我希望用户也上传文档和PDF有没有办法提取这些信息?
u5rb5r591#
文件名对于其文件内容是任意的。你可以使用cordova-plugin-file API动态地得到一个文件名,但是你可以告诉服务器是否应该使用一个特定的文件名,并且服务器可以实际使用这个信息。我将在下面提供两种不同的方法。DATA_URL也不返回字节数组,它返回的是base64编码的字符串。如果你想要一个字节数组,你可以使用文件插件通过readAsArrayBuffer读取ArrayBuffer文件。XMLHttpRequest可以接受ArrayBuffer或Blob对象来发送原始二进制数据,这比处理base64字符串要高效得多。这将在下面的两个示例中显示。
DATA_URL
readAsArrayBuffer
ArrayBuffer
XMLHttpRequest
Blob
您可以使用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和字符串作为多部分表单请求附加。示例如下:
FormData
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的文件来刺激您的服务器,并覆盖某些内容;)
../someImportantDataFile
sqxo8psd2#
DATA_URL永远不会传回文件名称或副档名。如果您希望获得包含文件名的完整路径,请改用FILE_URI。如果您根本没有提到destinationType,则默认情况下将返回FILE_URI。然后,可以使用以下命令将其从本机路径转换为cdv路径:
resolveLocalFileSystemURL(imageFinal, function(entry) { console.log("here is the file path: " + entry.toInternalURL()); });
2条答案
按热度按时间u5rb5r591#
文件名对于其文件内容是任意的。你可以使用cordova-plugin-file API动态地得到一个文件名,但是你可以告诉服务器是否应该使用一个特定的文件名,并且服务器可以实际使用这个信息。我将在下面提供两种不同的方法。
DATA_URL
也不返回字节数组,它返回的是base64编码的字符串。如果你想要一个字节数组,你可以使用文件插件通过readAsArrayBuffer
读取ArrayBuffer
文件。XMLHttpRequest
可以接受ArrayBuffer
或Blob
对象来发送原始二进制数据,这比处理base64字符串要高效得多。这将在下面的两个示例中显示。HTTP标头方法
您可以使用cordova-plugin-file API获取文件名,并通过HTTP头将其发送到服务器。
表单数据方法
或者,如果由于某种原因不能使用HTTP头,那么可以构造一个
FormData
对象,并将blob和字符串作为多部分表单请求附加。示例如下:使用
FormData
方法时,您可能希望使用一个可以读取/解析多部分表单的FormData
库。免责声明:示例未经测试,但大多来自cordova-plugin-file docs
最后,不要忘记清理文件名,您不希望用户通过上传一个名为
../someImportantDataFile
的文件来刺激您的服务器,并覆盖某些内容;)sqxo8psd2#
DATA_URL永远不会传回文件名称或副档名。
如果您希望获得包含文件名的完整路径,请改用FILE_URI。如果您根本没有提到destinationType,则默认情况下将返回FILE_URI。
然后,可以使用以下命令将其从本机路径转换为cdv路径: