WebSocket is closed before the connection is established.

Hi everyone !!
I followed the example → Real Time Notification

But when I institute it to my site this error is coming !!!

Code →
Page code →

$w.onReady(function () {
 const channel = { name: 'new-item' };
    realtime.subscribe(channel, newItem);

 const channel2 = { name: 'update-item' };
    realtime.subscribe(channel2, updateItem);

 const channel3 = { name: 'remove-item' };
    realtime.subscribe(channel3, removeItem);
});

//....
async function newItem({ payload }) {
 if (payload.message === wixUsers.currentUser.id) {
        console.log("Item");
        $w('#addToDoSubmit').disable();
        $w('#saveButton').disable();
        wixData.query("List")
            .eq("userId", wixUsers.currentUser.id)
            .find()
            .then((res) => {
                $w('#addToDoSubmit').enable();
                $w('#saveButton').enable();

                items = res.items[0];
 if (items.index) {
                    Index = items.index;
                }
 if (items.toDo) {
                    toDo = items.toDo;
                    $w('#toDoRepeater').data = toDo;
                }
 if (items.inProgress) {
                    inProgress = items.inProgress;
                    $w('#inProgressRepeater').data = inProgress;
                }
 if (items.done) {
                    done = items.done;
                    $w('#doneRepeater').data = done;
                }
                setTimeout(() => newItem({ payload }), 1000);
            });
    }
}

async function updateItem({ payload }) {
 if (payload.message === wixUsers.currentUser.id) {
        console.log("Item");
        $w('#addToDoSubmit').disable();
        $w('#saveButton').disable();
        wixData.query("List")
            .eq("userId", wixUsers.currentUser.id)
            .find()
            .then((res) => {
                $w('#addToDoSubmit').enable();
                $w('#saveButton').enable();
                items = res.items[0];
 if (items.index) {
                    Index = items.index;
                }
 if (items.toDo) {
                    toDo = items.toDo;
                    $w('#toDoRepeater').data = toDo;
                }
 if (items.inProgress) {
                    inProgress = items.inProgress;
                    $w('#inProgressRepeater').data = inProgress;
                }
 if (items.done) {
                    done = items.done;
                    $w('#doneRepeater').data = done;
                }
                setTimeout(() => updateItem({ payload }), 1000);
            });
    }
}

async function removeItem({ payload }) {
 if (payload.message === wixUsers.currentUser.id) {
        console.log("Item");
        $w('#addToDoSubmit').disable();
        $w('#saveButton').disable();
        wixData.query("List")
            .eq("userId", wixUsers.currentUser.id)
            .find()
            .then((res) => {
                $w('#addToDoSubmit').enable();
                $w('#saveButton').enable();
                items = res.items[0];
 if (items.index) {
                    Index = items.index;
                }
 if (items.toDo) {
                    toDo = items.toDo;
                    $w('#toDoRepeater').data = toDo;
                }
 if (items.inProgress) {
                    inProgress = items.inProgress;
                    $w('#inProgressRepeater').data = inProgress;
                }
 if (items.done) {
                    done = items.done;
                    $w('#doneRepeater').data = done;
                }
                setTimeout(() => removeItem({ payload }), 1000);

            });
    }
}

//data.js

import { publish } from 'wix-realtime-backend';
import wixUsersBackend from 'wix-users-backend';

export function List_afterInsert(item, context) {
 const channel = { name: 'new-item' };
 let message = `wixUsersBackend.currentUser.id`;
    publish(channel, { message: message }, { includePublisher: false });
 return item;
}

export function List_afterUpdate(item, context) {
 const channel2 = { name: 'update-item' };
 let message = `wixUsersBackend.currentUser.id`;
    publish(channel2, { message: message }, { includePublisher: false });
 return item;
}

export function List_afterRemove(item, context) {
 const channel3 = { name: 'remove-item' };
 let message = `wixUsersBackend.currentUser.id`;
    publish(channel3, { message: message }, { includePublisher: false });
 return item;
}

Any idea why is this coming ???

Any idea ??

on the front end, try:

import wixRealtime from 'wix-realtime';
//..
wixRealtime.subscribe(//...
  • get rid of the unused "async"s
  • get rid of the unneeded { includePublisher: false } (on the back end

Holy WIX ( @jonatandor35 ) !!!

It works as excepted !!!
Thanks !!!

You’re welcome :slight_smile: