应用端上传图片至服务器为空，Postman正常求助

核心问题是手动设置multipart/form-data请求头时未包含boundary，导致后端无法正确解析表单数据，进而接收不到图片。另外React Native中处理本地图片URI的方式也可优化。

1. 移除手动设置的Content-Type头 #

使用XMLHttpRequest或fetch发送FormData时，React Native会自动生成带boundary的正确Content-Type头（格式类似multipart/form-data; boundary=----WebKitFormBoundaryXXX）。手动设置无boundary的Content-Type会覆盖自动生成的头，导致后端无法识别表单字段分隔规则，最终解析失败。

2. 优化图片到FormData的转换逻辑 #

React Native的ImagePicker返回的本地URI可直接用于构造FormData，无需先转Blob再转File，简化流程同时避免潜在转换问题。

修改后的代码如下：

const pickImage = async () => {
    const { granted } = await ImagePicker.requestMediaLibraryPermissionsAsync();
  
    if (!granted) {
      alert("Brak pozwolenia do bilbioteki!");
      return;
    }
  
    const pickerResult = await ImagePicker.launchImageLibraryAsync();
    if (pickerResult.canceled) {
      return;
    }
  
    const uri = pickerResult.assets[0].uri;
    const filename = pickerResult.assets[0].fileName!;
    const type = pickerResult.assets[0].type || 'image/png'; // 尽量指定具体MIME类型
  
    const formData = new FormData();
    // React Native FormData支持直接传入带URI的对象
    formData.append('image', {
      uri: uri,
      name: filename,
      type: type
    });
  
    try {
      const xhr = new XMLHttpRequest();
      xhr.open('POST', 'https://xxx.xxx:3005/api/profile/images');
      xhr.setRequestHeader('Authorization', `Bearer ${jwtToken}`);
      // 移除手动设置的Content-Type头
      // xhr.setRequestHeader('Content-Type', 'multipart/form-data');
  
      xhr.send(formData);
  
      xhr.onreadystatechange = function () {
        if (xhr.readyState === 4) {
          if (xhr.status === 201) {
            alert('Pomyślnie dodano zdjęcie');
          } else if (xhr.status === 400) {
            alert('Użytkownik może mieć maksymalnie 5 zdjęć');
          } else if (xhr.status === 500) {
            alert('Błąd serwera');
          } else {
            console.error('Nieoczekiwany status:', xhr.status);
          }
        }
      }
    } catch (error) {
      console.error(error);
    }
  };

额外补充：fetch版本示例 #

如果改用fetch发送请求，同样不要手动设置Content-Type：

try {
  const response = await fetch('https://xxx.xxx:3005/api/profile/images', {
    method: 'POST',
    headers: {
      Authorization: `Bearer ${jwtToken}`,
      // 不要设置Content-Type
    },
    body: formData
  });

  if (response.status === 201) {
    alert('Pomyślnie dodano zdjęcie');
  } else if (response.status === 400) {
    alert('Użytkownik może mieć maksymalnie 5 zdjęć');
  } else if (response.status === 500) {
    alert('Błąd serwera');
  }
} catch (error) {
  console.error(error);
}

内容的提问来源于stack exchange，提问作者PrzepalonyDecybel