Nodejs 环境下怎么查看浏览器发出的完整http包？

Nodejs 环境下怎么查看浏览器发出的完整http包？

我用chrome的工具但是只能看到一些头，感觉不太完整，request payload是指body么？

7 回复

当然可以。在Node.js环境下查看浏览器发出的完整HTTP包（包括请求头和请求体），通常需要设置一个中间件或者代理来拦截并打印这些信息。下面是一个简单的示例，展示如何使用http-proxy-middleware库来实现这一功能。

示例代码

首先，你需要安装http-proxy-middleware库：

npm install http-proxy-middleware

然后，你可以创建一个简单的代理服务器来拦截HTTP请求，并打印完整的HTTP包：

const express = require('express');
const { createProxyMiddleware } = require('http-proxy-middleware');

const app = express();

app.use('/api', createProxyMiddleware({
    target: 'http://your-target-server.com',
    changeOrigin: true,
    onProxyReq: (proxyReq, req, res) => {
        // 打印完整的HTTP请求
        console.log('Request URL:', req.originalUrl);
        console.log('Request Method:', req.method);
        console.log('Request Headers:', req.headers);
        
        // 如果有body，也打印出来
        let bodyData;
        if (req.method === 'POST' || req.method === 'PUT') {
            let body = '';
            req.on('data', chunk => {
                body += chunk.toString();
            });
            req.on('end', () => {
                bodyData = JSON.parse(body);
                console.log('Request Body:', bodyData);
            });
        }
    },
    onProxyRes: (proxyRes, req, res) => {
        // 打印完整的HTTP响应
        console.log('Response Status Code:', proxyRes.statusCode);
        console.log('Response Headers:', proxyRes.headers);
        let body = '';
        proxyRes.on('data', chunk => {
            body += chunk.toString();
        });
        proxyRes.on('end', () => {
            console.log('Response Body:', body);
        });
    }
}));

app.listen(3000, () => {
    console.log('Proxy server is running on port 3000');
});

解释

  1. 引入依赖：我们首先引入了express和http-proxy-middleware库。
  2. 创建代理服务器：使用createProxyMiddleware创建一个代理服务器，它会将所有发往/api路径的请求代理到http://your-target-server.com。
  3. 处理请求：通过onProxyReq回调函数，我们可以访问原始请求对象req，从而打印请求的URL、方法、头部信息以及请求体。
  4. 处理响应：通过onProxyRes回调函数，我们可以访问响应对象proxyRes，从而打印响应的状态码、头部信息以及响应体。

这样，你就可以在Node.js环境下查看浏览器发出的完整HTTP包了。


可以使用网络监控软件,比如charles

用 fiddler 或 wireshark

chrome看到的是最直观的哈哈

但是不完整啊

Chrome信息很完整啊，你没注意到有几个tab可以切换吧 playload看这里 http://stackoverflow.com/questions/23118249/whats-the-difference-between-request-payload-vs-form-data-as-seen-in-chrome

要在Node.js环境下查看浏览器发出的完整HTTP请求包，可以使用中间件库如morgan来记录HTTP请求日志，或者使用代理工具如Charles Proxy或Fiddler。不过，如果你想在Node.js服务器端直接查看完整的HTTP请求，可以使用内置的http或https模块来创建一个简单的HTTP服务器，并在请求处理函数中打印出请求对象。

示例代码

const http = require('http');

const server = http.createServer((req, res) => {
    let body = [];
    req.on('data', chunk => {
        body.push(chunk);
    }).on('end', () => {
        body = Buffer.concat(body).toString();
        console.log('Request Method:', req.method);
        console.log('Request URL:', req.url);
        console.log('Request Headers:', req.headers);
        console.log('Request Body:', body);

        // 发送响应
        res.writeHead(200, { 'Content-Type': 'text/plain' });
        res.end('Hello World\n');
    });
});

server.listen(3000, () => {
    console.log('Server is running on port 3000');
});

解释

  1. 创建HTTP服务器：使用http.createServer()创建一个HTTP服务器。
  2. 监听请求：在createServer的回调函数中，我们监听req（请求对象）的data事件来收集请求体数据。
  3. 打印请求信息：
    • req.method：请求方法，例如GET、POST等。
    • req.url：请求URL路径。
    • req.headers：请求头部信息。
    • body：请求体内容。
  4. 发送响应：使用res.writeHead()设置响应状态码和头部，然后使用res.end()发送响应体。

这段代码会在浏览器访问该服务器时，在控制台输出完整的HTTP请求信息，包括请求方法、URL、头部以及请求体内容。

注意，这种方法仅适用于你的应用能够直接接收这些请求的情况。如果你只是想在开发环境中调试浏览器发出的请求，推荐使用浏览器自带的开发者工具或者代理工具。

回到顶部