Firefox 开发者工具没有抱怨 NOT valid JSON

Question

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

{ "hello": "world" }

由于架构（是，这是不好的做法，但我对此没有权限），“透明代理”违反标准，注入HTML 任何通过的消息（包括 PNG 图像！）。 headers 是从后端发送的，不会被代理接触。

偶尔，在明显的情况下，答案几乎是字面上的，

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

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

在这些情况下，正如预期的那样，由于答案肯定无效 JSON，前端 jQuery 会出现问题 JSON，并且我会通过 .catch(xhr) 后备通知，并且解析它的 errorText 我可以恢复错误文本。因此，我可以告诉用户出现了问题，以及问题是什么。从front-end和应用的角度来看，大家从此过上了幸福的生活。

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

{
    "hello": "foobar"
}

即使在同一 Firefox 开发者工具 window 中切换 [x] RAW 开关，non-JSON HTML 序言也是按预期显示，所以我可以看到它不是 JSON，虽然它是混乱的，但我不能看到其他东西：

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

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

重现示例

firefox_json_mangle_test.html

<!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>

json_serve.php（与 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"}';
}

Answer 1

这已被报告为 bug 1708356. It is apparently an intentional (if overzealous) feature, meant to facilitate viewing JSON responses with XSSI mitigation sentinels。然而，错误报告下的讨论确实表明该功能即将受到限制。

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

Firefox 开发者工具没有抱怨 NOT valid JSON

Firefox Developer Tools NOT complaining about NOT valid JSON

firefox-developer-tools

重现示例