Question

＆＃34; JSON解析错误：无法识别的令牌＆＃39;＆lt;＆＃39;＆＃34;在点击api时出现错误。代码如下注意*：响应采用JSON格式。

＆＃13;

fetch("http:/example.com", {method: "POST",
  body: JSON.stringify(
    {
      uname: uname,
      password: password      
    }
  )
})
.then((response) => response.json())
.then((responseData) => {
  AlertIOS.alert(
      "POST Response",
      "Response Body -> " + JSON.stringify(responseData.body)
  )
}).done();
       this.props.navigation.navigate("Home")
   };

＆＃13;

请帮忙。谢谢，

Answer 1

这意味着您正在从服务器获取HTML响应，可能是404或500错误。代替response.json()使用response.text()，您将获得文本中的html。

fetch("http:/example.com", {method: "POST",
  body: JSON.stringify(
    {
      uname: uname,
      password: password      
    }
  )
})
.then((response) => response.text())
.then((responseData) => {
  AlertIOS.alert(
      "POST Response",
      "Response Body -> " + responseData
  )
}).done();
       this.props.navigation.navigate("Home")
   };

Answer 2

我发现了这个问题，将图像上传到亚马逊S3上，图像尺寸很大。我以较低的分辨率上传图像，对我来说效果很好。

Answer 3

我遇到了同样的问题，花了几个小时后，我发现我的 URL 中有一个空格。如下图

let url = "https://qinvite.vizzwebsolutions.com/api/edit_category "

所以我从末尾删除了 SPACE 并且它开始工作了。

Answer 4

您可以尝试将标题添加到fetch api，因为它会将您的记录发布到您的网址。

var dataObj = {}
dataObj.uname = uname,
dataObj.password = password

fetch("http:/example.com", {
  method: 'post',
  headers: {
    'Accept': 'application/json, text/plain, */*',  // It can be used to overcome cors errors
    'Content-Type': 'application/json'
  },
  body: JSON.stringify(dataObj)
})
.then((response) => response.json())
.then((responseData) => {
  AlertIOS.alert(
      "POST Response",
      "Response Body -> " + JSON.stringify(responseData.body)
  )
}).done();
    this.props.navigation.navigate("Home")
};

Answer 5

最后以下代码有效。问题出在身体参数上。

＆＃13;

fetch("http:/example.com", {method: "POST",
  body: "uname=value1&password=value2" // <-- Post parameters        
})
.then((responseData) => {
  AlertIOS.alert(
      "POST Response",
      "Response Body -> " + JSON.stringify(responseData.body)
  )
}).done();
       this.props.navigation.navigate("Home")
};

＆＃13;

Answer 6

我之前也遇到过这个问题。我通过将其添加为fetch中的参数来解决它。

header: {
  'Content-Type': 'application/json'
}

如果它不起作用，则很可能是Web服务中的内部服务器错误。干杯。

Answer 7

这很可能是当您从服务器接收html标签格式而不是json签出服务器将数据编码为正确的json格式时，您可以通过response.text（）检查响应（如果它比接收文本格式有效）。 / p>

Answer 8

检查您的API；有时，如果您使用的是PHP，则需要设置error_reporting(0);

Answer 9

我将模板文字中的多行URL更改为单行URL，解决了这个问题。

我在iOS上遇到了这个问题，但在Android上却没有。根据版本控制的“相同”代码以及根据测试过程的状态，导致在iOS设备仿真器而非Android设备仿真器上出现此错误。

Apple和Windows使用不同的行尾，考虑到模板文字允许多行字符串，这很重要。

// failed in iOS
fetch(`https://<API-NAME>/
?param1=${param1}
&param2=${param2}`);

// consistently works
fetch(`https://<API-NAME>/?param1=${param1}&param2=${param2}`);

Answer 10

我很确定所有这些答案都是正确的。从我所看到的，如果您使用以下方法正确设置了请求标头：

headers:{
    'Accept': 'application/json',
    'Content-Type':'application/json'
}

Accept标头将告诉服务器我们正在发送什么数据类型。 Content-Type告诉客户端响应数据类型将是什么。

您很可能不得不更改主体的格式，因为可能未将服务器设置为处理应用程序/ json数据类型。在这种情况下，如果您有权访问服务器，则可以将其添加到配置文件或.htaccess中。如果仍然出现错误，则服务器的json响应中有错误。

如果您还没有使用POSTMAN进行API测试，请去拿它，因为它对调试API很有帮助。

Answer 11

就我而言，我使用Infinity Free WebHosting进行API设计和测试，显然，如果您使用免费帐户，则它们不允许暴露API端点。

该错误表示您将收到发回HTML的代码，并且您必须执行console.log(data_response)才能看到实际的错误。如果您使用 Axios

，这会容易得多。

我遇到的错误：

