如何修复Chrome浏览器中“Not allowed to load local resource”错误（PHP项目加载CSS文件场景）

DevOps 小满

2026-4-29

解决PHP项目中CSS本地资源加载被浏览器阻止的问题

这个问题的核心原因很明确：你输出的是本地文件系统的绝对路径（比如C:/wamp64/www/Clearence_Form/...），浏览器会把它解析成file://协议的资源，但你的页面是通过http://协议（比如http://localhost/...）访问的。出于安全策略，浏览器禁止从HTTP页面加载本地file://资源，这就是控制台报错的原因。

下面是几个可行的解决方法：

改用网站URL根路径，而非本地文件路径
你的ROOT变量现在存储的是本地服务器的项目文件路径，这是错误的。你需要把它改成网站的HTTP URL根路径。比如：
```
// 动态生成网站根URL（推荐，适配不同环境）
$ROOT = 'http://' . $_SERVER['HTTP_HOST'] . '/Clearence_Form/';
```
这样你的link标签会输出：
```
<link href="http://localhost/Clearence_Form/views/frontend/assets/css/font-awesome.css" rel="stylesheet">
```
浏览器会通过HTTP请求正常加载资源，不会触发安全限制。
使用网站根相对路径
如果你的项目部署在http://localhost/Clearence_Form/，可以直接用斜杠开头的相对路径（相对于网站根目录），不需要依赖ROOT变量：
```
<link href="/Clearence_Form/views/frontend/assets/css/font-awesome.css" rel="stylesheet">
```
要是你给WAMP配置了虚拟主机，把Clearence_Form设为网站根目录（比如域名clearence-form.local），路径可以更简洁：
```
<link href="/views/frontend/assets/css/font-awesome.css" rel="stylesheet">
```
使用文件相对路径
如果你的当前PHP文件位于views/frontend/目录下，直接用相对路径指向CSS文件也可以：
```
<link href="./assets/css/font-awesome.css" rel="stylesheet">
```
这种写法适合小型项目，但路径层级变化时需要调整，灵活性稍差。