Hello,

I notice that there is no bootstrap.js file generated in fresh laravel installation any more.

Furthermore the app.js is now totally empty.

Do you know if there is any reasons to this ?

V

Some suggestions :

• is Reverb installed on the same server ?

• have you a firewall that could block the access ?

• have you authenticated the user for the broadcasting ?

channelAuthorization: {
    endpoint: '/api/broadcasting/auth',
    headers: {
        'Authorization': 'Bearer ' + sessionStorage.getItem('token'),
    },
},

return Application::configure(basePath: dirname(__DIR__))
    ->withRouting(
        web: __DIR__.'/../routes/web.php',
        api: __DIR__.'/../routes/api_v1.php',
        commands: __DIR__.'/../routes/console.php',
        channels: __DIR__.'/../routes/channels.php',
        health: '/up',
    )
    ->withMiddleware(function (Middleware $middleware) {
        // $middleware->statefulApi();
    })
    ->withExceptions(function (Exceptions $exceptions) {
        //
    })
    ->withBroadcasting(
        __DIR__.'/../routes/channels.php',
        ['prefix' => 'api', 'middleware' => ['api', 'auth:sanctum']],
    )
    ->create();

(I keep getting a note saying I can't post links yet even though there aren't any links in my post so I've replaced http with hype)

I've got reverb working on my local machine. Now I'm having difficulty getting it to work on the server. I think I've finally gotten supervisor to run properly already so now my only issue is that the sockets can't be read. In the network tab of dev tools, the ws links all have the domain localhost:8080 and a status of blocked.

Not sure if the issue is with my env values

REVERB_APP_ID=396160  
REVERB_APP_KEY=ujjxjmewenx3ruqys4bf  
REVERB_APP_SECRET=ebqtdneudtyu3vategoj  
REVERB_SERVER_HOST=127.0.0.1  
REVERB_SERVER_PORT=6001  
REVERB_HOST="\<my site's url\>"  
REVERB_PORT=443  
REVERB_SCHEME=https  
BROADCAST_CONNECTION=reverb 

or with my Nginx config

server {  
  listen 80;  
  listen \[::\]:80;  
  listen 443 quic;  
  listen 443 ssl;  
  listen \[::\]:443 quic;  
  listen \[::\]:443 ssl;  
  http2 on;  
  http3 off;  
  {{ssl_certificate_key}}  
  {{ssl_certificate}}  
  server_name \<my site's url\>;  
  {{root}}  
  
  {{nginx_access_log}}  
  {{nginx_error_log}}  
  
  if ($scheme != "https") {  
    rewrite ^ hypes//$host$uri permanent;  
  }  
  
  location \~ /.well-known {  
    auth_basic off;  
    allow all;  
  }  
  
  {{settings}}  
  
  try_files $uri $uri/ /index.php?$args;  
  index index.php index.html;  
  
  location \~ \\.php$ {  
    include fastcgi_params;  
    fastcgi_intercept_errors on;  
    fastcgi_index index.php;  
    fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;  
    try_files $uri =404;  
    fastcgi_read_timeout 3600;  
    fastcgi_send_timeout 3600;  
    fastcgi_param HTTPS $fastcgi_https;  
    fastcgi_pass 127.0.0.1:{{php_fpm_port}};  
    fastcgi_param PHP_VALUE "{{php_settings}}";  
  }  
  
  location \~\* ^.+\\.(css|js|jpg|jpeg|gif|png|ico|gz|svg|svgz|ttf|otf|woff|woff2|eot|mp4|ogg|ogv|webm|webp|zip|swf)$ {  
    add_header Access-Control-Allow-Origin "\*";  
    expires max;  
    access_log off;  
  }  
  
  if (-f $request_filename) {  
    break;  
  }  
    
  location /app/ {  
    proxy_http_version 1.1;  
    proxy_set_header Host $http_host;  
    proxy_set_header Scheme $scheme;  
    proxy_set_header SERVER_PORT $server_port;  
    proxy_set_header REMOTE_ADDR $remote_addr;  
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;  
    proxy_set_header Upgrade $http_upgrade;  
    proxy_set_header Connection "Upgrade";  
    proxy_pass hype://0.0.0.0:6001;  
  }  
  location /apps {  
    proxy_http_version 1.1;  
    proxy_set_header Host $http_host;  
    proxy_set_header Scheme $scheme;  
    proxy_set_header SERVER_PORT $server_port;  
    proxy_set_header REMOTE_ADDR $remote_addr;  
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;  
    proxy_set_header Upgrade $http_upgrade;  
    proxy_set_header Connection "Upgrade";  
    proxy_pass hype://0.0.0.0:6001;  
  }  
}  

I can't use 8080 because I get this error when I try:

Failed to listen on "tcp://127.0.0.1:8080": Address already in use (EADDRINUSE)

Any help would be appreciated. Thank you.

I have added what is suggested in the Laravel documentation.

Or checkout https://github.com/spatie/laravel-csp Instead of manually managing everything

Can you paste what you have in the layout (app.blade.php)

The application is served via HTTPS in production.

Are you serving the site over https? Or are you using something like http://localhost?

Browsers ignore the secure flag of cookies on localhost. They treat *.localhost domains as special cases and don't enforce the secure requirement because it makes local development easier. But they should still respect cookie prefixes (if they're supported to begin with). If you're not using https, that would explain why your session cookies aren't working.

