使用php artisan serve --host=0.0.0.0访问Laravel4.2项目时CSS显示异常

1. 修正应用域名配置 #

Laravel 4.2 生成静态资源路径时会默认读取 app/config/app.php 中的 url 配置项作为前缀，该值默认设置为 http://localhost 时，本地访问路径匹配正常，局域网其他设备访问时资源路径仍然指向本地，导致样式渲染异常。

• 打开 app/config/app.php 文件，找到 url 配置参数
• 将值修改为部署项目的虚拟机的局域网IP，示例：

'url' => 'http://192.168.3.45',

如果需要适配多场景访问，可以改成动态获取请求域名的写法：

'url' => 'http'.(isset($_SERVER['HTTPS']) && $_SERVER['HTTPS'] === 'on' ? 's' : '').'://'.$_SERVER['HTTP_HOST'],

• 执行 php artisan config:clear 清除配置缓存，重启 php artisan serve --host=0.0.0.0 服务。

2. 修正静态资源引用写法 #

排查项目模板文件中的CSS/JS引用逻辑，避免写死域名、使用强制HTTPS的资源生成方法：

• 推荐使用Laravel内置的资源生成方法，示例：

// 引入CSS
{{ HTML::style('css/your-style.css') }}
// 引入JS
{{ HTML::script('js/your-script.js') }}
// 原生写法可使用URL::asset
<link rel="stylesheet" href="{{ URL::asset('css/your-style.css') }}">

• 不要使用 secure_asset、URL::secure() 等强制HTTPS的方法，避免协议不匹配导致浏览器拦截样式解析。

3. 修复静态资源MIME类型识别问题 #

如果外部设备浏览器控制台提示CSS资源MIME类型不匹配，可在项目 public/.htaccess 文件中添加MIME类型声明：

AddType text/css .css
AddType application/javascript .js

4. 替换内置服务部署方式 #

php artisan serve 是Laravel提供的仅用于开发测试的内置服务器，Laravel 4.2版本的内置服务存在外部请求静态资源解析的已知兼容问题，如果以上方法都无效，可改用Nginx或Apache部署项目，即可解决该问题。

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