0

I'm using node js, to build a virtual whiteboard, where 2 or more clients can write on the board, using socket.IO module.

For the board, I used p5.js. Is there a way to save the state of the canvas (board). Whenever a client reloads the page, the contents of the board is cleared. I don't want this to happen. And idea on how this can be done?

Aditya
  • 17
  • 3
  • Have you considered saving your state to a database? If you don't want something that complicated you could save the state to something like a csv file. In either case you are probably going to want to persist to somewhere on your server. If you can describe you design a little more we can probably help. – Charlie Wallace Jun 05 '20 at 18:18
  • I tried saving it in a json file. But the file becomes very large after a while. Can you please elaborate on how to save into the database. If it is a free hand drawing, should I save each point in the database? – Aditya Aug 24 '20 at 20:53

1 Answers1

1

If you think it's not a problem to store this data in the browser, you could try using Window.localStorage. See https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage

Otherwise, you'll have to store that in your server. Well, you'll have to store in your database occasionally, anyway, if you're supposed to save the data in the long term.

Also, keep in mind that the Window.localStorage only works on a "per browser" approach. I mean, data won't be shared between different devices, for example. Thus, maybe it's a good idea to consider using both.