how to make it work with Laravel Valet --secure #8
Comments
|
When using a local certificate - and not a reverse proxy - you need to set the I will update the documentation |
|
I have added these two lines in the bootstrap.js And I then ran npm install && npm run production in the demo project repository I still get similar errors as before. With the default null values of websockets.php as well as the values I showed in my first post. In both cases I still get errors and the realtime doesn't work Any more help would be appreciated to get this working with Laravel Valet using the --secure flag Thanks |
|
Oh, my bad. You also need to specify the Laravel Valet CA file and disable certificate validation: This is what my config file looks like: 'ssl' => [
/*
* Path to local certificate file on filesystem. It must be a PEM encoded file which
* contains your certificate and private key. It can optionally contain the
* certificate chain of issuers. The private key also may be contained
* in a separate file specified by local_pk.
*/
'local_cert' => '/Users/marcel/.config/valet/Certificates/laravel-websockets-demo.test.crt',
/*
* Path to local private key file on filesystem in case of separate files for
* certificate (local_cert) and private key.
*/
'local_pk' => '/Users/marcel/.config/valet/Certificates/laravel-websockets-demo.test.key',
/*
* Passphrase with which your local_cert file was encoded.
*/
'passphrase' => null,
'verify_peer' => false,
'cafile' => '/Users/marcel/.config/valet/CA/LaravelValetCASelfSigned.pem',
], |
|
Sorry to bother you again @mpociot but it still isn't working despite following all your instructions. I updated to the latest version of Valet (2.1.3) because I think the version I was previously on (2.0.12) wasn't generating these /CA/ files (.pem and .key) I noticed that doing so changed the default location of my .valet folder tom ~/.valet to ~/.config/valet All good so far. From a vanilla git clone of your laravel-websockets-demo, I have added the two extra lines to the bootstrap.js followed by npm install and npm run production Then I modified my websockets.php to look exactly like yours (but with my username of course) I pass it the site's .crt and site's .key and I pass it the /CA/LaravelValetCASelfSigned.pem (which there is only one of) Out of curiosity, I looked for the string 'cafile' in both /vendor/react and ./vendor/beyondcode And there is no instance of the string 'cafile' anywhere which leads me to believe this may be the wrong key? I continue to get a websocket connection error as well as another error when I try to type in a message. Here's the error stack for that error Your help is appreciated. Thanks |
|
The laravel-websockets dashboard also needs to have its code modified in order to be able to connect to this server.. like so: Same two lines need to be added.. except that this is a vendor file so.. it probably requires a configuration switch |
|
Ok so to recap.. at this point this is my bootstrap.js I've rebuilt the app.js This is in my websockets configuration file I am now seeing activity in the console, as well as the dashboard, when I load the page, and also when I'm typing in the message field.. so we're almost there. I am also now seeing both chat participants, and I can see the typing indicator, on the chat page itself.. so nearly everything works But when I actually submit a message, I get an error 500 on /messages with the long error I posted above. |
That's because internally we just pass the complete ssl configuration array to create the secure socket. The configuration keys available are from PHP itself - see http://php.net/manual/en/context.ssl.php Okay - so now you got the websocket connection working but when Laravel tries to broadcast messages to the WebSocket server, it is still using http as a protocol - not https. Specifically you need to change the |
|
I was just about to come here and write that after reading the docs, I noticed that I had forgotten this step.. so I did do that, changed the scheme to https.. cleared my config cache and restarted my websockets serve.. unfortunately that does not solve the problem.. |
|
and yea I read the context options and understood that's why I couldn't find a reference to 'cafile' I also tried adding a few other options unfortunately that didn't help, I have since commented those back out |
|
@vesper8 okay...did some more digging in the Pusher PHP SDK code. Since the Valet certificate is self-signed we need to tell the Pusher SDK to ignore the certificate checking. You can do this using these options in your 'pusher' => [
'driver' => 'pusher',
'key' => env('PUSHER_APP_KEY'),
'secret' => env('PUSHER_APP_SECRET'),
'app_id' => env('PUSHER_APP_ID'),
'options' => [
'cluster' => env('PUSHER_APP_CLUSTER'),
'encrypted' => true,
'host' => '127.0.0.1',
'port' => 6001,
'scheme' => 'https',
'curl_options' => [
CURLOPT_SSL_VERIFYHOST => 0,
CURLOPT_SSL_VERIFYPEER => 0,
]
],
], |
|
amazing! victory!! That solved it. Thanks Marcel! Hope this helps others that use Valet and want to test things under https so there's no surprises when they goto production So now the docs can be improved with these details. And the issue of the dashboard needing modification "laravel-websockets/resources/views/dashboard.blade.php" this needs to be addressed.. probably through a configuration switch? two small things I noticed that could also be improved in regards to the laravel-websockets debug dashboard. The dropdown should select an app by default so the user can just click 'connect' right away, currently it is left blank even if there's only one item And when events such as App\Events\MessageSent are fired and shown in the debug dashboard.. it would be nice to be able to inspect the payload.. Pusher's dashboard lets you do that Cheers!! Thanks for this awesome contribution!! |
|
I'm already adding a Valet section for the SSL configuration of the documentation :)
I'll just add
Good catch. Fixed it.
Yeah..still needs to be added :) |
|
By the way, now that I have it working, I wanted to see which settings I could remove. And it turns out the 'cafile' => .pem is not needed inside the websockets.php |
|
I also noticed that with the demo, the stats don't seem to be working. I even tried setting disableStats to false in case that was related. The websockets_statistics_entries never gets any record added to it and the graph never gets any data, despite having two active connections for many minutes and many messages sent also.. doesn't the snapshot every 60 second require a scheduled command to be added? similar to how Laravel Horizon does it for snapshots |
|
Is your APP_URL correct? |
|
My APP_URL was not set correctly in .env I have set it now too APP_URL=https://websockets-demo.dev which is correct I've been watching it for over two minutes, with two connected users in the chatroom and many messages sent between the two.. and there hasn't been any stat records added to the table or activity on the graph do I need to set disabledStats to false in either the dashboard.blade.php or the bootstrap.js ? |
|
Mh no - it's the same issue. The internal POST request from the WebSocket Server to Laravel fails because of the self-signed certificate. You can't modify this right now, so we will have to fix that. |
|
sweet. thanks! keep up the fine work |
I am trying to get the demo to work and it is not. I figure it must be because by default all my valet sites use the --secure flag
I get this red error
I went into the websockets.php config file and tried to pass it the crt and key files:
This changes the error and is no longer red, but it still doesn't work
The text was updated successfully, but these errors were encountered: