DEV Community
·
如何在本地主机中设置域名和子域名
💡
原文英文，约300词，阅读约需1分钟。
📝
内容提要
我在开发一个包含多个独立应用的网页应用，需要在本地模拟不同子域。假设有两个应用，分别在端口3000（NextJs前端）和5000（聊天应用）运行。首先，将域名映射添加到/etc/hosts文件中。然后，安装并导入express、vhost和http-proxy-middleware包。接着，为每个应用创建代理，设置虚拟主机，使NextJs前端可通过example.local访问，聊天应用可通过chat.example.local访问。
🎯
关键要点
- 开发一个包含多个独立应用的网页应用，需要在本地模拟不同子域。
- 假设有两个应用，分别在端口3000（NextJs前端）和5000（聊天应用）运行。
- 将域名映射添加到/etc/hosts文件中。
- 在Linux和macOS上使用sudo nano /etc/hosts，Windows上使用notepad C:\Windows\System32\drivers\etc\hosts。
- 在hosts文件中添加域名映射，例如：127.0.0.1 example.local 和 127.0.0.1 chat.example.local。
- 安装并导入express、vhost和http-proxy-middleware包。
- 为运行在端口3000的NextJs应用创建代理。
- 为运行在端口5000的聊天应用创建代理。
- 设置虚拟主机，使NextJs前端可通过example.local访问，聊天应用可通过chat.example.local访问。
- 启动代理服务器，监听80端口。
❓
延伸问答
如何在本地主机上设置域名和子域名？
首先，将域名映射添加到/etc/hosts文件中，然后安装express、vhost和http-proxy-middleware包，最后设置虚拟主机以访问不同的应用。
在Linux和macOS上如何编辑hosts文件？
在Linux和macOS上使用命令sudo nano /etc/hosts来编辑hosts文件。
如何为不同端口的应用创建代理？
使用http-proxy-middleware包创建代理，分别为运行在端口3000的NextJs应用和端口5000的聊天应用设置代理。
如何在Windows上编辑hosts文件？
在Windows上使用notepad C:\Windows\System32\drivers\etc\hosts命令来编辑hosts文件，需以管理员身份运行命令提示符。
设置虚拟主机后，如何访问不同的应用？
设置虚拟主机后，可以通过example.local访问NextJs前端，通过chat.example.local访问聊天应用。
在本地开发中使用子域名有什么好处？
使用子域名可以模拟真实的域名环境，便于开发和测试多个独立应用。
➡️
