Network doubt

Help & Support
1

Hi, I have a doubt, i have 3 scenes in my game, login, select and game, if i put in login the oauth and network files, will they be used also in the following scenes or i need to ‘transport’ them in some way in each scene? It may be a stupid question…

2

Hi! When transitioning between scenes within a single browser tab without a page reload, authorization data is preserved automatically. Additionally, you can store the authorization token in localStorage, which will keep the user logged in even after a full page reload.

1 Like
3

Thanks for the tip i have done that, but when i switch from a scene to another all goes black, and i don’t get why since in another switch it works fine…so i’m quite at loss

4

Can you show me the code?

5

Here it is, but i will see your reply tomorrow coz too tired after a whole day of coding

Oauth2.prototype.loadSceneByName = function(sceneName) {
    var self = this;

    // trova la scena nel Scene Registry
    const sceneItem = this.app.scenes.find(sceneName);

    if (!sceneItem) {
        console.error(`Scena "${sceneName}" non trovata nel Scene Registry!`);
        return;
    }

    // carica la gerarchia della scena
    this.app.scenes.loadSceneHierarchy(sceneItem, function(err, entity) {
        if (err) {
            console.error(`Errore caricamento gerarchia scena "${sceneName}":`, err);
            return;
        }
        console.log(`Gerarchia della scena "${sceneName}" caricata con successo`);

        // carica settings della scena
        self.app.scenes.loadSceneSettings(sceneItem, function(err) {
            if (err) {
                console.error(`Errore caricamento settings scena "${sceneName}":`, err);
                return;
            }
            console.log(`Scena "${sceneName}" caricata correttamente`);

            // 🔹 Disabilita il login
            if (self.entity) self.entity.enabled = false;

            // 🔹 Nasconde la scritta "Connesso al server"
            if (window.NetworkColyseusInstance && window.NetworkColyseusInstance.statusText) {
                window.NetworkColyseusInstance.statusText.style.display = "none";
            }
            var menuEntities = self.app.root.findByTag('menu');
    for (var q = 0; q < menuEntities.length; q++) {
        if (
            menuEntities[q].name !== "DwarfM" &&
            menuEntities[q].name !== "ElfM" &&
            menuEntities[q].name !== "HalforcM"
        ) {
            menuEntities[q].enabled = true;
        }
    }
        var ui = self.app.root.findByName('UI');
    if (ui && ui.script) {
        ui.script.buttons.drawButtonsScreen();
        ui.script.CharSelect.drawCharScreen();
        console.log("🖥️ UI Select ridisegnata");
    } else {
        console.warn("⚠️ UI non trovata");
    }

            // 🔹 Attiva la camera corretta in base alla scena
            let camName = sceneName === "Select" ? "stCamera" : "LOGCamera";
            const camera = self.app.root.findByName(camName);
            if (camera) {
                camera.enabled = true;
                camera.camera.clearColor = new pc.Color(0, 0, 0); // opzionale: sfondo nero
            } else {
                console.warn("Camera non trovata:", camName);
            }
        });
    });
};
6

This code is not responsible for authentication; can I take a look at the project?

7

https://playcanvas.com/editor/project/674858
this is the project, and the link to see the issue, after you login and create a character he give a black screen
https://launch.playcanvas.com/992647?debug=true

8

The issue is that you’re implementing the connection as a regular script, whereas from an architectural standpoint, it should be designed as a singleton class. Refactor the system by replacing the script-based implementation with a singleton class.

class NetworkColyseus {
      public get isConnected(): boolean { ... }
      public async connectToServer() {...}
      public send() {....}
      public disconnect() { ... }
}

window.NetworkColyseusInstance = new NetworkColyseus();

var NetworkColyseusScript = pc.createScript('networkColyseus');

NetworkColyseusScript.prototype.initialize = function () {
    var connecter = window.NetworkColyseusInstance;
    if (connecter  && !connecter .isConnected) {
       connecter.connectToServer(...);
    }
    ...
}
1 Like
10

Thanks a lot, and i just noticed that i had 2 networkColyseus scripts attached in 2 different scenes that was causing my troubles with scene swap …gigglin
now it works, i have to keep on implementing the server now

1 Like
12

I’ve found that keeping the network messages as light as possible is usually the only way to keep things smooth in PlayCanvas, especially for mobile users.

1 Like