使用 Javascript 动态保存内容

发布于 12-02 01:44 字数 165 浏览 0 评论 0 原文

我想让我的客户能够出现一个保存对话框来保存我存储在 Javascript 中的数据。我无法将它们定向到现有文件,因为您无法直接使用 Javascript 修改文件系统。
是否可以直接发送数据进行保存(当然是通过保存对话。否则,这将是一个疯狂的利用)。我正在努力让我的用户可以在我的网站上创建内容并能够下载它。

I want to allow my clients to be able to have a save-dialogue come up to save data that I've stored in Javascript. I can't direct them to an existing file because you can't modify the file system directly with Javascript.
Is it possible to send data directly to be saved (of course through a save-dialogue. Otherwise, it would be a crazy exploit). I'm trying to make it so my users can create content on my site and be able to download it.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(5

伴随着你 2024-12-09 01:44:18

您可以使用带有 dataUrl 的链接来创建保存链接:(这需要您使用 base64 对数据进行编码)

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

您可以在 http://phpjs.org/functions/base64_encode:358

用户需要右键单击该链接并选择“另存为...”将文件保存到其文件系统上。

You could use links with dataUrl to create a save link : (this need you to encode your data using 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 at http://phpjs.org/functions/base64_encode:358 .

Users would need to right click the link and choose "save as..." to save the file on their filesystem.

孤独陪着我 2024-12-09 01:44:18

您可以创建一个保存按钮,然后提供一个下载对话框。通过允许用户再次上传文件并解析其内容,您可以加载您的应用程序。

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

在风中等你 2024-12-09 01:44:18

有几种方法可以做到这一点:

服务器端

  • 使用 "="">唯一id,并将ID提供给用户,当他想要加载时,他将提供ID,你将为他鞭打数据。
  • 帐户系统,假设您有一个帐户系统,您可以将每个表单数据链接到特定用户。
  • 以某种方式序列化数据,并将其作为可下载文件提供给用户,然后当他想要恢复时,他将上传该文件,你解析它,并为他显示它。

当然,这两种解决方案都需要 AJAX 解决方案来与服务器通信。

客户端

  • 如果您的网站是现代的(您不关心旧浏览器),您可以使用 本地存储 将他的输入保存在计算机上,然后在他返回时自动从内存中加载。请注意,浏览器支持不是很好,您应该使用 Modernizr 或类似的东西来测试它。

There are several ways of doing that:

Server Side

  • Store the serialized form data (or whatever data) in a data base with a unique id, and give the ID to the user, when he wants to load, he'll supply the ID, and you'll whip the data for him.
  • Account system, assuming you have an account system, you can link each form data to a specific user.
  • Serialize the data in a way, and give it to the user as a downloadable file, then when he wants to recover, he will upload the file, you parse 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 care about old browsers) you can use Local Storage to save his input on his computer, and then automatically load it from his memory when he returns. Note that browser support is not great, you should use Modernizr or something similar to test for it.
尤怨 2024-12-09 01:44:18

使用服务器会话并根据 DialogId 和 SessionId 存储内容怎么样?

流程:
1.用户存储信息。会话 ID[对话 ID] =
2.用户检索信息。 = session_id[dialog_id]

您可以使用 json 和 base64 来传输批量和结构信息。

What about using server sessions and storing content there based in DialogId and SessionId.

Flows:
1. user stores info. session_id[dialog_id] =
2. user retrieves info. = session_id[dialog_id]

You may use json and base64 to transmit bulk and structural info.

谜兔 2024-12-09 01:44:18

我想您想将数据保存在客户端计算机上的文件中。
你不能直接这样做,因为 JS 无法访问本地文件系统。
但你可以通过服务器来实现。你会同时
将数据发送到服务器并下载到
客户。下载后会打开通常的“另存为...”对话框,客户端可以在其中
可以指定文件名。

一个可能的具体实现是使用一个进行 POST 的表单
请求 URL save.php,传递要保存的数据
隐藏的输入字段save_data。请求的结果是
定向到不可见的

<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>

JS 函数 save() 准备要发送的数据:

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

服务器上的 PHP 页面 save.php 处理 POST 请求并下载
数据:

$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;

I suppose you want to save the data in a file on the client's computer.
You cannot do it directly because JS cannot access the local filesystem.
But you can achieve it via the server. You would at the same time
send the data to the server and download it to the
client. The download opens the usual "Save As..." dialog where the client
can specify the file name.

A possible concrete implementation uses a form that makes a POST
request to the URL save.php, passing the data to be saved in
a hidden input field save_data. The result of the request 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 function save() prepares the data to be send:

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

The PHP page save.php on the server processes the POST request and downloads 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;
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文