google-chrome - 为什么 Chrome 开发工具显示 200 状态码而不是 304

问题描述

当我在用 Chrome 测试缓存处理中的一个奇怪行为时（我在这里问了一些关于它的问题），我发现了其他东西：当服务器返回 304 响应时，Chrome 开发工具显示 200 状态代码。

在这里，您可以看到 chrome 开发工具显示的内容 (200)，并且我包含了一个显示服务器 304 响应的wireshark 捕获。

这是与 Firefox 相同的用法，它显示了 304 代码：

更有趣的是两种浏览器的时间差异：

Firefox 没有显示接收部分的延迟，但 Chrome 表示它花了 3.91 毫秒。

你知道为什么 Chrome 没有显示正确的状态码吗？

如果你想测试自己，这里是服务器代码：

#!/usr/bin/env node

'use strict';

const express = require('express');
const cors = require('cors');
const compression = require('compression');
const pathUtils = require('path');
const fs = require('fs');

const http = require('http');
let app = express();
app.disable('x-powered-by');
app.use(express.json({ limit: '50mb' }));
app.use(cors());
app.use(compression({}));
app.use(function (req, res, next) {
    res.set('Cache-control', 'no-cache');
    console.log(req.headers);
    next();
});

let server = http.createServer(app);

app.get('/api/test', (req, res) => {
    res.status(200).send(fs.readFileSync(pathUtils.join(__dirname, 'dummy.txt')));
});

server.listen(1234);

和客户：

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8" />
        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <title>Document</title>
    </head>
    <body>
        <script>
            let test = fetch('http://localhost:1234/api/test').then((res) => {
                console.log(res.status);
                return res.text();
            });
        </script>
    </body>
</html>

标签： google-chromehttpgoogle-chrome-devtoolscache-control

google-chrome - 为什么 Chrome 开发工具显示 200 状态码而不是 304

问题描述

解决方案

推荐阅读