Heim  >  Fragen und Antworten  >  Hauptteil

Wie füge ich _token csrf global zu Laravel Inertia hinzu?

Ich habe ein Projekt mit Laravel Inertia und Vue Js. Ich habe heutzutage Probleme mit CSRF-Tokens. Ich habe die Dokumentation hier https://inertiajs.com/csrf-protection gelesen, daher sollte ich vielleicht das CSRF-Token bei jeder Trägheitsanfrage/-antwort hinzufügen.

Meine Frage ist, wie füge ich dieses _token global hinzu? Ich muss meiner Vue-Datei also nicht einzeln Token hinzufügen, da sie zu viele Dateien enthält.

Mein aktueller Skriptcode auf login.vue:

props: {
        errors: Object,
        session: Object,
        auth: Array
    },

    //define composition API
    setup(props) {
        //define form state
        const form = reactive({
            email: '',
            password: '',
        });

        //submit method
        const submit = () => {

            //send data to server
            Inertia.post('/login', {

                //data
                email: form.email,
                password: form.password,
                _token: props.auth.csrf
            });
        }

Mein HandleInertiaRequest (Middleware):

<?php

namespace AppHttpMiddleware;

use IlluminateHttpRequest;
use InertiaMiddleware;

class HandleInertiaRequests extends Middleware
{
    /**
     * The root template that's loaded on the first page visit.
     *
     * @see https://inertiajs.com/server-side-setup#root-template
     * @var string
     */
    protected $rootView = 'app';

    /**
     * Determines the current asset version.
     *
     * @see https://inertiajs.com/asset-versioning
     * @param  IlluminateHttpRequest  $request
     * @return string|null
     */
    public function version(Request $request): ?string
    {
        return parent::version($request);
    }

    /**
     * Defines the props that are shared by default.
     *
     * @see https://inertiajs.com/shared-data
     * @param  IlluminateHttpRequest  $request
     * @return array
     */
    public function share(Request $request): array
    {
        return array_merge(parent::share($request), [
            //session
            'session' => [
                'status'    => fn () => $request->session()->get('status'),
                'success'   => fn () => $request->session()->get('success'),
                'error'     => fn () => $request->session()->get('error'),
            ],
            //user authenticated
            'auth' => [
                'user'          => $request->user() ?   $request->user() : null,
                'permissions'   => $request->user() ? $request->user()->getPermissionArray() : [],
                'csrf' => $request->session()->token()
            ],
            //route
            'route' => function () use ($request) {
                return [
                    'params' => $request->route()->parameters(),
                    'query' => $request->all(),
                ];
            },
        ]);
    }
}


P粉608647033P粉608647033337 Tage vor547

Antworte allen(1)Ich werde antworten

  • P粉794851975

    P粉7948519752023-12-11 16:03:58

    在您的 Middleware/HandleInertiaRequests.php 文件中全局添加 csrf 令牌。

    /**
     * Defines the props that are shared by default.
     *
     * @see https://inertiajs.com/shared-data
     * @param  \Illuminate\Http\Request  $request
     * @return array
     */
    public function share(Request $request): array
    {
        return array_merge(parent::share($request), [
              'csrf_token' => csrf_token(),
        ]);
    }

    在您的表单中添加实例。

    <input type="hidden" name="_token" :value="this.$page.props.csrf_token">

    最后,进行调用,在下面的示例中,我使用 Inertia useForm() 函数来登录用户。

    <script setup>
      import { useForm } from '@inertiajs/vue3'
    
      const form = useForm({
        email: String,
        password: String,
        _token: String,
        processing: false,
      });
    
      let submit = () => {
        form.processing = true
        
        form.post('/login')
      }
    </script>

    Antwort
    0
  • StornierenAntwort