Keep apps opened on browser refresh

[mtchuenten]

Hello all,

In my OS.js installation, when I log in and launch other apps, and then refresh the browser, I'm presented with the log in form again.

Is there a way to prevent that, such that my apps remain opened even when I refresh the browser?

Thanks.

[andersevenrud]

You have to save session and log out instead of doing a refresh.

[andersevenrud]

It's possible to hook into the event bus to do automatic session saves whenever a window/app is manipulated somehow.

So maybe this could be transformed into an issue instead, because it should be fairly trivial to make this a configuration option 🤔

[andersevenrud]

Just wrote this quick and dirty example on how it might be possible right now by adding your own service:

Not tested 😅

import { debounce } from 'lodash'

export class AutoSaveSessionServiceProvider {
	constructor(core) {
		this.core = core

		this.onChange = debounce(() => core.make('osjs/session').save(), 500)

		this.listeners = [
			'osjs/window:destroy',
			'osjs/window:create',
			'osjs/window:change',
			'osjs/application:create',
			'osjs/application:destroy'
		]
	}

	destroy() {
		this.listeners.forEach(n => this.core.off(n, this.onChange))
		this.onChange = () => { /* Noop */ }
	}

	async init() {
		this.listeners.forEach(n => this.core.on(n, this.onChange))
	}
}

[mtchuenten]

Thank you for your response @andersevenrud.

Please let me know how to use it effectively, I'm probably missing something somewhere, reason why when I refresh the browser I'm still presented with the login form.

This is what I did:

1. Saved your code above in src/autoSaveSessionServiceProvider.js
2. Updated src/client/index.js as shown below:

import {
  Core,
  CoreServiceProvider,
  DesktopServiceProvider,
  VFSServiceProvider,
  NotificationServiceProvider,
  SettingsServiceProvider,
  AuthServiceProvider,
} from "@osjs/client";
import { AutoSaveSessionServiceProvider } from "../autoSaveSessionServiceProvider";

import { PanelServiceProvider } from "@osjs/panels";
import { GUIServiceProvider } from "@osjs/gui";
import { DialogServiceProvider } from "@osjs/dialogs";
import config from "./config.js";
import "./index.scss";
import myAdapter from "./auth/my-auth.js";

const init = () => {
  const osjs = new Core(config, {});

  // Register your service providers
  osjs.register(CoreServiceProvider);
  osjs.register(AutoSaveSessionServiceProvider);
  osjs.register(DesktopServiceProvider);
  osjs.register(VFSServiceProvider);
  osjs.register(NotificationServiceProvider);
  osjs.register(SettingsServiceProvider, { before: true });
  osjs.register(AuthServiceProvider, {
    before: true,
    args: { adapter: myAdapter }
  });
  osjs.register(PanelServiceProvider);
  osjs.register(DialogServiceProvider);
  osjs.register(GUIServiceProvider);
  osjs.boot();
};

window.addEventListener("DOMContentLoaded", () => init());

3. Updated src/server/index.js as shown below:

const {
  Core,
  CoreServiceProvider,
  PackageServiceProvider,
  VFSServiceProvider,
  AuthServiceProvider,
  SettingsServiceProvider,
} = require("@osjs/server");
const {
  AutoSaveSessionServiceProvider,
} = require("../autoSaveSessionServiceProvider");

const config = require("./config.js");
const osjs = new Core(config, {});

osjs.register(CoreServiceProvider, { before: true });
osjs.register(AutoSaveSessionServiceProvider, { before: true });
osjs.register(PackageServiceProvider);
osjs.register(VFSServiceProvider);
osjs.register(AuthServiceProvider);
osjs.register(SettingsServiceProvider);

const shutdown = (signal) => (error) => {
  if (error instanceof Error) {
    console.error(error);
  }

  osjs.destroy(() => process.exit(signal));
};

process.on("SIGTERM", shutdown(0));
process.on("SIGINT", shutdown(0));
process.on("exit", shutdown(0));

osjs.boot().catch(shutdown(1));

4. Ran npm run build

Regards.

[andersevenrud]

It's a client-only service.

You only need osjs.register(AutoSaveSessionServiceProvider); in your client bootstrap.

reason why when I refresh the browser I'm still presented with the login form.

Yes. This only automatically saves the session data. It does not keep your session alive.

See: os-js/osjs-client#88 and #761 (comment)

[mtchuenten]

It's a client-only service.

You only need osjs.register(AutoSaveSessionServiceProvider); in your client bootstrap.

I see. I tried client only, didn't work, then I also involved the server.

Yes. This only automatically saves the session data. It does not keep your session alive.

See: os-js/osjs-client#88 and #761 (comment)

Ok, thanks. Will check.