inertiajs - 如何在 Inertiajs2 应用程序中创建和使用 404.vue？

Question

我如何使用 laravel、Inertiajs2、vuejs3 捕获无效的 url？如果我创建文件

resources/views/errors/404.blade.php

它被触发了吗，但我不喜欢在这种情况下使用 Blade 文件...

附加信息:

我修改了文件 app/Exceptions/Handler.php

类处理程序扩展异常处理程序{

...
public function render($request, Throwable $e)
{
    $response = parent::render($request, $e);

    // I commented environment checking for development
    if ( /*!app()->environment(['local', 'testing']) &&*/ in_array($response->status(), [500, 503, 404, 403])) {

        // As I want to show separate file for any error I try 404
        return Inertia::render('404', ['status' => $response->status()])
                      ->toResponse($request)
                      ->setStatusCode($response->status());
    } else if ($response->status() === 419) {
        return back()->with([
            'message' => 'The page expired, please try again.',
        ]);
    }

    return $response;
}

我创建了一个文件 resources/js/Pages/404.vue，其中包含以下行:

<template>

    <frontend-layout>

        resources/js/Pages/404.vue

    </frontend-layout>


</template>

<script>
import FrontendLayout from '@/Layouts/FrontendLayout'

import {ref, computed, onMounted} from 'vue'
import { defineComponent } from 'vue'

export default defineComponent({
    name: '404Page',
    components: {
        FrontendLayout,
    },
    setup() {
        function HomeOnMounted() {
        } // function HomeOnMounted() {

        onMounted(HomeOnMounted)

        return { // setup return
            // Page state
        }
    }, // setup() {

})
</script>

我得到了错误:

[2022-05-18 09:52:14] local.ERROR: Uncaught InvalidArgumentException: View [app] not found. in /ProjectPath/vendor/laravel/framework/src/Illuminate/View/FileViewFinder.php:137
Stack trace:
    #0 /ProjectPath/vendor/laravel/framework/src/Illuminate/View/FileViewFinder.php(79): Illuminate\View\FileViewFinder->findInPaths()
#1 /ProjectPath/vendor/laravel/framework/src/Illuminate/View/Factory.php(137): Illuminate\View\FileViewFinder->find()
#2 /ProjectPath/vendor/laravel/framework/src/Illuminate/Routing/ResponseFactory.php(87): Illuminate\View\Factory->make()
#3 /ProjectPath/vendor/laravel/framework/src/Illuminate/Support/Facades/Facade.php(337): Illuminate\Routing\ResponseFactory->view()
#4 /ProjectPath/vendor/inertiajs/inertia-laravel/src/Response.php(113): Illuminate\Support\Facades\Facade::__callStatic()
#5 /ProjectPath/app/Exceptions/Handler.php(52): Inertia\Response->toResponse()
#6 /ProjectPath/vendor/laravel/framework/src/Illuminate/Foundation/Bootstrap/HandleExceptions.php(220): App\Exceptions\Handler->render()
#7 /ProjectPath/vendor/laravel/framework/src/Illuminate/Foundation/Bootstrap/HandleExceptions.php(197): Illuminate\Foundation\Bootstrap\HandleExceptions->renderHttpResponse()
#8 /ProjectPath/vendor/laravel/framework/src/Illuminate/Foundation/Bootstrap/HandleExceptions.php(255): Illuminate\Foundation\Bootstrap\HandleExceptions->handleException()
#9 [internal function]: Illuminate\Foundation\Bootstrap\HandleExceptions->Illuminate\Foundation\Bootstrap\{closure}()
#10 {main}
thrown {"exception":"[object] (Symfony\\Component\\ErrorHandler\\Error\\FatalError(code: 0): Uncaught InvalidArgumentException: View [app] not found. in /ProjectPath/vendor/laravel/framework/src/Illuminate/View/FileViewFinder.php:137
    Stack trace:
        #0 /ProjectPath/vendor/laravel/framework/src/Illuminate/View/FileViewFinder.php(79): Illuminate\\View\\FileViewFinder->findInPaths()
    #1 /ProjectPath/vendor/laravel/framework/src/Illuminate/View/Factory.php(137): Illuminate\\View\\FileViewFinder->find()
    #2 /ProjectPath/vendor/laravel/framework/src/Illuminate/Routing/ResponseFactory.php(87): Illuminate\\View\\Factory->make()
    #3 /ProjectPath/vendor/laravel/framework/src/Illuminate/Support/Facades/Facade.php(337): Illuminate\\Routing\\ResponseFactory->view()
    #4 /ProjectPath/vendor/inertiajs/inertia-laravel/src/Response.php(113): Illuminate\\Support\\Facades\\Facade::__callStatic()
    #5 /ProjectPath/app/Exceptions/Handler.php(52): Inertia\\Response->toResponse()
    #6 /ProjectPath/vendor/laravel/framework/src/Illuminate/Foundation/Bootstrap/HandleExceptions.php(220): App\\Exceptions\\Handler->render()
    #7 /ProjectPath/vendor/laravel/framework/src/Illuminate/Foundation/Bootstrap/HandleExceptions.php(197): Illuminate\\Foundation\\Bootstrap\\HandleExceptions->renderHttpResponse()
    #8 /ProjectPath/vendor/laravel/framework/src/Illuminate/Foundation/Bootstrap/HandleExceptions.php(255): Illuminate\\Foundation\\Bootstrap\\HandleExceptions->handleException()
    #9 [internal function]: Illuminate\\Foundation\\Bootstrap\\HandleExceptions->Illuminate\\Foundation\\Bootstrap\\{closure}()
    #10 {main}
    thrown at /ProjectPath/vendor/laravel/framework/src/Illuminate/View/FileViewFinder.php:137)
[stacktrace]
#0 /ProjectPath/vendor/laravel/framework/src/Illuminate/Foundation/Bootstrap/HandleExceptions.php(244): Symfony\\Component\\ErrorHandler\\Error\\FatalError->__construct(message: '...', code: '...', error: '...', traceOffset: '...', traceArgs: '...', trace: '...')
#1 /ProjectPath/vendor/laravel/framework/src/Illuminate/Foundation/Bootstrap/HandleExceptions.php(231): Illuminate\\Foundation\\Bootstrap\\HandleExceptions->fatalErrorFromPhpError(error: '...', traceOffset: '...')
#2 /ProjectPath/vendor/laravel/framework/src/Illuminate/Foundation/Bootstrap/HandleExceptions.php(255): Illuminate\\Foundation\\Bootstrap\\HandleExceptions->handleShutdown()
#3 /ProjectPath/vendor/laravel/framework/src/Illuminate/Foundation/Bootstrap/HandleExceptions.php(0): Illuminate\\Foundation\\Bootstrap\\HandleExceptions->Illuminate\\Foundation\\Bootstrap\\{closure:/ProjectPath/vendor/laravel/framework/src/Illuminate/Foundation/Bootstrap/HandleExceptions.php:254-256}()
#4 {main}
"} 


as I have 3 layouts (without default app) I have 3 files :
resources/views/layouts/adminlte.blade.php
resources/views/layouts/frontend.blade.php
resources/views/layouts/user.blade.php

在 app/Http/Middleware/HandleInertiaRequests.php 中我有:

public function rootView(Request $request)
{

    if ($request->segment(1) == 'user') {
        return 'layouts/user';
    }
    if ($request->segment(1) == 'admin') {
        return 'layouts/adminlte'; 
    }

    return 'layouts/frontend'; 
}

我又添加了一个文件:/resources/views/layouts/app.blade.php

但我仍然有错误:

 View [app] not found

看起来所有默认错误代码都需要标准的/resources/views/layouts/app.blade.php 文件，但是为什么我添加这个文件后还是报错？

附加信息#2:检查提供的链接，我看到使用了 vendor 下的文件项目/供应商/laravel/framework/src/Illuminate/Foundation/Exceptions/views/404.blade.php

是否有办法将此文件复制到 Project/resources/views/vendor/下并且必须是此文件的路径？

文件resources/js/Pages/error.vue打不开，即使有代码在

app/Exceptions/Handler.php :
    return Inertia::render('error', ['status' => $response->status()])
        ->toResponse($request)
        ->setStatusCode($response->status());

提前致谢!

Answer 1

Inertia.js docs 中描述了错误处理.

您需要扩展 App\Exceptions\Handler.php 中的 render() 方法，以便它在遇到错误时将惯性响应发送回客户端。

仅在某些情况下返回惯性响应很重要，因为这样做会阻止默认的 Laravel 错误处理运行，并且您不会在开发过程中获得有用的调试信息。下面的代码仅在生产中返回惯性响应。

use Throwable;
use Inertia\Inertia;

/**
 * Prepare exception for rendering.
 *
 * @param  \Throwable  $e
 * @return \Throwable
 */
public function render($request, Throwable $e)
{
    $response = parent::render($request, $e);

    if (!app()->environment(['local', 'testing']) {
        return Inertia::render('Error', ['status' => $response->status()])
            ->toResponse($request)
            ->setStatusCode($response->status());
    }

    return $response;
}