用Javascript本地保存HTML [英] Save HTML locally with Javascript

问题描述

为了安全起见，我知道JavaScript不能在文件系统中写入数据。我经常读到使用JavaScript在本地保存数据的唯一方法是cookie或 localStorage 。

但是在本地访问 （而不是通过互联网）在本地写入数据 时， （没有任何服务器语言，甚至没有任何服务器......只是本地浏览HTML文件）

例如，可以通过点击 SAVE 这里的规范答案：

用户代理应该提供暴露给上述功能的脚本的API。每次与文件系统进行交互时都会通过用户界面通知用户，使用户可以完全取消或中止交易。用户被通知任何文件选择，并可以取消这些。没有用户干预就不会对这些API进行调用。

基本上，由于安全设置，任何时候您下载文件时，浏览器将确保用户实际上想要保存该文件。浏览器并没有真正区分计算机上的JavaScript和Web服务器上的JavaScript。唯一的区别是浏览器访问文件的方式，因此在本地存储页面不会有什么区别。

解决方法：
但是，您可以将< div> 的innerHTML存储在cookie中。当用户回来时，您可以从cookie中加载它。虽然它不是完全将文件保存到用户的计算机，但它应该与覆盖文件具有相同的效果。当用户回来时，他们会看到他们上次输入的内容。缺点是，如果用户清除他们的网站数据，他们的信息将会丢失。由于忽略用户清除本地存储的请求也是一个安全问题，因此实际上没有办法解决它。

但是，您也可以请执行以下操作：

• 使用Java applet


• 使用其他类型的applet


• 创建一个桌面（非基于Web的）应用程序


• 请记住在清除网站数据时保存文件。您可以创建弹出式提醒并提醒您的提醒，或者在退出该页面时为您打开保存窗口。

使用Cookie：您可以在本地网页上使用JavaScript Cookie。只需将它放在一个文件中并在浏览器中打开即可：

 <！DOCTYPE html> 
< html> 
 
< head> 
< / head> 
 
< body> 
< p id =timesVisited>< / p> 
< script type =text / javascript> 
 var timesVisited = parseInt（document.cookie.split（=）[1]）; 
 if（isNaN（timesVisited））timesVisited = 0; 
 timesVisited ++; 
 document.cookie =timesVisited =+ timesVisited; 
 document.getElementById（timesVisited）。innerHTML =您运行此片段+ timesVisited +次。 
< / script> 
< / body> 
 
< / html> 
  

I do know that Javascript cannot write data in the filesystem, for security reasons. I have often read that the only way to save data locally with Javascript is cookies or localStorage.

But is it possible, in the very specific case when the file is accessed locally (and not through internet) to write data locally ? (without any server language, and even without any server at all... just local browsing of a HTML file)

For example, would it be possible, by clicking on SAVE here on this page ...

...that the HTML file is overwritten with its new content ? (i.e. the local HTML file should be updated when SAVE is pressed).

---

---

Is this possible to SAVE a file thanks to Javascript, when the HTML page is accessed locally?

Note: I want to be able to silently save, not propose a Download/Save dialog box in which the user has to choose where to download, then "Are you sure to want to overwrite" etc.

---

EDIT : Why this question? I would like to be able to do a HTML/JS notepad that I can run locally without any server (no apache, no php). I need to be able to save easily without having to deal with Dialog Box "Where do you want to download the file?".

解决方案

The canonical answer, from the W3C File API Standard:

User agents should provide an API exposed to script that exposes the features above. The user is notified by UI anytime interaction with the file system takes place, giving the user full ability to cancel or abort the transaction. The user is notified of any file selections, and can cancel these. No invocations to these APIs occur silently without user intervention.

Basically, because of security settings, any time you download a file, the browser will make sure the user actually wants to save the file. Browsers don't really differentiate JavaScript on your computer and JavaScript from a web server. The only difference is how the browser accesses the file, so storing the page locally will not make a difference.

Workarounds: However, you could just store the innerHTML of the <div> in a cookie. When the user gets back, you can load it back from the cookie. Although it isn't exactly saving the file to the user's computer, it should have the same effect as overwriting the file. When the user gets back, they will see what they entered the last time. The disadvantage is that, if the user clears their website data, their information will be lost. Since ignoring a user's request to clear local storage is also a security problem, there really is no way around it.

However, you could also do the following:

• Use a Java applet
• Use some other kind of applet
• Create a desktop (non-Web based) application
• Just remember to save the file when you clear your website data. You can create an alert that pops up and reminds you, or even opens the save window for you, when you exit the page.

Using cookies: You can use JavaScript cookies on a local page. Just put this in a file and open it in your browser:

<!DOCTYPE html>
<html>

<head>
</head>

<body>
  <p id="timesVisited"></p>
  <script type="text/javascript">
    var timesVisited = parseInt(document.cookie.split("=")[1]);
    if (isNaN(timesVisited)) timesVisited = 0;
    timesVisited++;
    document.cookie = "timesVisited=" + timesVisited;
    document.getElementById("timesVisited").innerHTML = "You ran this snippet " + timesVisited + " times.";
  </script>
</body>

</html>

这篇关于用Javascript本地保存HTML的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！