React Native-获取POST不起作用

Question

我在获取POST调用以在iOS上工作时遇到了很大的麻烦。 我的标准Fetch调用可以正常工作，而Fetch POST调用在android上可以正常运行，但在iOS上则不能。

出现的错误是“可能的未处理的承诺拒绝（id：0）：JSON中位置0处的意外令牌<”

它实际上将发布数据保存到我的服务器，但引发该错误。

我尝试使用GLOBAL.XMLHttpRequest = GLOBAL.originalXMLHttpRequest || GLOBAL.XMLHttpRequest;调试网络请求。 GLOBAL.XMLHttpRequest = GLOBAL.originalXMLHttpRequest || GLOBAL.XMLHttpRequest; 在API调用之前，再在Chrome调试工具中使用CORS。 从那里我可以看到它正在一个接一个地接两个接发电话。 第一个具有类型“ OPTIONS”，而第二个具有类型“ POST”。 可能应该注意的是，在使用CORS和上面的代码行时，调用可在App中运行。

我很困惑，已经筋疲力尽了。

我的代码用于刷新的代码如下。

return fetch(url,{
        method: 'post',
        headers: {
            'Accept': 'application/json',
            'Content-Type': 'application/json'
        },
        body: JSON.stringify(data)
    }).then((res) => res.json());

Answer 1

您可以使用以下代码轻松响应POST请求中的POST请求。 您只需要替换参数名称和值以及您的URL。

var details = {
    'userName': 'test@gmail.com',
    'password': 'Password!',
    'grant_type': 'password'
};

var formBody = [];
for (var property in details) {
  var encodedKey = encodeURIComponent(property);
  var encodedValue = encodeURIComponent(details[property]);
  formBody.push(encodedKey + "=" + encodedValue);
}
formBody = formBody.join("&");

fetch('http://identity.azurewebsites.net' + '/token', {
  method: 'POST',
  headers: {
   'Accept': 'application/json',
   'Content-Type': 'application/x-www-form-urlencoded'
 },
 body: formBody
 }).  
 .then((response) => response.json())
        .then((responseData) => {
            console.log("Response:",responseData);
         }).catch((error) => {
                Alert.alert('problem while adding data');
            })
        .done();

Answer 2

如果JSON.stringify无法正常工作，请尝试使用FormData。

import FormData from 'FormData';

var formData = new FormData();
formData.append('key1', 'value');
formData.append('key2', 'value');

let postData = {
    method: 'POST',
    headers: {
        'Accept': 'application/json',
        'Content-Type': 'multipart/form-data'
    },
    body: formData
}

fetch(api_url, postData)
.then((response) => response.json())
.then((responseJson) => { console.log('response:', responseJson); })
.catch((error) => { console.error(error); });

Answer 3

我想您收到的响应是HTML。 尝试：

 console.warn(xhr.responseText)

然后查看响应。

另外，IOS需要HTTPS。

编辑：可能重复： “ React App”中的“ SyntaxError：JSON位置0中的意外令牌<”

Answer 4

服务器node.js？

npm i cors --save

var cors = require('cors');
app.use(cors());

res.header("Access-Control-Allow-Origin: *");

Answer 5

这是一个适合我的日期示例！
诀窍是“ =”和“＆”符号，并且在主体对象中必须采用字符串格式。 找到创建该字符串并将其传递给主体的方法。

===================================

fetch('/auth/newdate/', {
            method: 'POST',
            mode: 'cors',
            redirect: 'follow',
            body: "start="+start.toLocaleString()+"&end="+end.toLocaleString()+"",
            headers: new Headers({
                "Content-Type": "application/x-www-form-urlencoded;charset=UTF-8"
            })
        }).then(function(response) {
            /* handle response */
            if(response.ok) {
              response.json().then(function(json) {
                let releasedate = json;
                //sucess do something with places
                console.log(releasedate);
              });
            } else {
              console.log('Network failed with response ' + response.status + ': ' + response.statusText);
            }
        }).catch(function(resp){ console.log(resp) });