Node.js中如何仅加载HTML页面的head部分？

这个需求完全可以实现，核心思路是流式接收响应数据，一旦获取到包含title的标签就终止请求，避免下载整个页面。下面分不同场景给出具体实现方法：

服务端/脚本场景（Python/Node.js等） #

通过底层网络请求工具逐段接收响应，匹配到</head>后立即断开连接，再解析title：

Python 示例 #

import socket
from bs4 import BeautifulSoup

def get_page_title(host, path="/"):
    sock = socket.socket(socket.AF_INET, socket.SOCK_STREAM)
    sock.settimeout(10)
    try:
        sock.connect((host, 80))
        # 发送HTTP GET请求，指定Connection: close确保断开后服务器停止传输
        request = f"GET {path} HTTP/1.1\r\nHost: {host}\r\nConnection: close\r\n\r\n"
        sock.send(request.encode())
        
        response_data = b""
        while True:
            chunk = sock.recv(1024)
            if not chunk:
                break
            response_data += chunk
            # 检测到</head>标签就停止接收
            if b"</head>" in response_data:
                response_data = response_data[:response_data.find(b"</head>") + len(b"</head>")]
                break
        
        # 解析HTML提取title
        html = response_data.decode('utf-8', errors='ignore').split("\r\n\r\n", 1)[-1]
        soup = BeautifulSoup(html, "html.parser")
        return soup.title.string if soup.title else None
    except Exception as e:
        print(f"请求出错: {e}")
        return None
    finally:
        sock.close()

# 使用示例
print(get_page_title("example.com"))

Node.js 示例 #

const net = require('net');
const { JSDOM } = require('jsdom');

function getPageTitle(host, path = '/') {
    return new Promise((resolve, reject) => {
        const socket = net.createConnection(80, host);
        socket.setTimeout(10000);
        
        socket.on('connect', () => {
            const request = `GET ${path} HTTP/1.1\r\nHost: ${host}\r\nConnection: close\r\n\r\n`;
            socket.write(request);
        });
        
        let responseData = '';
        socket.on('data', (chunk) => {
            responseData += chunk.toString();
            if (responseData.includes('</head>')) {
                socket.end(); // 终止连接
            }
        });
        
        socket.on('end', () => {
            try {
                const html = responseData.split('\r\n\r\n')[1];
                const dom = new JSDOM(html);
                resolve(dom.window.document.title || null);
            } catch (e) {
                reject(e);
            }
        });
        
        socket.on('error', (err) => reject(err));
        socket.on('timeout', () => {
            socket.destroy();
            reject(new Error('请求超时'));
        });
    });
}

// 使用示例
getPageTitle('example.com').then(console.log).catch(console.error);

浏览器前端场景 #

利用Fetch API的ReadableStream流式读取响应，匹配到</head>后主动中止请求：

async function getPageTitle(targetUrl) {
    const abortController = new AbortController();
    let receivedContent = '';

    try {
        const response = await fetch(targetUrl, {
            signal: abortController.signal,
            mode: 'cors' // 跨域场景需目标服务器支持CORS
        });
        
        const reader = response.body.getReader();
        const decoder = new TextDecoder('utf-8');

        while (true) {
            const { done, value } = await reader.read();
            if (done) break;
            
            receivedContent += decoder.decode(value, { stream: true });
            if (receivedContent.includes('</head>')) {
                abortController.abort(); // 中止请求，停止接收数据
                break;
            }
        }
    } catch (err) {
        // 中止错误属于预期情况，忽略
        if (err.name !== 'AbortError') throw err;
    }

    // 临时文档解析title
    const tempDoc = document.implementation.createHTMLDocument();
    tempDoc.documentElement.innerHTML = receivedContent;
    return tempDoc.title || null;
}

// 使用示例
getPageTitle('https://example.com').then(title => console.log('页面标题:', title));

注意事项 #

• 若目标页面的title是通过JavaScript动态设置的（比如SPA页面），仅加载静态无法获取真实title，需额外处理JS渲染逻辑。
• 前端场景受同源策略限制，跨域请求需目标服务器配置CORS；若无法配置CORS，可通过同源代理服务器中转请求。
• 部分服务器可能不支持中途断开连接，但绝大多数现代服务器会在客户端断开后停止传输数据。

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