React-Native Fetch“POST”请求在Android中抛出“SyntaxError：JSON输入的意外结束”答案

【问题标题】：React-Native Fetch "POST" request throwing "SyntaxError: Unexpected end of JSON input" in AndroidReact-Native Fetch“POST”请求在Android中抛出“SyntaxError：JSON输入的意外结束”
【发布时间】：2016-09-08 03:33:33
【问题描述】：

这是我的功能
不知道问题出在哪里

fetchData() {
        fetch(REQUEST_URL, {
      method: 'POST',
      headers: {
        'Accept': 'application/json',
        'Content-Type': 'application/json',
      },
      body: JSON.stringify({
        Request : 'menu',
        active : '1',
      })
    }).then((response) => response.json())
    .then((responseData) => {
        this.setState({
              menu: responseData.Response,
          }); 
    })
    .catch((error) => {
      console.warn('error',error);
    })
    .done();
      }

请指出函数中的问题

【问题讨论】：

有人知道吗？

标签： json http-post react-native

【解决方案1】：

发生错误是因为您的响应无法转换为 JSON 格式。此问题可能是由于错误的标头、响应正文或基于您的服务器的其他各种原因而发生的。要走的路 - 因为显然响应不一致 - 是在尝试将响应转换为 JSON 之前执行服务器响应的额外验证。

您可以通过替换来做到这一点：

.then((response) => response.json())

与

.then((response) => {
  // In this case, we check the content-type of the response
  if (response.headers.get('content-type').match(/application\/json/)) {
    return response.json();
  }
  return response;
  // You can also try "return response.text();"
 })

【讨论】：

【解决方案2】：

    The error will be  occcurs because your response can not be casted to be JSON 
    format.

    there are  three  type of php mysqli api formate 

    1 formData 
    2 xml
    3 json 

   i think you  are use Formdata api  but you are request in json see  formdata  
    example

1) json Request..    example

        var Request = {
            security:1,
            token: token,
            email: this.state.username,
            password: this.state.password
          };
          console.log(JSON.stringify(Request));
                fetch(API.login, {
                  method: "POST",
                  headers: {
                    Accept: "application/json",
                    "Content-Type": "application/json"
                  },
                  body: JSON.stringify(Request)
                })
                  .then(res => res.json())
                  .then(res => {
                    console.log("Login RESPONCE:::  ", res);
                  }

      2)Formdata Example  use form data i think your error will be solve 

             let formdata = new FormData()

        formdata.append("Api variable",your post variable)
        formdata.append("name",this.state.name)
        formdata.append("email, this.state.email)
        formdata.append("password",this.state.password) 

       fetch('http://192.168.1.116/Restaurants/Registration.php', {
                        method: 'POST',
                        headers: {
                            'Content-Type': 'multipart/form-data'
                        },
                        body:formdata


                    }).then(res => res.json())
                        .then(res => {


                            console.log('Data RESPONCE::', res);
           }

【讨论】：

【解决方案3】：

then((response) => response.json())
                   ^^^^^^^^^^^^^ I think this is the problem

当您使用 fetch API 时，状态码不等于 2xx 的响应不会进入 catch，因此您可以 JSON.parse 诸如 HTML 页面或纯文本流之类的内容。

在将响应解析为 JSON 之前，您应该检查是否为 response.ok === true。

【讨论】：

【解决方案4】：

此错误的可能原因是您的服务器未返回无效的 JSON（可能根本不是 JSON，例如 404 页面或类似页面）。

【讨论】：

但是在邮递员上，我收到了来自我的服务器@oblador 的响应

【解决方案5】：

如果您将请求 Content-Type 设置为 application/json，它可能会发送预检请求以检查 CORS。

在我的 React 应用程序（不是 React-Native）中，我遇到了跨域问题。我的服务器不支持预检请求，因此响应如下：

{ body: null, status: 0, ok: false, }

这导致 response.json() 失败，即使我在 Chrome 开发工具中得到了预期的 JSON 响应。

就我而言，我将请求 Content-Type 更改为 application/x-www-form-urlencoded，这不需要预检请求。它按预期工作。

这可能对你的情况没有帮助，但我希望它能给你一些见解。

【讨论】：

【解决方案6】：

记录响应数据。 API 可能返回无效数据。

【讨论】：