Oh effectively ... yes I understand ... well ... I went to this website.

https://securityheaders.com/

The diagnostic was simply that the cookie didn't have any prefix. So I read the documentation about what __Host- is and I thought that it was a good idea to add it ;).

@vincent15000 But Laravel cookies are already secure by being HTTP only, optionally HTTPS-only, restricted to path, restricted to domain, and with cross-site restrictions. So what, exactly, “enhanced security” were you trying to add here?

Yes I still get the error after npm run build.

I think what @jsanwo64 was suggesting was that any scripts tags in your vue components could reference the nonce from the window variable.

<template>
  <script :nonce="nonceValue">
    console.log('Safe inline script');
  </script>
</template>

<script setup>
const nonceValue = window. __CSP_NONCE__;
</script>

But that is assuming you have access to whatever is injecting the script.

Have you made sure the issue still exists when you run npm run build? All the vue stuff should be compiled by vite and it should put the nonce on the script for that....

choose hostinger for 2 years, it will save money. i used in fastvps for 2-3 years,, monthly 25 euro, same service i bought from hostinger 2 year only 125 usd and better & fastest

Just to enhance security.

@vincent15000 Why have you added that prefix?

Hello,

Here is my .env file.

REVERB_APP_ID=my-app-id
REVERB_APP_KEY=my-app-key
REVERB_APP_SECRET=my-app-secret

REVERB_HOST=localhost
REVERB_PORT=8080
REVERB_SCHEME=http

VITE_REVERB_APP_KEY=${REVERB_APP_KEY}
VITE_REVERB_HOST=${REVERB_HOST}
VITE_REVERB_PORT=${REVERB_PORT}
VITE_REVERB_SCHEME=${REVERB_SCHEME}

And here my app.js file.

window.Echo = new Echo({
    broadcaster: 'reverb',
    key: import.meta.env.VITE_REVERB_APP_KEY,
    wsHost: import.meta.env.VITE_REVERB_HOST,
    wsPort: import.meta.env.VITE_REVERB_PORT ?? 80,
    wssPort: import.meta.env.VITE_REVERB_PORT ?? 443,
    forceTLS: (import.meta.env.VITE_REVERB_SCHEME ?? 'https') === 'https',
    enabledTransports: ['ws', 'wss'],
});

And it works fine.

Just follow the Laravel documentation.

https://laravel.com/docs/13.x/broadcasting#client-reverb

Hello,

Here is my .env file.

REVERB_APP_ID=my-app-id
REVERB_APP_KEY=my-app-key
REVERB_APP_SECRET=my-app-secret

REVERB_HOST=localhost
REVERB_PORT=8080
REVERB_SCHEME=http

VITE_REVERB_APP_KEY=${REVERB_APP_KEY}
VITE_REVERB_HOST=${REVERB_HOST}
VITE_REVERB_PORT=${REVERB_PORT}
VITE_REVERB_SCHEME=${REVERB_SCHEME}

And here my app.js file.

window.Echo = new Echo({
    broadcaster: 'reverb',
    key: import.meta.env.VITE_REVERB_APP_KEY,
    wsHost: import.meta.env.VITE_REVERB_HOST,
    wsPort: import.meta.env.VITE_REVERB_PORT ?? 80,
    wssPort: import.meta.env.VITE_REVERB_PORT ?? 443,
    forceTLS: (import.meta.env.VITE_REVERB_SCHEME ?? 'https') === 'https',
    enabledTransports: ['ws', 'wss'],
});

And it works fine.

Just follow the Laravel documentation.

https://laravel.com/docs/13.x/broadcasting#client-reverb

import 'bootstrap';
import axios from 'axios';
window.axios = axios;

window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';

import Pusher from 'pusher-js';

import 'bootstrap';
import axios from 'axios';
window.axios = axios;

window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';

import Pusher from 'pusher-js';

const BASE = 'http://localhost/ecart/prd';
const CSRF =  document.querySelector('meta[name="csrf-token"]')?.content || window.App?.csrfToken;
console.log('🔥 CSRF USED:', CSRF);

window.pusher = new Pusher(import.meta.env.VITE_REVERB_APP_KEY, {
    wsHost: window.location.hostname,
    wsPort: 8080,
    wssPort: 8080,
    forceTLS: false,
    enabledTransports: ['ws'],
    cluster: 'mt1',
    disableStats: true,

    authEndpoint: '/broadcasting/auth', 

    auth: {
        headers: {
            'X-CSRF-TOKEN': CSRF,
            'X-Requested-With': 'XMLHttpRequest'
        }
    },

    withCredentials: true
});

```   i a m using xamp server getting below error 
chat.js:203 ❌ [Chat] Subscription error for private-chat.chat_test_1777144082 {type: 'AuthError', error: 'Unable to retrieve auth string from channel-author…r.com/docs/channels/server_api/authorizing-users/', status: 403}

@jsanwo64 @aleahy

I still get an error, probably the script concerned by this error doesn't have any nonce.

How can I be sure that all needed scripts, also the scripts that are dynamically injected by Vue, have a nonce ?

Oh thank you I didn't even know that it was specified in the Laravel docs.

I have added the nonce like mentioned in the documentation, but I get this error.

Executing inline script violates the following Content Security Policy directive 'script-src 'self' 'nonce-3E6viSgDnRw26VLveosL5pgWUz8UlQRzLZRPS736''. Either the 'unsafe-inline' keyword, a hash ('sha256-uZu30YR5Q7xMFJcsmo+SoZwQUlCrvcfNNMjBIlUPasE='), or a nonce ('nonce-...') is required to enable inline execution. The action has been blocked.

Any idea what I can do now ?

Middleware (nonce generation)

public function handle(Request $request, Closure $next): Response
{
    $nonce = base64_encode(random_bytes(16));

    app()->instance('csp_nonce', $nonce);

    $response = $next($request);

    $csp = implode('; ', [
        "default-src 'self'",
        "img-src 'self' data:",
        "script-src 'self' 'nonce-$nonce'",
        "style-src 'self' 'nonce-$nonce' https://fonts.googleapis.com",
        "font-src 'self' https://fonts.gstatic.com",
    ]);

    $response->headers->set('Content-Security-Policy', $csp);

    return $response;
}

Pass nonce to Blade (Inertia root template) In your app.blade.php (or root layout):

@php($nonce = app('csp_nonce'))

Then:

<script nonce="{{ $nonce }}">
    window.__CSP_NONCE__ = "{{ $nonce }}";
</script>

In addition to what you've done, you need to tell Vite to add the nonce in the middleware via Vite::useCspNonce().

This is from the laravel docs:

        Vite::useCspNonce();
 
        return $next($request)->withHeaders([
            'Content-Security-Policy' => "script-src 'nonce-".Vite::cspNonce()."'",
        ]);

For convenience, it's also worth using Spatie's package: https://github.com/spatie/laravel-csp

Hello,

How is it possible to add CPS headers with InertiaJS ?

I have tried this via a middleware.

public function handle(Request $request, Closure $next): Response
{
    $response = $next($request);

    $csp = implode('; ', [
        "default-src 'self'",
        "img-src 'self' data:",
        "script-src 'self' 'unsafe-inline'",
        "style-src 'self' 'unsafe-inline' https://fonts.googleapis.com/css2",
        "font-src 'self' https://fonts.gstatic.com/s/figtree/v9/",
    ]);

    if (config('app.env') !== 'local') {
        $response->headers->set('Content-Security-Policy', $csp);
    }

    return $response;
}

But unsafe-inline is not secure.

I wanted to try with a nonce, but it seems to be quite complex to do that with InertiaJS.

Any suggestion ?

Thanks for your help.

V

Ok just found, the /* updated */ part is the user input, then waiting for confirmation by the backend.

I don't understand how this works.

form.optimistic((props) => ({ category: props.category, name: form.name })).put(route('admin.categories.update', { category: props.category }));

Can you explain me please ?

form.optimistic((props) => ({
  contacts: /* updated */
})).post(url);

The ```/* updated */ part is the confirmation from the backend with updated datas ? Or is it the frontend changes done by the user ?

Hey Vincent,

You're missing a return statement in your controller. Inertia requires a redirect after a mutation (POST/PUT/PATCH/DELETE) so it can fetch the fresh page props under the hood.

public function update(Request $request, Category $category)
{
    $category->fill($request->all());
    $category->save();

    return back(); // <-- You need this
}

I have tested and it's ok, but there is a problem.

When a user navigates to another page, the authentication is lost.

check your page source which data google can get check and develop it. Google never get frontend data. somedays ago i developed a next js application which page data showing fine in frontend and pagesource failed to show these data. finally i solve it,,page source and understand the technical seo issue from: Screaming Frog SEO Spider: https://prnt.sc/qQFnPfXgOYRp

Hello,

I know that __Host- is only with an HTTPS connexion.

But this can be interesting => The __Host- spec requires the domain attribute to be completely omitted, not just null.

I set it to null as suggested in some documentation, but it didn't work.

99% of the time I see this break, it's because you are testing locally over HTTP.

The __Host- prefix tells the browser to strictly enforce HTTPS. If you're using php artisan serve or an un-secured Valet/Herd site, the browser will silently drop the cookie. Inertia then fails to authenticate because the session cookie literally doesn't exist in your browser, causing 419 or 401 errors.

'cookie' => env('APP_ENV') === 'production' 
    ? '__Host-' . Str::slug(env('APP_NAME', 'laravel'), '_') . '_session'
    : Str::slug(env('APP_NAME', 'laravel'), '_') . '_session', 

Also, triple-check your .env file. If you have SESSION_DOMAIN=localhost (or anything else), remove it entirely. The __Host- spec requires the domain attribute to be completely omitted, not just null.

Hello,

Laravel / InertiaJS / VueJS

I have added a prefix to the session cookie and it's not possible to login anymore.

'cookie' => env(
    'SESSION_COOKIE',
    '__Host-'.Str::slug(env('APP_NAME', 'laravel'), '_').'_session'
),

Why ?

Can you help me to keep this prefix ? What do you suggest me to check ?

Thanks.

V

Hello,

I'm trying to use the optimistic updates with InertiaJS v3.

https://inertiajs.com/docs/v3/the-basics/optimistic-updates#form-helper

const save = async () => {
    form.optimistic((props) => ({ category: props.category, name: form.name })).put(route('admin.categories.update', { category: props.category }));

    editMode.value = false;
    updated.value = true;
};

The updated name is displayed on the screen, but its because the page is reloaded.

But I don't want any reload.

public function update(Request $request, Category $category)
{
    $category->fill($request->all());

    $category->save();
}

Hmmm ... can someboby explain how I can use the optimistic updates properly ?

Thanks for your help.

V

In France, I recommend IONOS, I work with this company for several years and there is really no problem. They are also in the USA with specific offers.

hi i am looking for vps server located in usa to host data of my website which is on heavy cms such as ghost . i asked from chatgpt and it says that ghost and other cms can only install on vps so i need to buy this. for this i browse for this and found that hostinger provides best vps plan wiht mulltiple ram version. with 2 gb to 16 gb with good price. now i want to confirm is it ok or is ther any other hosting provider https://shorturl.at/r0AlY whcih will be good. tell me your real feedback so i can decide before i buy one.

There is Digital Ocean, Hetzner and even Laravel forge which now supports other aspects than just Laravel.

its only a good price for 12 months

Here it is.

https://laracasts.com/series?completed=1

Please add watched filter in "All series" section data is actively there and it will improve UX so much

They were on some kind of drive to turn Laravel PHP stuff into JS it felt like at one point, especially with Pest and Volt.. both of which, IMO, are a royal PITA and a mess to work with.

A clumsy and awkward approach of recreating conventional OOP logic in functional style?

Inertia SSR cannot be good or bad with SEO.

I just finished an application with its first functionalities with Laravel / InertiaJS / VueJS and SEO is very good.

