search

Axym-Labs / LetoReader

A free self-hostable speed reader. Highly customizable. Implements chunking (RSVP), pacing and highlighting. Modern UI and local-storage only.
https://leto.axym.org
GNU General Public License v3.0
82 stars 1 forks source link

clicks not registering - self-hosted - Nginx + VPN #5

Open duncanch89 opened 6 days ago

duncanch89 commented 6 days ago

So, here's my setup, which applies to LetoReader as well as 30+ other containerized applications

When hosting LetoReader using Nginx on the AWS VPS, I am able to load and access the page, and the external links at the top of the page function as expected, but all links/buttons relating to the functional reader application are non-responsive to clicks (play button, arrow buttons, settings cogwheel, edit button, etc). Their appearance is changing when I mouse over them, but non-responsive to any clicking.

When running the application on an instance of Nginx that exists within the same physical network (local to my home), everything works as expected. Their appears to be some issue with the connection through Tailscale between the VPS and my local machines at home, however I have not encountered this issue before and as I said I'm running 30+ other containerized applications this way before LetoReader.

Here are my docker logs for the LetoReader container:

warn: Microsoft.AspNetCore.DataProtection.Repositories.FileSystemXmlRepository[60] Storing keys in a directory '/home/app/.aspnet/DataProtection-Keys' that may not be persisted outside of the container. Protected data will be unavailable when container is destroyed. For more information go to https://aka.ms/aspnet/dataprotectionwarning warn: Microsoft.AspNetCore.DataProtection.KeyManagement.XmlKeyManager[35] No XML encryptor configured. Key {b8025124-6486-4331-aea9-9fa799c9e4ed} may be persisted to storage in unencrypted form. info: Microsoft.Hosting.Lifetime[14] Now listening on: http://[::]:8080 info: Microsoft.Hosting.Lifetime[0] Application started. Press Ctrl+C to shut down. info: Microsoft.Hosting.Lifetime[0] Hosting environment: Production info: Microsoft.Hosting.Lifetime[0] Content root path: /app warn: Microsoft.AspNetCore.HttpsPolicy.HttpsRedirectionMiddleware[3] Failed to determine the https port for redirect. [15:44:26 ERR] ReaderContext: TriggerAfterFirstRenderEvents: Could not load config (Value cannot be null. (Parameter 'value') [15:48:00 ERR] ReaderContext: TriggerAfterFirstRenderEvents: Could not load config (Value cannot be null. (Parameter 'value')

I don't believe there was anything useful in the Nginx logs, but let me know what else I can provide in terms of logs that might be helpful.

Thanks, cool app!!

DavideWiest commented 4 days ago

Hi, that's probably because SignalR can't communicate between server and client properly. The browser console has relevant info, can you share it?

duncanch89 commented 4 days ago

per our email discussion, I've given you access to my instance of the app so you are able to examine the browser console 👍

DavideWiest commented 4 days ago

Hi, I believe the problem arises from nginx, cloudflare or tailscale, most likely cloudflare. One of them blocks/ignores web sockets, as communication between server and client goes through web sockets (via SignalR), but that does not seem to happen.

This is the relevant web socket connection (taken from leto.axym.org): image You can verify that it works in the developer mode in the network section. You should see continuous data transfer every few seconds when interacting with the site (e.g. clicking buttons). (Click on the request in the network section to view its data transfer.)

I found these relevant discussions:

Unfortunately, I don't have any experience with cloudflare, tailscale, or nginx, but might be able to help with SignalR questions.