Realtime not working on local

[MahmoodKhalil57]

Realtime data only works on pockethost.io but it is giving the following error when I try to host same exact collections but on local.
Do note that normal CRUD calls work fine on both local pocketbase and pockethost.io fine,

[ganigeorgiev]

It seems like a CORS issue. PocketBase by default allows all origins (aka. *) so my guess is that this is caused by your node server (aka. the one that serves localhost:3000).

[MahmoodKhalil57]

That's alright,

That's alright

No, sorry. You can try to:

* Access your frontend with `127.0.0.1:3000` instead of localhost to rule out hosts file misconfiguration.

   I tried this, still doesnt work

* Open the browser's "Inspect tool > Network" tab and check the failed `realtime` entry request and response data.

the request and response are both empty

* Test in incognito mode or with different browser(s) to rule out extension interference.

Doesnt work, I even tried different browsers.

I guess Ill have to use pockethost.io for testing for now since that works, and if I test this later and get it to work Ill update this thread.

[MahmoodKhalil57]

Final update for a while: I downloaded WSL Ubuntu 20.04 LTS and pocketbase for linux, and ran both the front end and pocketbase, and tried to use npm --legacy-peer-deps instead of pnpm, the issue is still unresolved, I am still getting the same errors

(note: Im working on small projects so this is just a minor inconvenience to me, I can just use pockethost.io for testing purposes, and all in all, pocketbase is a pleasure to deal with)

[ganigeorgiev]

I'm not able to reproduce it and I don't think the issue is related to PocketBase.

By default all origins are allowed, so the above error is caused by something in your local environment (firewall, antivirus software, browser extension, browser flags, etc.).

[ganigeorgiev]

The only way I'm able to reproduce /api/realtime error (which eventually could result to the above CORS error because the request wouldn't complete) is if you have multiple tabs opened with the realtime page. This is because when using SSE locally with HTTP1 it is limited by the browsers to ~6 connections (check the note in https://developer.mozilla.org/en-US/docs/Web/API/Server-sent_events/Using_server-sent_events).

[MahmoodKhalil57]

I closed all firefox tabs and opened a single incognito chrome tab and I did in fact stop getting that cors error.

I am now getting a different one. I will test a bit more in the morning on different computer and using WSL and comment the results.

[MahmoodKhalil57]

After a long thread, here is how I fixed my CORS issue

@ganigeorgiev -
"The only way I'm able to reproduce /api/realtime error (which eventually could result to the above CORS error because the request wouldn't complete) is if you have multiple tabs opened with the realtime page. This is because when using SSE locally with HTTP1 it is limited by the browsers to ~6 connections (check the note in https://developer.mozilla.org/en-US/docs/Web/API/Server-sent_events/Using_server-sent_events)."

(edit)(edit)

Listening to his advice fixed the issue when testing on chrome, but testing on firefox still occasionally got the same CORS error, but on both chome and firefox, realtime is not working in my setup regardless of CORS.

[Irvingouj]

I get similar error on the real time api, but only on firefox

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://localhost:8090/api/realtime. (Reason: CORS request did not succeed). Status code: (null).

I am pretty sure I have one firefox and one tab running, the method is called only once. how can I fix?

[ganigeorgiev]

@Irvingouj This is a very old discussion and I'm not sure how your issue is related to the above.

In any case, PocketBase by default allows all origins so if you have CORS issue it could be caused by a reverse proxy (nginx, apache, etc.), browser extension, misconfigured 3rd-party app (Netxt.js, SvelteKit, etc.).

If you are still not able to resolve your issue, please open a new Q&A discussion with more details about your project and ideally some minimal reproducible steps.