Laravel 5.7 - CSS 和 JS 不使用 URL::asset 加载答案

【问题标题】：Laravel 5.7 - CSS and JS not loading using URL::assetLaravel 5.7 - CSS 和 JS 不使用 URL::asset 加载
【发布时间】：2021-08-27 15:43:02
【问题描述】：

我是 laravel 的新手。我在本地系统上设置了 laravel 5.7，并将 js 和 css 放入公共文件夹，但是当在浏览器上点击我的网站 url 时，网站没有加载任何 css 和 js。

网站结构：

app
bootstrap
config
database
public
 -css
 -js
 -images
resources
 -views
    -includes
    -layouts
    -pages
routes
tests
vendor
index.php
server.php
.env

注意：我已经剪切了 .htaccess 和 index.php 文件并将它们放在 root 上以运行站点，而不在路径中公开。

这是我调用 url 的方式： CSS：

{{ URL::asset('css/style.css') }}

JS：

{{ URL::asset('js/query-1.11.1.min.js') }}

查看源代码时，url 是这样的：

http://localhost/mysite/css/style.css

那么有人可以帮我解决这个问题吗？

提前致谢。

【问题讨论】：

试试“{{asset('css/custom.css') }}”
@Ankit 如果您仍处于开发模式，我看不出您讨厌 URL 中的public 的原因？您可以在您的机器上创建一个虚拟主机并开始编码。当您上线时，您只需将您的域指向公用文件夹本身。因此，您永远不会在您的域 URL 中获得 public。
@vivek_23 感谢您的建议。现在我再次将 .htaccess 和 index.php 放入公用文件夹，现在一切正常。再次感谢。
@Ankit 欢迎。现在，出于安全原因，将除public 文件夹之外的所有文件夹放在public_html 之外，并使用$app 等的正确路径编辑public/index.php。

标签： php laravel laravel-5.7

【解决方案1】：

asset() 帮助程序将基本 URL 附加到您提供的路径之前。

基本 URL 是 index.php 的位置（在本例中为：http://localhost/mysite/）。

如果你不想在 /public 中使用 index.php，你需要在你的资产路径中使用 public/，像这样：

asset("public/css/style.css")

js文件也一样，希望大家理解。

【讨论】：

这将适用于本地开发，但不适用于生产，因为他将从 url 中删除 public
@cbaconnier 你能进一步解释一下吗？请。
我们可以假设@Ankit 浏览localhost/mysite/public，因为index.php 也在公共文件夹中。在生产环境中，您想浏览 example.com 而不是 example.com/public 这就是为什么 laravel 提供多种服务方式，而不会在 url 中暴露 public 文件夹。看我的回答
@cbaconnier 很好，我对生产服务器不太熟悉。但是，一件事是 css 和 js 文件的 url 有什么问题，因为我们在路由中定义的路由中没有 public 关键字？
您将域example.com 指向index.php 所在的文件夹mysite/public。除此之外，asset('public/css/... '); 将生成 URL example.com/public/css/...，但由于您的域已经指向 public，它会抛出 404，因为您的资产实际上位于地址 example.com/css/...

【解决方案2】：

你有 3 种可能性

使用像Valet这样的工具
使用VirtualHost
或者最简单的，在你的项目中使用命令php artisan serve并浏览 http://localhost:8000 见Local Development Server

编辑：我忘了Homestead

【讨论】：

【解决方案3】：

在剪切.htaccess 和index.php 文件时，必须将公用文件夹作为路径。试试这个：

css
{{ URL::asset('public/css/style.css') }}
js
{{ URL::asset('public/js/query-1.11.1.min.js') }}

【讨论】：

【解决方案4】：

你已经直接放了你的css和js，所以你必须试试这个资产href="{{ assets('')}}"函数。

<link href="{{ asset('css/invoice.css') }}" rel="stylesheet" type="text/css"/>

还有js

<script type="text/javascript" src="{{ asset('js/word.js') }}"></script>

【讨论】：

【解决方案5】：

对于 JAVASCRIPT：

<script type="text/javascript" src="{{ URL::asset('js/query-1.11.1.min.js') }}"></script>

对于 CSS ：

<link href="{{ URL::asset('css/style.css') }}" rel="stylesheet" type="text/css" >

注意： 如果您的目录结构如下所示，这将起作用：/public/css/style.css 或 /public/js/query-1.11 .1.min.js

【讨论】：

我试过了，但它不起作用。实际上我从公共文件夹中删除了 .htaccess 和 index.php 并将这些文件放在根目录下以运行没有公共的站点。
你真的不应该从根目录运行你的网站，这会暴露你的.env文件

【解决方案6】：

在 .env 文件中添加新行

ASSET_URL=public

我通过这种方式解决了这个问题。

【讨论】：

【解决方案7】：

在您的根文件夹上创建 .htaccess 并写下：

<IfModule mod_rewrite.c>
    RewriteEngine On
    RewriteCond %{HTTP_HOST} ^localhost$ [NC]
    RewriteRule ^(.*)$ public/$1 [L,NC] 
</IfModule>

【讨论】：