P5js save() to input field?

p5.js Libraries
1

I’m experimenting and learning about p5js for a new project I’m about to start. I got quite some processing experience but very little p5js experience. What I’m trying to do is make a SVG with p5.svg.js and trying to edit the library in such a way that I’m able to save the file to my server rather than downloading it to the webbrowser. I tried http posting the data uri to NodeJS but the problem is that I can’t turn the url into a file from there.

What would be a ideal way would be to have a hidden file input field on the page the p5js sketch is running in and have p5js input the file into the hidden field. This is off course a hacky way to do it but ideal because its all php from there on.

Would this be possible and what would be other(less hacky) ways to tackle this problem?

Edit: One way I found to do it is by putting the data uri in a text field. Other ideas are still appreciated.

1 Like
2

creating files on server by JS is not wanted for security reasons,
but how about save to google drive/dropbox/… or a SQLdatabase

3

That would probably work yes. SQL would be great even. I’m trying to setup a webshop with algorithmically created products so SQL sounds like the way to go. But how :slight_smile:

4

Can you post what you have tried?

Did you setup your server already? Is your server serving the pages or are you working with a local environment?

When you are delivering a page from a server, you can use the server to safe the files.

Kf

5

Not yet I’m setting up a Wordpress website right now, I tried doing a http post to a NodeJS server. Can post code if you’re interested.

6

Ok, so WP will be delivering the pages. Depending of what you want to store, you could use WP to store into the database. Or you can send the info to nodejs. In node, you should be able to save the file. You need to check your server provider to see what options it offers you for storage.

Kf

7

My service provider uses MariaDB so I should be able to store the data uri in the database.