HTTP/HTTPS文件服务器：在VS Code中快速启动一个本地Server-VSCode-PHP中文网

HTTP/HTTPS文件服务器：在VS Code中快速启动一个本地Server

P粉986688829

发布： 2025-11-28 15:15:05

原创

193人浏览过

Live Server扩展可一键启动本地HTTP服务器并支持热重载，适合前端快速开发；通过右键HTML文件选择“Open with Live Server”即可在http://127.0.0.1:5500预览。

在前端开发或静态页面调试时，经常需要快速启动一个本地 HTTP 服务器来预览文件。虽然可以直接打开 index.html，但某些功能（如 AJAX 请求、ES6 模块导入）要求资源必须通过 HTTP 协议加载。这时候，在 VS Code 中快速启动一个本地 HTTP/HTTPS 文件服务器就非常实用。

使用 Live Server 快速启动 HTTP 服务器

Live Server 是 VS Code 中最受欢迎的扩展之一，能一键启动本地开发服务器，并支持自动刷新功能。

操作步骤：

打开 VS Code，进入扩展市场（快捷键 Ctrl+Shift+X）
搜索并安装 Live Server（由 Ritwick Dey 开发）
右键点击你的 HTML 文件（如 index.html），选择 Open with Live Server
浏览器会自动打开 http://127.0.0.1:5500/index.html，服务器已运行

默认端口为 5500，可在设置中修改。该服务器支持静态资源访问、热重载，适合前端开发调试。

使用 Node.js 手动启动 HTTP 服务器

如果你希望更灵活地控制服务器行为，可以使用 Node.js 创建一个简单的 HTTP 服务。

Natural Language Playlist

探索语言和音乐之间丰富而复杂的关系，并使用 Transformer 语言模型构建播放列表。

查看详情

操作方法：

确保已安装 Node.js
在项目根目录创建一个 server.js 文件
写入以下代码：

const http = require('http');
const fs = require('fs');
const path = require('path');

const port = 8080;

const server = http.createServer((req, res) => {
  let filePath = '.' + req.url;
  if (filePath === './') filePath = './index.html';

  const extname = String(path.extname(filePath)).toLowerCase();
  const mimeTypes = {
    '.html': 'text/html',
    '.js': 'text/javascript',
    '.css': 'text/css',
    '.json': 'application/json',
    '.png': 'image/png',
    '.jpg': 'image/jpg',
    '.gif': 'image/gif',
  };

  const contentType = mimeTypes[extname] || 'application/octet-stream';

  fs.readFile(filePath, (error, content) => {
    if (error) {
      if (error.code === 'ENOENT') {
        res.writeHead(404);
        res.end('404 Not Found');
      } else {
        res.writeHead(500);
        res.end('500 Internal Server Error');
      }
    } else {
      res.writeHead(200, { 'Content-Type': contentType });
      res.end(content, 'utf-8');
    }
  });
});

server.listen(port, () => {
  console.log(`HTTP Server running at http://localhost:${port}/`);
});

登录后复制

在终端运行：node server.js
浏览器访问 http://localhost:8080

启用 HTTPS 服务器（可选）

若需测试 HTTPS 环境（如调用安全 API），可升级上述 Node 服务为 HTTPS。

操作步骤：

生成自签名证书（使用 OpenSSL）：

openssl req -x509 -newkey rsa:4096 -keyout key.pem -out cert.pem -days 365 -nodes

登录后复制

修改 server.js 使用 https 模块：

const https = require('https');
const fs = require('fs');

const options = {
  key: fs.readFileSync('key.pem'),
  cert: fs.readFileSync('cert.pem')
};

https.createServer(options, (req, res) => {
  // 同上请求处理逻辑
}).listen(8443, () => {
  console.log('HTTPS Server running at https://localhost:8443/');
});

登录后复制