vue解决右键打开新的标签页，sessionStorage失效

问题：项目使用sessionStorage存储已登录用户的token和用户信息，当右键新打开标签页时，sessionStorage为空，需重新登录。

需求：浏览器关闭时，清空用户所有登录信息，下次打开浏览器需重新登录。

方法：我们将token保存在sessionStorage，并在每次请求服务器时将token放在请求头中来完成用户的身份认证。当用户关闭标签页，token会立即过期。

问题来了，多标签应该怎么办呢？

利用localStorage事件来跨标签页共享sessionStorage。
当用户新开一个标签页时，我们先来询问其它已经打开的标签页是不是有需要给我们共享的sessionStorage数据。如果有，现有的标签页会通过localStorage事件来传递数据到新打开的标签页中，我们只需要复制一份到本地sessionStorage即可。
传递过来的sessionStorage绝对不会保存在localStorage，从localStorage事件将数据中复制并保存到sessionStorage，这个流程是在同一个调用中完成，没有中间状态。而且数据是对应事件携带的，并不在localStorage中

(function() {

	if (!sessionStorage.length) {
		// 这个调用能触发目标事件，从而达到共享数据的目的
		localStorage.setItem('getSessionStorage', Date.now());
	};

	// 该事件是核心
	window.addEventListener('storage', function(event) {
		if (event.key == 'getSessionStorage') {
			// 已存在的标签页会收到这个事件
			localStorage.setItem('sessionStorage', JSON.stringify(sessionStorage));
			localStorage.removeItem('sessionStorage');

		} else if (event.key == 'sessionStorage' && !sessionStorage.length) {
			// 新开启的标签页会收到这个事件
			var data = JSON.parse(event.newValue),
					value;

			for (key in data) {
				sessionStorage.setItem(key, data[key]);
			}
		}
	});
})();