如何配置WEBrick使其正确显示XHTML及关联CSS

看起来你遇到的核心问题是WEBrick默认没有为.xhtml扩展名配置正确的MIME类型，再加上你尝试的代码里有一些小问题（比如覆盖了静态文件服务逻辑），导致XHTML和关联CSS无法正常加载。别担心，我们一步步来解决：

问题根源 #

WEBrick的DefaultMimeTypes哈希里默认没有.xhtml的映射，当它处理.xhtml文件时，会使用默认的application/octet-stream类型，浏览器无法正确解析这个类型的XHTML内容；另外，如果你用mount_proc('/')接管了根路径请求，会覆盖WEBrick默认的静态文件处理逻辑，导致CSS等资源无法被正确请求。

正确的配置代码 #

下面是修复后的完整代码，我会标注关键修改点：

require 'webrick'

# 关键：在创建服务器之前，添加XHTML的MIME类型映射
WEBrick::HTTPUtils::DefaultMimeTypes['xhtml'] = 'application/xhtml+xml'
# 保险起见，确认CSS的MIME类型（WEBrick默认已有，但明确设置更稳妥）
WEBrick::HTTPUtils::DefaultMimeTypes['css'] = 'text/css'

def start_webrick(config = {})
  config.update(
    Port: 5000,
    # 用File.expand_path处理路径，避免Windows下的转义或路径识别问题
    DocumentRoot: File.expand_path('\path\to\my\file\')
  )
  server = WEBrick::HTTPServer.new(config)
  
  # 处理中断信号，实现优雅关闭
  ['INT', 'TERM'].each do |signal|
    trap(signal) { server.shutdown }
  end
  
  server.start
end

start_webrick

关键修改说明 #

1. 提前设置MIME类型：必须在创建HTTPServer实例之前修改DefaultMimeTypes，因为服务器初始化时会加载这个映射，之后修改不会生效。你之前的代码里虽然注释了这行，但如果是在创建服务器之后才修改，就不会起作用。
2. 移除错误的mount_proc：你第二个代码里的server.mount_proc('/')会接管所有根路径的请求，导致WEBrick无法处理静态文件（比如CSS）的请求，所以必须去掉这个逻辑，让WEBrick默认处理静态文件服务。
3. 路径处理优化：用File.expand_path处理文档根路径，可以避免Windows下的路径转义问题，确保WEBrick能正确找到你的文件。

排查步骤（如果还是有问题） #

1. 检查浏览器开发者工具：按下F12打开开发者工具，切换到「网络」标签，刷新页面：
   • 查看.xhtml文件的Content-Type响应头，确认是application/xhtml+xml。
   • 查看CSS文件的请求状态，如果是404，说明路径引用错误；如果状态是200但Content-Type不对，检查CSS的MIME映射。
2. 确认XHTML里的CSS引用：确保XHTML文件里的CSS引用是正确的相对路径，比如<link rel="stylesheet" href="style.css">，且CSS文件和XHTML文件在同一个目录下（或者路径正确）。
3. 避免错误的响应赋值：你之前尝试的response = var是错误的，正确的赋值应该是response.body = var，但这种方式会绕过WEBrick的静态文件处理逻辑，不建议用在静态文件服务场景。

这样应该就能让WEBrick正确显示XHTML页面及其关联的CSS了。

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