aspen-cloud/triplit

Synchronize between 2 clients and 1 server doesn't work

thanhnguyen2187 opened this issue · 7 comments

thanhnguyen2187 commented

Hi! Thanks for the awesome libraries/database! I'm having a strange issue with Triplit's synchronization, however: when I set up 2 clients and 1 server, it won't work at all. I'll try to provide a more minimal way to reproduce, but it basically is:

  • I set up my client application at localhost:5173, and also expose it to local network (make it reachable through 192.168.x.y:5173)
  • I set up the development server at localhost:8080, and also expose it to local network (make it reachable through 192.168.x.y:8080)
  • On my desktop, I visit my client application at localhost:5173, and set the server's URL to localhost:8080
  • On my mobile phone, I visit my client application at 192.168.x.y:5173, and set the server's URL to 192.168.x.y:8080

The synchronization won't work at all between the desktop application and the mobile phone application: I let both connect to the server, but they won't have the same data.

What do you think? Thanks again!

thanhnguyen2187 commented

After further testing, I found another scenario: the same application running on different browsers of the same device would have the same data. Does this mean Triplit is working as intended? Also, to elaborate on

The synchronization won't work at all between the desktop application and the mobile phone application: I let both connect to the server, but they won't have the same data.

The situation is:

  • Everything is in blank state:
    • The desktop application's data is cleared
    • The mobile application's data is cleared
    • The server's data is cleared (I started the development server with --storage memory)
  • Create one record in the mobile application
  • The record appears in the desktop application's data
  • Create another record in the mobile application
  • The record doesn't appear in the desktop application's data
  • On each creation server logs that it received triples
matlin commented

That's definitely odd because that's a workflow we test often. Are you seeing any errors in either client?

Might be worth trying to use the 192.168.x.y:8080 server url on both devices

thanhnguyen2187 commented

I think I found the... issue. It was because I left policy to be local-first in my fetch query. Using local-and-remote did what I expected 😅. Maybe we should add this to the FAQ/getting started

thanhnguyen2187 commented

Sorry for reopening this, but I'm facing the same issue when I deploy my server to another machine, and try to connect to it. Now, it doesn't work at all:

  • The clients are able to connect to the server
  • When I insert/delete records, the server are able to recognize TRIPLE_REQUESTS as well
  • I set policy as "local-and-remote"in all of my queries

I expose the server through a reverse-proxy of Caddy, and that should not be the case, should it?

Do you think there is anything else I can do to debug the problem further? Thanks!

thanhnguyen2187 commented

I expose the server through a reverse-proxy of Caddy, and that should not be the case, should it?

It seems to be the problem 😅. Some requests are blocked because of CORS even though I did set header Access-Control-Allow-Origin *. I'll try to investigate further

thanhnguyen2187 commented

I'm not sure if it's Caddy or Cloudflare's side, but the story went like this:

  • At first I had CORS problem as there is no header Access-Control... at all
  • I added header Access-Control-... *
  • Somehow the server returned two header Access-Control-..., one for the origin itself, another is for all (*)
  • The browser got confused, and it rejected HTTP requests while still allow web socket requests
  • I removed header Access-Control-... * and it worked correctly
matlin commented

Thanks @thanhnguyen2187 for sharing that context!

  • 😄1