html5怎么从服务端获取数据

html5怎么从服务端获取数据,第1张

前端通过接口去访问服务器,服务器通过脚本去取数据库里的数据,并将数据组织成xml或者json数据格式发送给前端,前端使用一个操作句柄进行接收。技术就是采用ajax。可以使用jquery封装好的$.ajax去异步获取后台的数据。

直接百度ajax用法:

$.ajax({

type: "POST",

url: url,

data:{},//数据

async: false,//同步

dataType: 'json',

success: function (data) {

alert(JSON.stringify(data))

},

error: function (XMLHttpRequest, textStatus, errorThrown) {

alert("报错")

}

})

服务器跟踪用户状态有好几种方法,其中一种就是,服务器保持session,给客户端一个sessionid,客户端每次发送请求时,会把这个sessionid提交给服务器(这是浏览器干的事),服务器根据这个sessionid找到相应的session,如果你用的jsp,jsp引擎(比如tomcat)会吧这个session作为一个实例变量放到jsp页面里,你可以直接使用。如果是html文件,jsp引擎会直接发送给客户端html文件的内容。

客户端的js访问cookie的方法只能访问存储在客户端的cookie(使用js或session的cookie存储的)。

一般来说,只有服务器端的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

</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' onmousedown="fnSave()">

接下来,为“内容页面”加入验证功能:

四、在“内容页面”中加入一个STYLE用来定义persistent类,同时加入存储函数fnLoad用来判断合法性。

<STYLE>

.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 onload="fnLoad()">

<DIV CLASS=userData ID="oPersistDiv"></DIV>

从以上范例可看出,通过persistence的使用,使得普通的静态内容页面具有了session功能,一般的不敏感信息完全可以通过session保存在客户端。

另外,如果不明白persistence的使用,也可以这样,你的首页上有个form,用来提交用户名和密码。如果你把首页换成html页面,完全可以,不过要在其他地方接收用户名和密码(比如logon.jsp)。form的action设为logon.jsp。很简单。使用form的action来转移接受session的地方,首页就可以用静态了


欢迎分享,转载请注明来源:夏雨云

原文地址:https://www.xiayuyun.com/zonghe/321463.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2023-05-01
下一篇2023-05-01

发表评论

登录后才能评论

评论列表(0条)

    保存