Jor*_*n S 5 javascript safari xmlhttprequest mobile-safari ios
我有一个项目，我需要异步上传多个图像。它在任何地方都可以正常运行（运行11.4的iOS模拟器上的Chrome，Firefox，MacOS Safari，Android Chrome，iOS Safari）。但是，在使用iOS Safari的iPhone（以及其他尝试运行11.4的其他iPhone）上，当我打开图像/文件选择器时，现有请求失败。
从那以后，我将问题简化为一些更简单的代码：
<html>
<head>
<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
<script src="/javascripts/main.js"></script>
</head>
<body>
<p>Upload Progress: <span id="status">Not Started</span></p>
<p>Blob Upload: <button id="blobUpload">Upload Blob</button></p>
<p>File Input: <input type="file" /></p>
</body>
</html>
这是main.js：
$(document).ready(() => {
$("#blobUpload").click(() => {
const status = document.getElementById("status");
status.innerHTML = "Started";
// Create an array about 2mb in size (similar to an image);
// and append it to a form data object
const intArray = new Uint8Array(2000000);
const blob = new Blob([intArray]);
const formData = new FormData();
formData.append('file', blob);
const request = new XMLHttpRequest();
request.upload.addEventListener('progress', (ev) => {
const percent = Math.round(ev.loaded / ev.total * 100);
status.innerHTML = percent + '%';
}, false);
request.upload.addEventListener('error', (ev) => {
status.innerHTML = '<span style="color: red">Network Error</span>';
});
request.open('POST', '/upload', true);
request.send(formData);
});
});
如果我单击“上传Blob”按钮，然后什么也不做，则它会100％地起作用，永远不会失败。但是，如果单击“上传blob”按钮，则在上传时单击文件输入（这与其他所有内容完全无关），请选择菜单选项之一（“拍摄照片”或“视频”，“照片库”或“浏览”），然后选择选择某项内容，拍照或什至只是单击取消返回，上传的Blob大约会失败1/3，并显示“无法加载资源：网络连接丢失”。错误。所上传的内容（图像或Blob或其他内容）都没有关系。
经过2天的调试，我发现我的研究没有引起人们的兴趣，并相信我已经尝试过。任何帮助，将不胜感激。开始相信这可能只是Safari的错误。
这似乎是当照片选择器出现时 Safari 进入后台时出现的问题，并且作为后台应用程序，现有的网络请求通常无法完成。要解决这个问题并不容易。我一直在测试 iOS 13，据我所知，这个问题已经修复。有兴趣看看其他有此问题的人是否也可以验证，但我一直在 iOS 12 与 iOS 13 上运行测试，并且一直在 12 上失败，在 13 上成功。
| 归档时间： |
|
| 查看次数： |
501 次 |
| 最近记录： |