符合中小企业对网站设计、功能常规化式的企业展示型网站建设
本套餐主要针对企业品牌型网站、中高端设计、前端互动体验...
商城网站建设因基本功能的需求不同费用上面也有很大的差别...
手机微信网站开发、微信官网、微信商城网站...
无bug,不程序:作为程序员的我,不是修bug就是在写bug的路上。
创新互联公司是一家网站设计制作、成都做网站,提供网页设计,网站设计,网站制作,建网站,按需求定制制作,网站开发公司,自2013年创立以来是互联行业建设者,服务者。以提升客户品牌价值为核心业务,全程参与项目的网站策划设计制作,前端开发,后台程序制作以及后期项目运营并提出专业建议和思路。
移动端sessionStorage缓存失效是我“印象最深的一个bug”之一,为啥呢,因为这个问题导致我加班到很晚。在现在看来就是一个简单的概念问题。
在我刚工作的时候,公司还没有招到前端工程师,于是作为后端工程师的我开始了不怎么愉快地前端之旅,不知道大家是否理解自学新语言的苦,里面的坑简直能让人自闭。
作为我兼职前端的第一个bug:“移动端sessionStorage缓存失效”,没错,就是概念没理解透,导致在App里面获取后为null(这里的App是一个jQuery Mobile盒子套html),在PC端是正常的。
因为sessionStorage的生命周期是仅在当前会话下有效,移动端切换页面是关闭原页面打开新页面,知道sessionStorage特性的朋友看到这里是不是瞬间理解了?
解决方案,我们知道sessionStorage被清空的原因是:移动端切换页面是关闭原页面打开新页面,因此,在做移动端的时候,可以采用localStorage保存数据,使用完后再清空localStorage。
当然,如果是在同一个页面中,sessionStorage的使用是没有任何问题的。
我们一起看一下sessionStorage和localStorage的概念,深入了解一下:
1、生命周期:localStorage的生命周期是永久的,关闭页面或浏览器之后localStorage中的数据也不会消失。localStorage除非主动删除数据,否则数据永远不会消失。
sessionStorage的生命周期是仅在当前会话下有效。sessionStorage引入了一个“浏览器窗口”的概念,sessionStorage是在同源的窗口中始终存在的数据。
只要这个浏览器窗口没有关闭,即使刷新页面或者进入同源另一个页面,数据依然存在。但是sessionStorage在关闭了浏览器窗口后就会被销毁。同时独立的打开同一个窗口同一个页面,sessionStorage也是不一样的。
2、存储大小:localStorage和sessionStorage的存储数据大小一般都是:5MB。
3、存储位置:localStorage和sessionStorage都保存在客户端,不与服务器进行交互通信。
4、存储内容类型:localStorage和sessionStorage只能存储字符串类型,对于复杂的对象可以使用ECMAScript提供的JSON对象的stringify和parse来处理。
5、获取方式:localStorage:localStorage.getItem("key");;sessionStorage:sessionStorage.getItem("key")。
6、应用场景:localStorage:常用于长期登录(+判断用户是否已登录),适合长期保存在本地的数据。sessionStorage:敏感账号一次性登录;
看到这里是不是感觉很简单,换成localStorage就可以了,正所谓“会者不难难者不会”,当时的我刚刚转换学习前端,很多概念没理解透导致一些前端问题频繁出现。
我们简单看一下写入和读取方式:
//写入缓存 localStorage.setItem("key", "value"); //获取缓存 localStorage.getItem("key"); //写入缓存 sessionStorage.setItem("key", "value"); //获取缓存 sessionStorage.getItem("key");