JSON 中位于位置 0(...) 的意外标记 r

Posted 2023-02-19

【中文标题】JSON 中位于位置 0(...) 的意外标记 r

【英文标题】：Unexpected token r in JSON at position 0(...)

【发布时间】：2016-12-21 06:17:39

【问题描述】：

我现在正在开发基于 STM32 MCU 的 Web 服务器。浏览器向 MCU 发送请求，然后 MCU 响应一个 web html 文件。用户可以进一步设置参数并使用表单将参数提交回MCU进行广播。现在我遇到了问题。我尝试以 JSON 数据类型发送表单数据。但不知何故，它给我一个错误。 “位置 0(...) 的 JSON 中的意外标记 r”。这是我的提交代码。

$(document).ready(function()
    // click on button submit

    $("#broadcastform").on('submit', function(e)
        e.preventDefault();
        $.ajax(
            url: '192.168.0.10',
            type : "POST",
            dataType : 'json',
            data: $(this).serialize(),
            success : function(result) 
            console.log(result);
            alert($(this).serialize());
            ,
            error: function(xhr, resp, text) 
            console.log(xhr, resp, text);

        
    )
);
   );

您可以看到我将 url 设置为 192.168.0.10，这是我的 MCU 平台的 ip。这是我的表单代码。

<form name="broadcastform" id="broadcastform" method="post" action="">  


    <h1 id="broadcast_title" style="color:rgba(255,255,255,0.7);font-size: 250%;font-weight: 400;margin-top:-10px" align="middle">BROADCAST</h1>
    <hr style="border-color:#ffffff;weight:40%;margin:0 auto;margin-bottom:20px">
    <center class="page_intro">
    <div style="margin-top:-1%;color:rgba(255,255,255,0.7);width:90%;margin-bottom:12.5%" class="page_intro">
    <font size="6" style="line-height: 150%"class="page_intro"><center>Welcome!</center></font>
    <font size="5" style=" padding-top:20px;line-height: 150%;font-weight:normal;opacity:0.7"class="page_intro"><center>This is a Tool to Configure and Broadcast Your Modulator. Please Follow the Steps and Fill in the Parameter Fields for Your Preference. Enjoy the Tour !</center></font>
    </div>
    </center>
    <!-- Page Basic Setting --> 
    <select name="InputSource"  class="required page_basic" style="margin-left:23%" form="broadcastform" >

                <option value="">Broadcast Input</option>             
                <option value="0">HDMIPhy</option>             
                <option value="1">USB Streaming</option>             
                <option value="2">MPEC-TS Interface</option>             
                <option value="3">VIP(Ethernet)</option>         
    </select>
    <select name="ModulationMode"class= "page_basic required" style="margin-left:23%" form="broadcastform">             
                <option value="">Modulation Mode</option>             
                <option value="1">ATSC</option>             
                <option value="2">DTMB</option>             
                <option value="3">DVB</option>             
                <option value="4">ISDB</option>         
    </select>           
    <input type= "text" name= "ProviderName" placeholder="Provider Name" maxlength="16" class="required page_basic">      
    <input type= "text" name= "ServiceName" placeholder="Service Name" maxlength="16" class="required page_basic" style="margin-bottom:8%">

    <!-- Page IP Setting. Only with ETH Input Source--> 
    <input type= "text" name= "LocalIP" class="page_ip" placeholder="Local IP" style="margin-top:30px"  id="LocalIp">             
    <input type= "text" name= "RemoteVIPAddr" class="page_ip" style="margin-top:7%" placeholder="Remote VIP Address" id="RemoteIp">
    <input type= "text" name= "RemoteVIPPort" class="page_ip" style="margin-top:7%;margin-bottom:11.8%"  placeholder="Remote VIP Port"id="RemoteVIPPort">

    <!-- Page RF Setting -->              
    <input type= "text" name= "RFOutFreq" class="page_rf" style="margin-top:7%" placeholder="RF Output Frequency"  id="RFOutFreq">
    <input type= "text" name= "RFIfFreq" class="page_rf"style="margin-top:7%" placeholder="RF IF Frequency" id="RFIfFreq">         
    <input type= "text" name= "RFBandwidth" class="page_rf" style="margin-top:7%;margin-bottom:11.8%" placeholder="RF Bandwidth" id="RFBandwidth">   

    <!-- Page EncryptKey Setting -->              
    <input type= "text" name= "EncryptKeyLo" class="page_encrypt" style= "margin-top:13%" placeholder="Encrypt Key Low" id="EncryptKeyLo">  
    <input type= "text" name= "EncryptKeyHi" class="page_encrypt" style=" margin-top:13%;margin-bottom:16.1%" placeholder="Encrypt Key High" id="EncryptKeyHi">
<input id="submit" type="submit" value="Submit" class="btn inner" />
</form>

有人知道吗？卡在这个地方很久了。

另外，当我添加 console.log($(this).serialize());在我的 ajax 代码“错误”部分（如果我按下提交将执行）。它什么也没显示。它看起来像一个空物体。但我只是做 form.submit();我的 MCU 可以接收“x-www-form-urlencoded”数据。

我再次检查了控制台。响应文本不是 json 格式。它仍然是 urlencoded 格式。

【参考方案1】：

这很可能是响应成功而不是错误的问题，但服务器没有返回响应正文。尝试解析 undefined 结果将导致 JSON 解析器出现此类错误。

检查浏览器检查器中的网络选项卡，查看响应是否为204 No Content。如果是，则需要从 AJAX 调用中删除 dataType : 'json' 行，并在 success 处理程序中手动处理响应。仅当响应码不是204 时才解析响应数据。

success: function(data, textStatus, xhr) 
    if (xhr.status !== 204) 
        var obj = JSON.parse(data);
    
,

我不知道你使用的是什么版本的 JQuery，所以这个例子可能不适用于所有版本，但原理是一样的。检查204状态码，如果有body则只解析JSON数据。

注意：根据 $.ajax() 的 JQuery 文档：

从 jQuery 1.9 开始，空响应也会被拒绝；服务器应该返回 null 或 的响应。

但是，我不知道这种情况下的“拒绝”是否意味着调用error方法。

如果所有其他方法都失败了，只需从您的 $.ajax() 调用中删除 dataType: 'json', 设置，以告诉 JQuery 不要尝试将响应解析为 JSON。

【讨论】：

我使用的是 3.1.0 分钟版本。

好的，这个例子可能仍然有效，但他们已经转移到 JQuery 中更加基于 Promise 的解决方案。

我不知道为什么。它不会成功。它似乎进入了“错误”

请参阅我从 JQuery 文档中添加的关于空响应的上述引用。它给出了一个错误，因为你期待 json 返回，但你得到一个空的响应。尝试简单地从您的 $.ajax() 呼叫中删除 dataType: 'json'。

我没有在控制台上看到 204 状态。我只看到“状态：200”，它什么也没说。

【参考方案2】：

错误

JSON 中位置 0(...) 的意外标记 r

这意味着您的请求得到了意外的响应，这意味着该消息是一种错误响应代码。要解决此问题，您需要捕获网络上的响应代码和响应标头/正文。

例如，一旦您的请求负载超载并且响应给出 413 错误代码但没有响应正文。尝试显示响应正文会给您一个意外的标记作为显示。