Unhandled promise rejection: SyntaxError: JSON Parse error: Unrecognized token '<' in react native

Question

我是 React Native 的新手。我创建了一个表单来将图像上传到服务器。但是当我尝试上传图片时，不断出现这样的错误=> [未处理的承诺拒绝：语法错误：JSON 解析错误：无法识别的标记 '<'] 请帮助谢谢。我想以多部分格式发送数据

这是我的代码

 const pickImage = async () => {
    let result = await ImagePicker.launchImageLibraryAsync({
      mediaTypes: ImagePicker.MediaTypeOptions.All,
     // base64: true,
    });
    if (result.cancelled) {
      return;
    }
  
    let localUri = result.uri;
    let filename = localUri.split('/').pop();
  
    let match = /\.(\w+)$/.exec(filename);
    let type = match ? `image/${match[1]}` : `image`;
  
    let formData = new FormData();
    formData.append('photo', { uri: localUri, name: filename, type });
  
    console.log(formData)
    return await fetch('https//xyxtech/Android_API_CI/upload_multipart_data', {
      method: 'POST',
      body: formData,
      // header: {
      //   'content-type': 'multipart/form-data',
      // },
      headers: {'Accept': 'application/json, text/plain, */*', 'content-type': 'multipart/form-data'},
    })
    .then((returnValue) => returnValue.json())
  // .catch(err=>err)
  .then(function(response) {
    console.log(response)
    Alert.alert("File uploaded");
    // return response.json();
  });
  };

Answer 1

这本身不是 React Native 的问题。您的服务器响应非 JSON 正文，无法在此处解析：

.then((returnValue) => returnValue.json())

这可能意味着您的 HTTP 请求不正确。为什么不正确 - 抱歉，无法帮助您，因为我不熟悉您尝试使用的 API。

Answer 2

我有一个类似的错误，就像其他贡献者所说的那样，问题不在于前端（React-Native 代码片段），而在于后端（API）。我接受。该错误还表明提取调用工作正常。因此，您需要测试 API 以确认 returns 输出正确。使用邮递员或浏览器。为变量 photo 赋值并调用 https//xyxtech/Android_API_CI/upload_multipart_data。否则一切都应该很好。

Unhandled promise rejection: SyntaxError: JSON Parse error: Unrecognized token '<' in react native

Unhandled promise rejection: SyntaxError: JSON Parse error: Unrecognized token '<' in react native

multipartform-data

multipart

react-native