配置.htaccess URL重写规则后页面CSS、JS、图片资源无法加载求解

问题根因 #

配置重写规则后静态资源加载失败的核心原因有两个：

• 页面URL层级从/customer/变为/customer/dashboard/后，页面内用相对路径引用的CSS、JS、图片等资源会以当前URL的层级作为基准拼接，导致请求的资源路径和真实存放路径不匹配
• 原有重写规则没有对静态资源请求做特殊处理，部分资源请求可能被规则误拦截转发

解决方案 #

方案1：调整页面资源引用（优先选择，稳定性最高） #

不需要修改重写规则，只要调整页面内的资源引用方式即可：

• 所有静态资源使用绝对路径引用，比如把css/style.css改为/customer/css/style.css
• 也可以直接在页面<head>标签的最开头添加<base href="https://www.everyoneknows.com.my/customer/">标签，页面内所有相对路径会自动以该标签指定的地址为基准拼接，不需要逐个修改资源引用。

方案2：优化.htaccess重写规则（不方便修改页面代码时使用） #

在原有规则基础上新增静态资源跳过重写的逻辑，修改后的完整规则如下：

RewriteEngine On

RewriteCond %{HTTP_HOST} ^everyoneknows\.com\.my [OR,NC] 
RewriteCond %{SERVER_PORT} 80
RewriteRule ^ https://www.everyoneknows.com.my%{REQUEST_URI} [R=301,NE,L]

# 新增规则：所有常见格式的静态资源请求直接跳过后续重写逻辑
RewriteCond %{REQUEST_URI} \.(css|js|png|jpg|jpeg|gif|ico|svg|woff|woff2|ttf|eot)$ [NC]
RewriteRule ^ - [L]

# 实际URL外部重定向到美观URL
RewriteCond %{THE_REQUEST} \s/+(customer)/\?loc=([^\s&]+) [NC]
RewriteRule ^ /%1/%2/? [R=301,L,NE]

# 美观URL内部转发到实际访问地址
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^(customer)/([\w-]+)/?$ $1/?loc=$2 [L,QSA,NC]

生效验证注意事项 #

301重定向会被浏览器持久化缓存，修改规则后需要清空浏览器缓存再测试，否则可能看不到最新的配置效果。

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