gpt4 book ai didi

javascript - 如何在 Angularjs 中使用 ng-file 上传库上传二进制格式的文件?

转载 作者:行者123 更新时间:2023-12-03 05:10:58 25 4
gpt4 key购买 nike

我正在使用 AngularJs 中的预签名 URL 将文件上传到 Amazon S3 存储桶。打开下载的文件时,Zip 文件被损坏。当我从 postman 以二进制格式上传文件时,它按预期工作。

enter image description here

我在 angularjs 中使用 ng-file-upload 库。对于每个下载的文件,都包含在开头附加的 web-kit 表单边界,如下所示:

enter image description here

如果我们编辑并删除 web-kit 表单边界,并尝试完美打开同一个文件。

最佳答案

一周前我遇到了同样的问题,我想出的唯一解决方案是编写自己的代码,通过 http 请求发送文件。请随意使用示例:

function azureChangeFn() {
var inputElement = document.getElementById("fileSelect");
var newFile = inputElement.files[0];
var url = "https://YOUR_STORAGE_NAME.blob.core.windows.net/CONTAINER_NAME/"+ newFile.name +"GENERATED_SharedAccessSignature_FROM_AZURE_SITE";

var xhr = new XMLHttpRequest();
xhr.addEventListener("progress", updateProgress);
xhr.onreadystatechange = function() {
if (xhr.readyState == XMLHttpRequest.DONE) {
alert("Sent to azure storage service!");
}
}
xhr.open('PUT', url, true);
xhr.setRequestHeader("Content-type", "multipart/form-data");
xhr.setRequestHeader("lng", "en");
xhr.setRequestHeader("x-ms-blob-type", "BlockBlob");
xhr.setRequestHeader("x-ms-blob-content-type", newFile.type);
xhr.send(newFile);
}

function updateProgress (oEvent) {
if (oEvent.lengthComputable) {
var percentComplete = oEvent.loaded / oEvent.total;
console.log(percentComplete);
} else {
alert('FAIL');
}
}
<html>

<head>
</head>

<body>
<label>Example without library:</label>
<br>
<label>Select file: <input type="file" id="fileSelect" onchange="azureChangeFn()"></label>


</body>
</html>

谈论 ng-file-upload 库,在源代码中我发现 formData.append 方法在附加文件时会自动添加 web-kit header 。据我了解,FormData 用于 POST 方法,但使用 PUT 时,所有正文都被视为文件。遗憾的是,我无法使用 POST 方法将文件上传到 azure 存储。

关于javascript - 如何在 Angularjs 中使用 ng-file 上传库上传二进制格式的文件?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41822902/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com