Storing content dynamically with Javascript

I want my clients to have a save dialog in order to save the data that I saved in Javascript. I cannot direct them to an existing file because you cannot directly modify the file system using Javascript.
Is it possible to send data directly for saving (of course, through the save dialog, otherwise it would be a crazy exploit). I'm trying to make it possible for my users to create content on my site and be able to upload it.

+4
source share
5 answers

You can use links with dataUrl to create a save link: (you will need to encode your data with base64)

var a = document.createElement('a'); a.href = "data:text/plain;base64,"+base64_encode("plop"); a.innerHTML = "save"; document.body.appendChild(a); 

You can get the base64_encode function http://phpjs.org/functions/base64_encodehaps58 .

Users will need to right-click on the link and select "save as ..." to save the file to their file system.

+2
source

You can create a save button and then offer a download dialog. And by allowing users to download the file again and analyze its contents, you can download your application.

+1
source

There are several ways to do this:

Server side

  • Store the data in the form of a serialized form (or any other data) in the database with a unique identifier and give the identifier to the user, when he wants to download, he will provide the identifier, and you will beat the data for him.
  • Accounting system, provided that you have an accounting system, you can associate the data of each form with a specific user.
  • Serialize the data in this way and transfer it to the user as a downloadable file, and then when he wants to restore it, he will upload the file, you will analyze it and display it for him.

Of course, both solutions require an AJAX solution to communicate with the server.

Client side

  • If your site is modern (you don’t need old browsers), you can use Local Storage to save its entry on your computer and then automatically load it from memory when it returns. Please note that browser support is low, you should use Modernizr or something similar to testing.
+1
source

How about using server sessions and storing content where DialogId and SessionId are located.

streams: 1. The user stores information. session_id [dialog_id] = 2. The user receives information. = session_id [dialog_id]

You can use json and base64 to convey voluminous and structural information.

+1
source

Suppose you want to save data in a file on a client computer. You cannot do this directly, because JS cannot access the local file system. But you can achieve this through the server. You would at the same time send the data to the server and upload it to the client. Downloading opens the usual "Save As ..." dialog, where the client can specify the file name.

A possible concrete implementation uses a form that makes the POST request the save.php URL, passing the data that will be saved to the save_data hidden input save_data . The query result is directed to an invisible <iframe> .

 <form action="save.php" method="post" target="save_target" onsubmit="save();"> <input type="hidden" id="save_data" name="save_data" value="" /> </form> <iframe id="save_target" name="save_target" src="#" style="display:none; width:0; height:0; border:0px solid #fff;"> </iframe> 

The JS save() function prepares the data for sending:

 function save() { document.getElementById("save_data").value = ...; return true; // or false if something wrong }; 

The PHP save.php on the server processes the POST request and loads the data:

 $data = $_POST['save_data']; $size = strlen($data); $contentType = "text/plain"; // MIME type $defaultName = "x.txt"; header("Content-Type: $contentType"); header("Content-Disposition: attachment; filename=$defaultName"); header("Content-Length: $size"); echo $data; 
+1
source

Source: https://habr.com/ru/post/1369481/


All Articles