Close Menu
    零五网 - 为热爱技术的人而生！

    livewire/livewire.js 404 not found 的解决办法

    0
    By on Javascript, Laravel

    要修复您的浏览器收到的livewire/livewire.js（很可能在您的生产服务器上）的 404 not found 错误，您很有可能必须查看相关站点的 Web 服务器配置。

    为什么 livewire/livewire.js 返回 404 not found 错误

    Livewire 本身提供 JavaScript 服务。运行php artisan route:list命令，您将看到匹配livewire/livewire.js 的路由。

    GET|HEAD  livewire/livewire.js ................................. Livewire\Mechanisms › FrontendAssets@returnJavaScriptAsFile

    但是在 nginx 服务器上，如果您为 JavaScript 文件设置了自定义标头，那么就可能会出现问题。

        location ~ .*\.(js|css)?$
    {
        expires      12h;
        error_log /dev/null;
        access_log /dev/null;
    }

    出现此问题的原因是您提供的配置的设置方式是：当对 livewire/livewire.js 发出请求时，Nginx 会尝试将其作为静态文件提供，并检查它是否存在于文件系统上。

    但事实并非如此！该文件由 Livewire 提供。Nginx 找不到它，因此它返回了 404 错误。

    如何修复 livewire/livewire.js 404 未找到错误

    方法一、使用 Nginx

    在设置自定义标头的位置块之前添加此位置块，这将防止 Nginx 干扰此特定位置。

    location = /livewire/livewire.js {
    expires off;
    try_files $uri $uri/ /index.php?$query_string;
}

    方法二、通过将 Livewire 捆绑到您的 JavaScript 中

    在 Livewire v3 中，默认情况下代码会自动注入。

    我们可以不采用这种默认方式，而是以更传统的方式执行操作。

    进入 resources/js/app.js 文件，并添加以下代码：

    import { Livewire } from '../../vendor/livewire/livewire/dist/livewire.esm'
 
Livewire.start()

    这样 Livewire 将被初始化，并且还将启动Alpine.js，默认情况下，它包含在 Livewire v3 中。

    方法三、创建符号连接

    20240417 更新：可以在项目根目录中运行下面的命令，创建 vendor/livewire/livewire/dist 到 public/livewire 的符号连接来解决 livewire/livewire.js 404 not found 的问题。

    ln -s ../vendor/livewire/livewire/dist ./public/livewire

    相关推荐