<html><body><script type="text/javascript" src="/aes.js" ></script><script>function toNumbers(d){var e=[];d.replace(/(..)/g,function(d){e.push(parseInt(d,16))});return e}function toHex(){for(var d=[],d=1==arguments.length&&arguments[0].constructor==Array?arguments[0]:arguments,e="",f=0;f<d.length;f++)e+=(16>d[f]?"0":"")+d[f].toString(16);return e.toLowerCase()}var a=toNumbers("f655ba9d09a112d4968c63579db590b4"),b=toNumbers("98344c2eee86c3994890592585b49f80"),c=toNumbers("c353693e65094689705f1b8cec0deb51");document.cookie="__test="+toHex(slowAES.decrypt(c,2,a,b))+"; expires=Thu, 31-Dec-37 23:55:55 GMT; path=/"; location.href="";</script><noscript>This site requires Javascript to work, please enable Javascript in your browser or use a browser with Javascript support</noscript></body></html>

解决方案：

尝试使用其他不同的共享主机服务提供商。

Answer 12

就我而言，API 网站受用户名和密码保护，称为基本身份验证。

所以当我从浏览器登录到网站并发布相同的 fetch url 时，它给了我我需要的 json 响应，但是当我从另一个未通过身份验证的浏览器登录时，它返回了未授权的 html 页面.

所以答案可能是两者的结合，缺少标头以及需要在请求中添加网站的密码和用户名。

如果您不知道如何添加基本身份验证：

<块引用>

这里输入用户名和密码，会自动生成，可以用别的网站创建它(https://www.blitter.se/utils/basic-authentication-header-generator/)
将此添加到您的请求中（使用您自己的基本身份验证进行自定义）

标题：{ '授权'：'基本 ZGV2VGVhbTpmc2xoZ2dpQHRh' }

瞧。

Answer 13

以上提到的答案都没有对我有用。事实上，当我获取 api 时，它是正确完成的，就像

      fetch('https://reactnative.dev/movies.json')
        .then((response) => response.json())
        .then((json) => {
          console.log(json.movies);
          
        })
        .catch((error) => {
          console.error(error);
        });

但问题是当我尝试在 fetch 中再添加一个字符串时，我得到了一个错误，就像代码一样

   const fetchCities = (text) => {
        setCity(text)
        fetch('https://reactnative.dev/movies.json'+text)
        .then((response) => response.json())
        .then((json) => {
          console.log(json.movies);
          
        })
        .catch((error) => {
          console.error(error);
        });
    }

实际上我想制作一个可搜索的组件，所以我添加了以下字符来消除错误，以便它可以在搜索时组合一个字符串来过滤数据。

?query=

在这样的 fetch 语句中

   const fetchCities = (text) => {
        setCity(text)
        fetch('https://reactnative.dev/movies.json?query=')
        .then((response) => response.json())
        .then((json) => {
          console.log(json.movies);
          
        })
        .catch((error) => {
          console.error(error);
        });
    }

下面给出了将在控制台上显示过滤效果的完整代码，因为您将搜索一个值

import { text } from '@fortawesome/fontawesome-svg-core';
import React, { Component, Fragment, useState, useEffect } from 'react';
import { FlatList,SafeAreaView, StyleSheet, ScrollView, View, Text, StatusBar, Button, Image, TextInput } from 'react-native';
import BRAND_DRUG_UNIQUE from '../BRAND_DRUG_UNIQUE.json';



const Search = () => {
    const [city, setCity] = useState("")
    const [cities, setCities] = useState([])
    const fetchCities = (text) => {
        setCity(text)
        fetch('https://reactnative.dev/movies.json?query='+text)
        .then((response) => response.json())
        .then((json) => {
          console.log(json.movies);
          
        })
        .catch((error) => {
          console.error(error);
        });
    }
    useEffect(()=>{
        
        // console.log("filteredData==> ",city);
    })
    return (
        <View style={{
            position: "relative", zIndex: 1000, borderWidth: 1, borderColor: "grey", shadowColor: "#000", marginBottom: 10,
            shadowOffset: {
                width: 0,
                height: 12,
            },
            shadowOpacity: 0.58,
            shadowRadius: 16.00,

            elevation: 24,
        }}>
            <View>
                <Text>
                    It is the search component
                </Text>
                <TextInput
                    placeholder="Search here if you want"
                    style={{ color: "#00aaff" }}
                    value={city}
                    onChangeText={(text) => fetchCities(text)}
                />
            </View>
        </View>
    );
}
export default Search;

希望对您有所帮助。谢谢。

Answer 14

我猜一些 url 拼写错误可能会导致该错误。

我在处理 graphql 请求时遇到了这个问题。就我而言，问题出在请求 url 中。有 https://my.domain//graphql 和双 /

JSON解析错误：无法识别的令牌＆＃39;＆lt;＆＃39; - 反应原生

14 个答案: