How to change the default SSR port for Inertia.js

Recently I had to run two Inertia.js applications on a single server and both of these applications are using SSR. To achieve this it is necessary to use different ports, but there is a gotcha which can render incorrect data on the initial load.

TLDR; It is not enough to change the port inside the ssr.ts file, because you also need to tell Laravel to use the newly selected port. To do that you have to publish the inertia config and change it there as well.

The first application

So I need to run two Inertia.js applications on a single server and because in both cases I care about SEO I want to use SSR. I'm using Laravel together with Laravel Forge so the installation of the first application is super straight forward. Just create a new site, install the repo and to enable SSR. You can use the built-in Laravel panel on the Application tab and toggle Inertia SSR. This will create a new daemon (php artisan inertia:start-ssr) on your behalf and everything is working fine.

The second application

So far so good. You can check your app, inspect the source code and everything should work as expected. So let's repeat the same process with the second app. Everything is the same and looks like it is working. If you inspect the new daemon log though, you can see some issues about address being in use. So obviously we need to change the port and the first place where to look is the docs. It is not super clear where to find the instructions, but there is this section in the legacy docs and in there the following note:

By default, Inertia's SSR server will operate on port 13714. However, you can change this by providing a second argument to the createServer method.

So off we go to our ssr.ts and we can supply the port as the second argument to the createServer method. So createServer(..., 13715) and TADA! We are done, right?! Unfortunately not. What can happen, if you are not careful, is that you deploy and it looks like it is working. But if you carefully inspect the real source code (in Chrome: View -> Developer -> View Source) you can see data from your first app! How is that? We still need to tell Laravel to actually use the new port to talk to the SSR server.

Changing the port for Laravel

When trying to figure out how to change the port for Laravel I stumbled upon an amazing article and I have to give huge props to the author, because thanks to them I was able to fix it quickly without wasting too much time.

The key is in publishing the config file for inertia using

php artisan vendor:publish --provider "Inertia\ServiceProvider"

and then chaning the port in the url for the following property ssr.url

'ssr' => [
    'url' => 'http://127.0.0.1:13715',
],

And that's all. Now everything should work properly.

I hope this will help some of you to avoid this mistake and it'll help you to solve this issue fast. Once again, thanks to moay for the article and until next time,

Tony.