Javascript在Chrome及本地Firefox正常，部署后Firefox失效问题排查

问题场景 #

这是基于Spark Java开发的短链接服务，前端通过JS处理表单提交，后端/api/new接口负责验证短链合法性：合法则存入数据库，非法则返回400错误。本地Docker构建运行时一切正常，但通过Nginx反向代理部署到公网后，Firefox浏览器中提交非法输入时错误提示功能失效，Chrome浏览器则完全正常。

前端JS代码 #

const addErrBox = async () => {
    const controls = document.querySelector(".pure-controls");
    const errBox = document.createElement("p");
    errBox.setAttribute("id", "errBox");
    errBox.setAttribute("style", "color:red");
    errBox.innerHTML = "Short URL not valid or already in use!";
    controls.appendChild(errBox);
}

const submitForm = () => {
    const form = document.forms.namedItem("new-url-form");
    const longUrl = form.elements["longUrl"];
    const shortUrl = form.elements["shortUrl"];

    const url = `/api/new`;

    fetch(url, {
        method: "POST",
        body: `${longUrl.value};${shortUrl.value}`
    })
        .then((res) => {
            if (!res.ok) {
                if (document.getElementById("errBox") == null) {
                    addErrBox();
                }
            }
            else {
                document.getElementById("errBox")?.remove();
                longUrl.value = "";
                shortUrl.value = "";

                refreshData();
            }
        });

};

(async () => {
    await refreshData();
    const form = document.forms.namedItem("new-url-form");
    form.onsubmit = e => {
        e.preventDefault();
        submitForm();
    }
})();

后端Java接口代码 #

public static String addUrl(Request req, Response res) {
        var body = req.body();
        if (body.endsWith(";")) {
            body = body + "$";
        }
        var split = body.split(";");

        String longUrl = split[0];
        
        if (split[1].equals("$")) {
            split[1] = Utils.randomString();
        }
        String shortUrl = split[1];
        shortUrl = shortUrl.toLowerCase();
        
        var shortUrlPresent = urlRepository
                .findForShortUrl(shortUrl);

        if (shortUrlPresent.isEmpty() && Utils.validate(shortUrl)) {
            return urlRepository.addUrl(longUrl, shortUrl);
        } else {
            res.status(HttpStatus.BAD_REQUEST_400);
            return "shortUrl not valid or already in use";
        }
    }

关键现象 #

• 输入合法时，前后端功能均正常，能成功存储短链并刷新页面。
• 后端接口在非法输入时能正确返回400状态码及错误信息。
• 仅在公网Nginx反向代理环境下的Firefox中，前端未触发错误提示框的显示逻辑；本地Docker环境下所有浏览器均正常。

更新说明 #

未对服务器端代码做任何修改，功能突然自行恢复正常。推测异常原因是Firefox浏览器缓存、Cloudflare缓存或Nginx缓存导致的请求/响应处理异常。

内容的提问来源于stack exchange，提问作者Sntn