SEO depends on several factors. You should check which one is responsible for a bad SEO.

What are the SEO results that you're referring to? Traffic to the website?

Two months is a very short time. If it's a brand new site, Google may offer it as a search result to its users. If the results are not relevant to users, your ranking will start to drop.

The technology of the site shouldn't matter as long as:

1. The content on your site is relevant to users.
2. The content is well structured and semantically correct.
3. The site is crawlable: every page has an address, you don't use path hacks (like #/my-route), and you use proper links with hrefs instead of JS navigation.
4. The site isn't super slow.

Note that speed isn't the most important factor from a SEO standpoint, nor is it a sliding scale where a 10% faster page is ranked higher than others. Google just uses speed to classify sites, like fast/medium/slow.

SSR or MPA sites are not inherently better than SPAs. Google is aware of how SPAs work and they take that into account. They cache assets and crawl pages in two steps: before and after JS has done loading.

There's a lot of old SEO misinformation floating about. If you want real information, check what Google has to say. I suggest the YouTube channel Google Search Central as a starting point.

SEO consultants I would avoid.

I’d check if your SSR actually returns full HTML in the page source, not just what shows with JS off. Also make sure each route sets proper meta tags and unique titles.

First test your website via Lighthouse and see which results you get from that. I have no issues with SEO and Inertia SSR.

This Youtube video presents exactly what you need: https://www.youtube.com/watch?v=lPX-BCkkoO0

Policies is great to keep all authorizations at the same place.

A service is to handle business logic, you shouldn't write any authorization code in a service.

For example, in my code :

• the services only execute the code for the business logic : get, store, update, delete, ...

• the policies contain the authorizations

• the controllers check for authorizations via the policies and then execute an action via the services

Thank you for the review, I appreciate it.

Initially I was only checking if the user had any role with the required permission in the PermissionService. Then I also wanted to identify which role the user is acting as, since it might change some actions, like different delete types or maybe save it in logs in the future. So that's why I though maybe I should also send the roleId from UI.

I'll look at the docs and links you shared to understand this better. I didn't use Policies before too, only did authorization in services, and used middleware for authentication. Thanks again!

When user goes to their roles page and go to a specific role panel, I will put the hidden roleId on forms, so I can check in authorization, if this user have this role, and if this role has the permission needed for the action. How is it? Is it a bad practice?

I agree with @jussimannisto do not use hidden fields. I suggest view some video series here on authentication and authorization. And review the documentation.

These checks are best done server side.

I also suggest taking this training: https://laracasts.com/series/laravel-from-scratch-2026

Also I gave an idea here: https://laracasts.com/discuss/channels/general-discussion/how-should-i-structure-authorization-for-owner-super-admin-community-admin-and-dynamic-roles-in-a-laravel-social-network?page=1&replyId=975679

Having same controller but a separate method for user verses admin.

My opinion :

• it depends on what you need, but it's not a bad pratice to have one controller for the superadmin and one controller for the users

• the same logic can be applied to views and routes

• to check if a user has the permission to do an action, it's not a good practice at all to only check the role id in the frontend, you have to check authorizations in the backend and the best way to do that is to write policies, inside policies you can check the roles and/or the permissions

What you name authority is a role.

In pratice a user can have one or several roles and each roles comes with some permissions. It's generally not recommended to assign permissions directly to users. The best way is to assign permissions to roles and to assign roles to users. But for fine permissions control, you can occasionally assign permissions to users if it's really needed in your application, I don't do so, but sure some cases can justify to do so.

If you need help to do all this, you can have a look at this Laracasts series.

https://laracasts.com/series/mastering-permissions-in-laravel

I have 5 types of authority:

super admin (highest), dynamic roles created by super admin, community owner, dynamic roles created by community owner, normal users,

I have separate community controller, blade views and routes for super admin and user. And I might do one more for dynamic roles. I will check the authentication from the routes with middleware. Is it okay to do these?

Users can have different roles. And if they delete their things as a user it will get soft delete, while as other role it will get status = deleted. So I have to know, as what role they are requesting this action.

When user goes to their roles page and go to a specific role panel, I will put the hidden roleId on forms, so I can check in authorization, if this user have this role, and if this role has the permission needed for the action. How is it? Is it a bad practice?

I would appreciate your guidance, this is my first time working with auth systems, so I don't know what I do might be bad practice. The project is final course project.