为静态页面HTML增加session功能

最新推荐文章于 2024-04-12 04:30:22 发布
最新推荐文章于 2024-04-12 04:30:22 发布
阅读量1w 收藏 2
点赞数
分类专栏： 网页 文章标签： session html cookies 存储 behavior microsoft
一般来说，只有服务器端的CGI程序（ASP、PHP、JSP）具有session会话功能，用来保存用户在网站期间（会话）的活动数据信息，而对于数量众多的静态页面（HTML）来说，只能使用客户端的cookies来保存临时活动数据，但对于cookies的操作是个很烦琐的过程，远没有对于session操作那样简便。
　
为此，本文向读者推荐一种在DHTML中的解决方案“Persistence技术”，使得在静态页面中也能使用session会话功能。
　
使用保持（Persistence）技术让我们能够在当前会话过程中保存一些数据对象到客户端，它减少了对服务器的访问请求，充分发挥了客户端计算机的数据处理能力，从而也整体提升了页面显示效率。
　
Microsoft　Internet Explorer 5浏览器和以后的版本都支持使用状态保持（Persistence）技术，它有以下几种行为可供调用：
saveFavorite—当页面被添加到收藏夹时保存页面状态和信息
saveHistory—在当前会话中保存页面状态和信息
saveSnapshot—当页面被保存到硬盘时，保存页面状态和信息persists
page state and information directly in the page when users save the Web page to
their hard disk.
userData—在当前会话中用XML格式保存页面状态和信息 网页制作
　
Persistence技术打破了以前使用使用cookies和session的传统，它继承了以前cookies的一些安全策略，同时也增加了存储和管理数据的能力。我们的每个页面有64KB的用户数据存储容量，对于每个站点总计有640KB的存储上限。
　
Persistence技术存储的数据格式符合XML标准，所以可以使用DOM技术中的getAttribute和setAttribute方法来存取数据。
　
下面是一个Persistence技术的典型应用，通过对Persistence存储数据的分析，使得静态页面具有验证功能。
实际判断过程是这样的：
有三个对象：游客V、导航页面A、内容页面C
游客V只能通过导航页面A的链接才能看到内容页面C；
如果游客V是通过其它途径来访问内容页面C（比如通过其它网站的超链接、直接在IE地址栏中输入网址访问等），内容页面C将自动提示版权信息，显示空白页。
　
具体实现步骤：
一、在“导航页面”中加入一个STYLE用来定义persistent类，同时加入存储函数fnSave用来授权。
<STYLE>
.userData {behavior:url(#default#userdata);}
</STYLE>
　
<SCRIPT language=Javascript>
网页编程

function fnSave(){
oPersistDiv.setAttribute("bIsValid","true");
oPersistDiv.save("oXMLStore");
}
</SCRIPT>
二、在“导航页面”的<body>和</body>区域中定义一个层用来标识Persistence对象
<DIV CLASS=userData ID="oPersistDiv"></DIV>
三、在“导航页面”的超链接属性中加入一条语句用来调用函数fnSave：
<a href='redhat2.htm' οnmοusedοwn="fnSave()">
　
接下来，为“内容页面”加入验证功能：
四、在“内容页面”中加入一个STYLE用来定义persistent类，同时加入存储函数fnLoad用来判断合法性。
<STYLE>
.userData {behavior:url(#default#userdata);}
</STYLE>
<SCRIPT>
var bPageValid=false;
function fnLoad(){
oPersistDiv.load("oXMLStore");
if((oPersistDiv.getAttribute("bIsValid"))&&(oPersistDiv.getAttribute("bIsValid")=="true")){
bPass=true;
网页模板


}
else{
bPass=false;
}
oPersistDiv.setAttribute("bIsValid","false");
oPersistDiv.save("oXMLStore");
if(bPass==false){
var sError="来源不明，请您通过授权网站访问我们.";
alert(sError);
location.href="about:blank";
}
}
</SCRIPT>
五、修改“内容页面”的<body>区域如下：
<BODY οnlοad="fnLoad()">
<DIV CLASS=userData ID="oPersistDiv"></DIV>
　
从以上范例可看出，通过persistence的使用，使得普通的静态内容页面具有了session功能，一般的不敏感信息完全可以通过session保存在客户端。
使用多个带有session功能的静态页面可以完成众多复杂任务，如虚拟购物车，高级搜索引擎等。同时，由于将以前服务器端承担的部分session任务转移到客户端，减少了数据交互量，大大降低了服务器的负担。
zhaoxiang11
关注
  • 0
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
web登录页面及后台管理页面(静态的html源码文件)
07-14
web登录页面及后台管理页面，内附有静态的html源码文件，可以根据需要进行修改
HTML5报表统计静态页面
09-18
HTML5报表统计静态页面是一种基于Web的可视...综上所述，HTML5报表统计静态页面结合了HTML5的新特性、JavaScript库和响应式设计，为用户提供了一种跨平台、互动性强的统计数据分析工具，能够有效地展示和解读大量数据。
html session登陆验证,原创 实现session登陆时间的验证,验证用户登录页面的一个监听器...
weixin_39833763的博客
06-19 176
1.在login_do.jsp登录成功的前面加上session.setAttribute("user",admin);我是在我的验证Action里面加上的:Admin admin=dbu.selectAdmin(login.getAdmin_user());HttpSession session=request.getSession();admin是你的管理员POJO ;admin里面放的是用户名...
Session详解，学习Session，这篇文章就够了(包含底层分析和使用)
最新发布
2401_84002271的博客
04-12 1305
这份面试题几乎包含了他在一年内遇到的所有面试题以及答案，甚至包括面试中的细节对话以及语录，可谓是细节到极致，甚至简历优化和怎么投简历更容易得到面试机会也包括在内！也包括教你怎么去获得一些大厂，比如阿里，腾讯的内推名额！某位名人说过成功是靠99%的汗水和1%的机遇得到的，而你想获得那1%的机遇你首先就得付出99%的汗水！你只有朝着你的目标一步一步坚持不懈的走下去你才能有机会获得成功！成功只会留给那些有准备的人！一个人可以走的很快，但一群人才能走的更远。
html 页面session会话域怎么拿_Cookie和Session异同
weixin_29542759的博客
12-11 421
摘要：对于浏览器中的数据存储，往往存在Session和Cookie两种方式，在许多科技公司的面试过程中常常也会被提及这两种方式在数据存储中有什么异同，因此，本篇文章是我对于Session和Cookie两种方式的见解关键字：Session、Cookie、数据存储一、首先我们应该先了解一下二者存储的位置有什么不同对于Session它是将Session中的数据信息存放在了服务器端。原理即为当客户端访问服...
如何在HTML页面使用“session”
andaying的博客
01-27 9689
如何在HTML页面使用“session”如何在HTML页面使用“session”session为什么不能用在HTMLsessionStorage示例创建项目架构编辑js文件编辑Html页面运行测试结语 如何在HTML页面使用“session” 在程序开发当中session的用处可以说是非常方便，然而当有静态化的需求时，我们必须把jsp转为Html，结果却发现session不能用了。那么我i们怎么来...
在html页面中设置session
weixin_44575964的博客
03-24 1354
添加 sessionStorage.setItem("user",JSON.stringify(r.user))//设置session 获取 this.user = JSON.parse(sessionStorage.getItem('user'));//获取session 移除 sessionStorage.removeItem("user");
html.rar_ASP 静态_asp html
09-23
在Web开发中，静态页面是已经预先编译且不涉及服务器端处理的HTML文件，而动态页面则需要服务器解析执行后再返回给用户。将ASP动态页面转换为静态HTML页面有以下几个主要优点： 1. **性能优化**：静态HTML页面加载...
乐购数字产品销售企业网站html静态模板
12-04
乐购数字产品销售企业网站html静态模板是一款专为在线销售数字产品的公司或个人设计的网页模板。这个模板基于HTML（超文本标记语言）构建，它提供了丰富的页面布局和功能，适用于展示各种数字产品，如软件、电子书、...
wangyesheji.rar_网页 asp_静态网页
09-22
【标题】"wangyesheji.rar_网页 asp_静态网页" 涉及到的主要技术是ASP（Active Server Pages）和静态网页设计。...通过解压并查看这些文件，可以深入了解ASP如何处理服务器端逻辑，并将结果呈现为用户所见的静态页面。
static.rar静态页面-登录页面
09-15
在IT行业中，静态页面是网页开发的一个重要组成部分，特别是在构建用户界面时，它们通常用于提供简单、快速且不涉及服务器端动态处理的交互体验。在这个案例中，"static.rar"是一个压缩包，其中包含了用于创建登录...
.html设置url的session,关于session的实现：cookie与url重写
weixin_42515448的博客
06-11 716
本文讨论的语境是java EE servlet。我们都知道session的实现主要两种方式：cookie与url重写，而cookie是首选(默认)的方式，因为各种现代浏览器都默认开通cookie功能，但是每种浏览器也都有允许cookie失效的设置。由于浏览器默认启动cookie功能，而且普通客户一般都不会取消cookie功能。久而久之，我们写代码的时候，也就不会在意session的具体实现，其实这...
html----session
qq_23933479的博客
10-18 4086
http://lavasoft.blog.51cto.com/62575/275589/ http://justsee.iteye.com/blog/1570652 主要通过以上两篇blog进行归纳总结。。。。
在jsp中保存session值获得session值
热门推荐
ht121907的博客
01-14 3万+
session回话，得值操作在jsp中
静态变量和Session的使用
aoyuan7735的博客
12-17 340
最近做一个项目，一个表格的数据需要在会话过程中一直存在。因为接手的是别人做过的东西，按照原来的风格沿用了上面的静态变量来存储数据的方法： public static List<Word> Words=wordrList; 后来测试时发现用Chrome和IE同时打开这个项目，数据会被覆盖掉，比方说Chrome传进来了数据A，然后IE传进来数据B。 此时Chrome什么都不...
springboot登录静态页面
05-26
首先，在Spring Boot中，静态页面应该放在`src/main/resources/static`目录下。 其次，为了实现登录功能，您需要使用一个表单来收集用户的用户名和密码，并将这些信息提交到后端。以下是一个简单的示例： ```html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Login</title> </head> <body> <h2>Login</h2> <form method="post" action="/login"> <label for="username">Username:</label> <input type="text" id="username" name="username"><br><br> <label for="password">Password:</label> <input type="password" id="password" name="password"><br><br> <input type="submit" value="Submit"> </form> </body> </html> ``` 在这个表单中，我们定义了两个输入框，一个用于输入用户名，一个用于输入密码。当用户点击“提交”按钮时，表单将会被提交到`/login`地址。 接下来，您需要在后端实现`/login`地址的处理逻辑，以验证用户的身份。以下是一个简单的示例： ```java @Controller public class LoginController { @PostMapping("/login") public String login(@RequestParam("username") String username, @RequestParam("password") String password, HttpSession session) { if ("admin".equals(username) && "123456".equals(password)) { session.setAttribute("username", username); return "redirect:/home"; } else { return "redirect:/login?error"; } } @GetMapping("/login") public String login() { return "login"; } @GetMapping("/home") public String home(HttpSession session) { String username = (String) session.getAttribute("username"); if (username != null) { return "home"; } else { return "redirect:/login"; } } } ``` 在这个控制器中，我们定义了三个请求处理方法： - `login()`方法用于返回登录页面的视图。 - `login()`方法用于处理用户提交的表单数据，并验证用户名和密码是否正确。如果验证通过，我们将`username`存储到`HttpSession`中，并重定向到`/home`地址。否则，我们将用户重定向回`/login`地址，并在URL中添加一个`error`参数，以提示用户登录失败。 - `home()`方法用于返回主页面的视图。如果用户已经登录（即`username`存在于`HttpSession`中），我们将返回主页面的视图。否则，我们将用户重定向回`/login`地址。 最后，您可以在`src/main/resources/templates`目录下创建`login.html`和`home.html`两个视图文件，分别用于显示登录页面和主页面的内容。以下是这两个文件的示例代码： ```html <!-- login.html --> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Login</title> </head> <body> <h2>Login</h2> <form method="post" action="/login"> <label for="username">Username:</label> <input type="text" id="username" name="username"><br><br> <label for="password">Password:</label> <input type="password" id="password" name="password"><br><br> <input type="submit" value="Submit"> </form> <p th:if="${param.error}">Invalid username or password.</p> </body> </html> ``` ```html <!-- home.html --> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Home</title> </head> <body> <h2>Welcome, <span th:text="${session.username}"></span>!</h2> <a href="/logout">Logout</a> </body> </html> ``` 在这些HTML文件中，我们使用了`thymeleaf`模板引擎来渲染动态内容。在`login.html`中，我们使用了`${param.error}`来检查是否有`error`参数被添加到URL中，并在页面上显示相应的错误消息。在`home.html`中，我们使用了`${session.username}`来获取`HttpSession`中存储的用户名，并欢迎用户到达主页面。 希望这可以帮助您实现登录静态页面。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值