I have a weird problem with Vite.js and it only happens on Samsung Internet when I'm on development server...
Problem: page reloads automatically 3 seconds in a loop and I don't set nor write any intervals... the page reload happens at browser level.
These are unwanted reloads and I want to get rid of them.
Any Idea why it happens?
Edited asnwer:
Ok so, I looked closer to this problem and I found some possible solutions.
Samsung Internet (same as Chrome) doesn't allow unsecure websocket (ws) connections to localhost (only wss, so you should setup a TLS certificate for your local web/websocket server). However the same should work fine with Firefox.
Another reason for this error could be "overloading" the same port. Maybe other app, which you are running, uses port 3000. The solution would be to stop that process or again change the port.
Testing solution: Does the code works if you do this?
// Original line
new WebSocket(`${socketProtocol}://${socketHost}`, 'vite-hmr')
// Replace with exact url with port that you are running the app
new WebSocket("ws://localhost:3000")
It seems Samsung Internet browser disallows insecure websockets.
A workaround is to enable HTTPS in Vite with server.https, so that it creates a secure Websocket:
// vite.config.js
import { defineConfig } from 'vite'
export default defineConfig({
⋮
server: {
https: true,
}
})
Verified with Vite 2.7.13 and Samsung Internet 16.0.6.23