海外云服务器 40个地区可选            亚太云服务器 香港 日本 韩国

云虚拟主机 个人和企业网站的理想选择            俄罗斯电商外贸虚拟主机 赠送SSL证书

美国云虚拟主机 助力出海企业低成本上云             拨号云主机

在Web开发过程中，尤其是前后端协同作业时，一个稳定、高效且贴近生产环境的本地服务器至关重要，XAMPP作为一款集成了 Apache、MySQL、PHP 和 Perl 的跨平台开发套件，凭借其安装简便、功能全面等优势,深受广大开发者的喜爱。

默认情况下，XAMPP仅通过 localhost 访问位于 htdocs 目录下的主站点，当需要同时开发多个项目（如企业官网、后台管理系统、API接口服务）时，这种单一入口显然难以满足需求。配置虚拟主机（Virtual Hosts） 就成为提升开发效率和组织性的关键一步。

本文将带你从零开始，在Windows系统下使用XAMPP配置多个虚拟主机，实现通过自定义域名（如 myproject.test、blog.local）独立访问不同项目，模拟真实线上部署场景,让本地开发更加专业高效。

什么是虚拟主机？

虚拟主机是 Apache HTTP Server 的一项核心功能，它允许一台物理服务器托管多个网站或应用，每个站点拥有独立的域名、文档根目录以及访问控制策略。

在本地开发环境中，我们利用这一机制，将不同的项目文件夹映射到各自的“伪域名”上。

• http://myproject.local → 指向 C:\xampp\htdocs\myproject
• http://api.test → 指向 C:\xampp\htdocs\api

这样一来，不仅可以避免路径混乱，还能真实还原多子域架构、跨域请求、SPA路由跳转等复杂场景,极大提升了调试的真实感与便利性。

配置前的准备工作

在正式操作之前,请确认以下几点已准备就绪：

1. ✅ XAMPP 已正确安装并运行

   • 推荐使用最新版本（可从 Apache Friends 官网 下载）
   • 启动 Apache 服务后，浏览器访问 http://localhost 应能正常显示欢迎页

2. ✅ 以管理员权限运行文本编辑器

   • 修改系统级配置文件需要高权限，建议使用支持“以管理员身份运行”的编辑器，如：
     • Notepad++
     • Visual Studio Code
     • Sublime Text

3. ✅ 熟悉关键配置文件的位置

   • Apache 主配置文件：C:\xampp\apache\conf\httpd.conf
   • 虚拟主机配置文件：C:\xampp\apache\conf\extra\httpd-vhosts.conf
   • 系统 Hosts 文件：C:\Windows\System32\drivers\etc\hosts

⚠️ 注意：以上路径基于 Windows 系统；若使用 macOS 或 Linux，请对应调整为 /Applications/XAMPP/... 或 /opt/lampp/...。

步骤详解：配置XAMPP虚拟主机

第一步：启用虚拟主机模块

打开 httpd.conf 文件（路径：C:\xampp\apache\conf\httpd.conf），搜索如下代码行（通常位于第470行附近）：

#Include conf/extra/httpd-vhosts.conf

将其前面的井号 删除，取消注释,修改为：

Include conf/extra/httpd-vhosts.conf

✅ 这表示 Apache 将加载额外的虚拟主机配置文件。

📌 提示：可通过快捷键 Ctrl + F 搜索关键词 “vhosts” 快速定位该行。

保存并关闭文件。

第二步：添加虚拟主机配置

进入虚拟主机专属配置文件：

C:\xampp\apache\conf\extra\httpd-vhosts.conf

在文件末尾新增以下两组 <VirtualHost> 配置（可根据实际项目增减）：

<VirtualHost *:80>
    ServerName myproject.local
    DocumentRoot "C:/xampp/htdocs/myproject"
    <Directory "C:/xampp/htdocs/myproject">
        Options Indexes FollowSymLinks Includes ExecCGI
        AllowOverride All
        Require all granted
    </Directory>
</VirtualHost>
<VirtualHost *:80>
    ServerName api.test
    DocumentRoot "C:/xampp/htdocs/api"
    <Directory "C:/xampp/htdocs/api">
        Options Indexes FollowSymLinks Includes ExecCGI
        AllowOverride All
        Require all granted
    </Directory>
</VirtualHost>

参数说明：

💡 注意：如果路径包含空格或中文字符,请务必用双引号包裹路径字符串。

第三步：修改系统 Hosts 文件

为了让操作系统识别 myproject.local 和 api.test 这类非公网域名，需修改系统的 hosts 文件。

操作步骤：

1. 使用管理员权限打开：

   C:\Windows\System32\drivers\etc\hosts

2. 在文件末尾添加以下内容：

0.0.1       myproject.local
127.0.0.1       api.test
::1             myproject.local
::1             api.test

• 0.0.1 是 IPv4 回环地址
• :1 是 IPv6 回环地址，确保兼容现代浏览器

📌 重要提醒：

• 若保存失败，请检查是否以“管理员身份”运行编辑器。
• 不要删除原有内容,只需追加新条目即可。

第四步：重启 Apache 服务

打开 XAMPP 控制面板（XAMPP Control Panel）：

1. 停止当前运行的 Apache 服务
2. 再次点击“Start”启动 Apache

🔄 此操作会重新加载所有配置文件,使新的虚拟主机设置生效。

可通过控制台日志确认无报错信息。

第五步：创建测试项目目录

在 C:\xampp\htdocs\ 下创建对应的项目文件夹：

• myproject
• api

并在每个目录中新建一个简单的 index.php 文件,内容如下：

<?php
echo "<h1>Welcome to " . htmlspecialchars($_SERVER['HTTP_HOST']) . "</h1>";
?>

🎯 使用 htmlspecialchars() 可防止XSS风险,即使是在本地测试也应养成良好编码习惯。

第六步：测试访问

打开浏览器,依次访问：

• http://myproject.local
• http://api.test

✅ 如果页面分别显示：

Welcome to myproject.local
Welcome to api.test

恭喜！你的虚拟主机已配置成功！

常见问题及解决方案

🔧 排查技巧：查看 Apache 错误日志（C:\xampp\apache\logs\error.log）获取具体错误信息。

进阶技巧：配置 HTTPS 虚拟主机（SSL/TLS）

对于需要测试安全连接（HTTPS）的项目（如OAuth登录、PWA、HSTS策略）,可以为虚拟主机启用SSL。

简要流程：

1. 启用 Apache 的 SSL 模块：

   LoadModule ssl_module modules/mod_ssl.so
   Include conf/extra/httpd