关于#uniapp IOS 文件上传 status == 0 #的问题，如何解决？

Question

uniapp webview h5页面文件上传 安卓端上传文件正常 ios端异常
安卓端是 xhr.status == 200 但是ios端是 xhr.status == 0 导致报错 但是后台还可以存进去（每次都是status是0 但是不是每一次都能存入到数据库） 就很疑惑，找了好久没有找到答案，看过 uniapp的一个插件 lsj-upload 但是我看他底层是这种的ajax请求 估计也是一样的

代码片

    xhr.open('POST', uploadUrl);
    xhr.upload.addEventListener("progress", function(event) {
       if (event.lengthComputable) {
          let percent = Math.ceil(event.loaded * 100 / event.total) ;
          //实时监听文件上传的进度
        if(isUniJsReady){
            uni.postMessage({
                data: {
                    progress: percent+ "%",
                    message: "上传中"
                }
            });
        }else{
            title.innerText = "上传";
        }
                    
    }
}, false);
    xhr.send(formData);
    xhr.onreadystatechange = function() {
    if (xhr.readyState == 4 && xhr.status == 200) {
        let responseText = xhr.responseText;
        let successful = false;
        if(JSON.parse(responseText).code == 0){
            responseText = "上传成功";
            successful = true;
    }
}

Answer 1

不知道你这个问题是否已经解决, 如果还没有解决的话:

• 以下回答来自chatgpt:

  这个问题可能是由于 iOS 的安全机制导致的。由于 iOS 在应用的 webview 中默认没有开启跨域访问权限，如果需要上传文件到跨域域名下，需要在应用的 info.plist 文件中添加配置，以开启跨域访问权限。

  具体操作步骤如下：

  1. 打开 Xcode，找到你的应用项目。
  2. 在项目目录下找到 info.plist 文件，双击打开。
  3. 在 info.plist 文件中添加以下配置（如果已存在则跳过）：

  <key>NSAppTransportSecurity</key>
  <dict>
      <key>NSAllowsArbitraryLoads</key>
      <true/>
  </dict>
  

  1. 保存并关闭 info.plist 文件。
  2. 在 Xcode 中重新编译应用。
  3. 尝试在 iOS 端上传文件，查看是否能够成功上传。

  如果以上方法仍然不能解决问题，可能需要进一步排查代码中可能存在的问题。可以先尝试手动调用 XMLHttpRequest 对象进行文件上传，以确认问题是否出现在 uniapp 的封装上。代码示例如下：

  const xhr = new XMLHttpRequest();
  const formData = new FormData();
  formData.append('file', file);
  
  xhr.upload.addEventListener('progress', (event) => {
    // 进度回调
  });
  
  xhr.upload.addEventListener('load', () => {
    // 上传完成回调
  });
  
  xhr.upload.addEventListener('error', () => {
    // 上传错误回调
  });
  
  xhr.open('POST', 'https://your.upload.url');
  xhr.send(formData);
  

  如果手动调用仍然出现状态码为 0 的问题，那可能是服务器端响应存在问题，另行排查服务器端代码和配置。

  如果手动调用可以正常上传，那可能是 uniapp 的封装存在问题。可以考虑优化封装或者使用其他文件上传插件解决问题。

如果你已经解决了该问题, 非常希望你能够分享一下解决方案, 写成博客, 将相关链接放在评论区, 以帮助更多的人 ^-^