html表单存储功能,纯前端实现保存表单数据功能

本文作者：IMWeb zzbozheng

未经同意，禁止转载

最近在用管理后台配置数据时，发现辛辛苦苦配置好的表单无缘无故地被覆盖，之后了解到由于我们都是在同一台开发机上做开发，难免会遇到其他同学做数据变更时覆盖掉自己的配置数据。于是我决定在表单配置里增加一项“配置操作”功能来解放自己双手以及惠及他人。

用什么方式保存?

找后端同学去帮忙做保存？

把配置数据都保存到 localStorage?

把配置数据都保存到本地文本？

然而看到后端同学繁忙的景象之下，默默地放弃了，所以忽略第一点。如果把数据都保存到 localStorage，那么我是不是还要做一个界面来管理这个配置数据的版本呢，而且还可以选中某个版本快速还原，但这些都需要一定的工作量，localStorage 的数据也不方便导出给别的同学。如果我只用前端技术直接把配置文件保存到本地，那前面两个问题都不存在了，还会带来一个好处就是：拿到这些文件，发布到现网时我可以直接导入，而后端同学只需要运行创建表文件和上传相关的java文件就足够了，减少后端同学的工作量。

实现方式

回想时以前做过的一个需求：当用户点击链接时是下载一个PDF文件，而不是直接使用自带的PDF阅读器打开。

使用a标签的download属性(Chrome和FF已支持)，如：

点击下载

这明显需要服务器来支持。我们知道href属性可以是一个链接，也可以是一个锚点、伪协议。

但也可以是blobURI、dataURI、fi