时间戳

首页 > 解决方案 > Firefox 开发者工具不会抱怨 JSON 无效

firefox-developer-tools - Firefox 开发者工具不会抱怨 JSON 无效

问题描述

我有一个 API 端点，其响应来自通过透明代理的辅助服务器。让我们说通常答案是

{ "hello": "world" }

由于体系结构（是的，这是不好的做法，但我对此无权），“透明代理”违反标准，在任何经过​​的地方注入 HTML 消息（包括 PNG 图像！）。标头是从后端发送的，代理不会触及。

有时，在显而易见的情况下，答案几乎是字面意思，

<div class="red">ERROR: session token not found</div>
{ "hello": "foobar" }

正在发生的事情是后端使用 HTTP/200 和 application/json 进行回答，因为它不（也不应该）关心 HTTP 令牌。它只是用逻辑上是垃圾的东西来回答（想象一个 ATM，如果您的 PIN 正确，它会告诉您您的余额；但如果它不正确，则回答“余额：0”，因为未经身份验证的客户的余额为 0）。

在这些情况下，正如预期的那样，前端 jQuery 会抛出一个合适的结果，因为答案肯定不是有效的 JSON，我通过.catch(xhr)后备得到通知，并解析它errorText我可以恢复错误文本。所以，我可以告诉用户有问题，问题是什么。从前端和应用的角度来看，每个人都过上了幸福的生活。

我的小问题是在调试时，因为 Firefox 接受答案并将其显示为有效 JSON，隐藏 HTML 就好像它不存在一样：

{
    "hello": "foobar"
}

即使[x] RAW在同一个 Firefox 开发人员工具窗口中切换开关，非 JSON HTML 前导码按预期显示，所以我可以看到它不是 JSON，尽管它是混乱的，但我看不到其他东西：

<div class="red">ERROR: session token not found</div>
{"hello":"foob...

如何确保 Firefox 开发人员工具实际上将无效的 JSON 视为无效，或以视觉方式显示它（标志、红色背景......），而无需手动关闭 RAW 开关（检查错误）和打开（检查内容）在每个请求？这无疑是可行的（事实上，这就是我现在正在做的事情），但真的很烦人。

重现示例

<!DOCTYPE html>
<html lang="en">
<head>
<title>JSONFail</title>
<meta charset="utf-8">
</head>
<body>
    <button onclick="json_test(0, '200 OK')">OK</button>
    <button onclick="json_test(1, '200 OK')">FAIL 200</button>
    <button onclick="json_test(2, '500 Some fail')">FAIL 500</button>
<script>
let XHR = (url) => {
    console.debug(';; XHR', url);
    return new Promise(function(resolve, reject) {
        const xhr = new XMLHttpRequest();
        xhr.open('GET', url, true);
        xhr.onload = function() {
            if (xhr.status == 200) {
                resolve(xhr);
            } else {
                reject(xhr);
            }
        };
        xhr.send(null);
    });
};
let json_test = (state, http_status) => {
    let xhr = XHR('json_serve.php?state=' + state
        + '&http_status=' + escape(http_status)
    );
    xhr.then(
        xhr => console.info(xhr)
    ).catch(
        xhr => console.error(xhr)
    );
};
</script>
</body>
</html>

<?php

header($_SERVER["SERVER_PROTOCOL"] . " " . $_GET['http_status']);
header('Content-Type: application/json;charset=utf-8');

if ($_GET['state'] == '0') {
    echo '{"hello": "world"}';
} else {
    echo '<div class="red">ERROR: session token not found</div>' . "\n";
    echo '{"hello": "foobar"}';
}

标签： firefox-developer-tools

解决方案

这已报告为错误 1708356。这显然是一个有意（如果过于热心）的功能，旨在促进使用XSSI 缓解哨兵查看 JSON 响应。但是，错误报告下的讨论确实表明该功能将受到限制。

Firefox ESR 78 不受影响，所以在票证解决之前，您可以考虑降级；否则，您无能为力。在 ESR 版本下进行 Web 开发也不应该受到伤害；由于某些用户确实更喜欢使用 ESR 版本，因此保持与它的兼容性应该是值得的。

推荐阅读