关键在于通过域名区分+服务端路由实现差异化映射：一、配置www.example.com和m.example.com两个独立域名，Nginx分别绑定不同后端；二、S-UI支持基于domain的虚拟主机直连；三、单域名下可按路径前缀区分但非推荐；四、避免User-Agent识别等不可靠方式。

要实现手机端与pc端域名的差异化资源映射，关键不是靠“设备类型识别”，而是通过域名区分 + 服务端路由策略来完成。主流方案中，s-ui、nginx、apache等均不直接检测user-agent做自动跳转（这属于前端或网关层逻辑），而是依赖你主动配置不同的域名（如 m.example.com 和 www.example.com），再将它们分别指向不同后端服务或路径。

一、明确两个独立域名，各自绑定专属资源

这是最稳定、最易维护的方式。你需要：

• 注册或规划两个清晰域名：比如 www.example.com（PC端）、m.example.com（移动端）
• 在DNS服务商处为两者都添加A记录，指向同一台服务器IP（或CDN入口）
• 在Web服务器（如Nginx）中分别定义两个server块，每个块用server_name精准匹配对应域名
• 每个server块的root或proxy_pass指向不同项目目录或后端服务（例如PC版Vue站点、H5版React应用）

二、使用S-UI虚拟主机按域名路由到不同目标

S-UI支持基于域名的虚拟主机直连，适合微服务或容器化部署场景：

• 登录S-UI管理面板（默认端口2095）→ 进入「端点配置」
• 添加第一个虚拟主机端点：
  "type": "virtual", "tag": "pc-site", "domain": "www.example.com", "target": "localhost:8080"
• 添加第二个虚拟主机端点：
  "type": "virtual", "tag": "mobile-site", "domain": "m.example.com", "target": "localhost:3000"
• S-UI内置的DomainValidator中间件会自动拦截Host头不匹配的请求，确保请求严格路由到对应服务

三、进阶：单域名下按路径区分（非推荐主方案）

如果受限于品牌统一性，必须共用一个域名（如全走 example.com），可结合路径前缀实现差异映射，但需注意SEO和用户体验：

• 约定路径规则：例如 example.com/pc/xxx → PC资源，example.com/mobile/xxx → 移动资源
• Nginx中用location /pc/和location /mobile/分别代理到不同上游
• 前端需主动构造带路径的URL，或由网关层根据User-Agent做302重定向（该方式有缓存风险，且不适用于API调用）

四、补充：避免常见误区

以下做法实际不可靠或不推荐：

• 仅靠Nginx的$http_user_agent做if判断并proxy_pass——易被伪造，且违反Nginx最佳实践（if在location中慎用）
• 把所有流量导向同一后端再由Node.js/Koa动态渲染不同模板——增加服务复杂度，丧失静态资源分发优势
• 依赖手机浏览器“自动跳转m站”功能——该行为无标准，各厂商实现不一，无法控制
• 在hosts文件或本地DNS做手机端映射——仅限测试，无法对外生效