关于浏览器刷新保存数据的问题

Question

有个需求：页面有一个文本框，我在里面写了点文字，当我刷新浏览器的时候，这个文本框不清空，还是原来的文字，但是我如果在浏览器不关闭的情况下又打开了一个有这个文本框的页面，此时文本框是空的。
我本来想用cookie做，但是发现只有在浏览器关闭了以后才会清除cookie，（而我先走是在不关闭浏览器的情况下，再次打开那个页面，文本框是空的）

Answer 1

用cookie、session和localStorage不是关键，这三个都不会区分新开页和刷新页。

你需要自己写代码处理，我想到的最简单的方式是学习单页面webapp那样,给url加内容

比如你打开那个文本框的链接是 http:localhost/answer/13434。
执行下面这些步骤

• 打开之后立即判断url结尾是否有#autoSave,

• 如果没有那么把url改成这样http:localhost/answer/13434#autoSave，

• 如果有就从存储中读取之前的文本值，

• 然后你每隔60s保存一次文本框的值，存到哪里无所谓。cookie localStorage随意。

下面是我写的一个简单示例

window.onload = function(){
    if(location.href.endsWith('#autoSave')){
        load(); 
    }else{
        // 当前文本是空的，利用保存方法清空过去的信息
        save()
        location.href = location.href + '#autoSave';
    }
    setInterval(save(),60000);
}

Answer 2

存在后端session里，后端渲染页面时检查session里是否有数据，有的话直接渲染到给前端的html里，会话结束(用户关闭文稿等操作)后随session一起过期消失。

这似乎很符合你的需求

Answer 3

存到 localStorage，更改文本框内容更新值，提交成功后清空值,进到页面读取值