Javascript操作将session资料存入window.name里

查了一些资料，大家一致认为除了 Node.js 和服务端，在 JavaScript 里没有 session 这种东西（或者说很不常见），所有的变数，函式等等的资料在页面重新载入时都会被清空，不过我发现 Craig Buckler 写的 javascript session library 。

来看一下它的源代码：

/**
 * Implements cookie-less JavaScript session variables
 * v1.0
 *
 * By Craig Buckler, Optimalworks.net
 *
 */
  
 if (JSON && JSON.stringify && JSON.parse) var Session = Session || (function() {
  
  // cache window 物件
  var win = window.top || window;
   
  // 将资料都存入 window.name 这个 property
  var store = (win.name ? JSON.parse(win.name) : {});
   
  // 将要存入的资料转成 json 格式
  function Save() {
    win.name = JSON.stringify(store);
  };
   
  // 在页面 unload 的时候将资料存入 window.name
  if (window.addEventListener) window.addEventListener("unload", Save, false);
  else if (window.attachEvent) window.attachEvent("onunload", Save);
  else window.onunload = Save;
 
  // public methods
  return {
   
    // 设定一个 session 参数
    set: function(name, value) {
      store[name] = value;
    },
     
    // 列出指定的 session 资料
    get: function(name) {
      return (store[name] ? store[name] : undefined);
    },
     
    // 清除资料 ( session )
    clear: function() { store = {}; },
     
    // 列出所有存入的资料
    dump: function() { return JSON.stringify(store); }
  
  };
  
 })();

使用方法：

// 存入一个 session value/object
Session.set(name, object);
 
// 取出一个 session value/object
Session.get(name);
 
// 清除所有 session 资料
Session.clear();
  
// 列出所有 session 资料
Session.dump();

基本上它的做法是把你所有设定的 session 变数转成了 json 字串然后存入 window.name 这个 property 里。而 window.name 这个 property 在页面跳出时是不会被清除的。

这里有另一个类似的 javascript session library 叫做 sessvars  ，提供了更多的使用方法，如果你有更进阶对 javascript session 的应用也可以看一下。

Demo

这里有一个 Craig Buckler 所写的 demo 。

推荐阅读：

WebStorm怎么设置实现自动编译less文件

使用float后清除浮动的几种方法

找回Windows Server&Windows10 ltsb 图片查看器

利用CSS变量实现炫酷的悬浮效果

微信小程序动态设置标题