web前后台数据交互的四种方式

简介: web前后台数据交互的四种方式


  1. 利用cookie对象

Cookie是服务器保存在客户端中的一小段数据信息。使用Cookie有一个前提,就是客户端浏览器允许使用Cookie并对此做出相应的设置。一般不赞成使用Cookie。

后台代码

Cookie cookie=new Cookie("name", "hello"); 
response.addCookie(cookie);

前台代码

Cookie[] cookies=request.getCookies(); 
for(int i=0;i<cookies.length;i++){ 
        if(cookies[i].getName().toString().equals("name")){ 
            out.print(cookies[i].getValue()); 
        } 
}
  1. 利用session对象
    session对象表示特定会话session的用户数据。客户第一次访问支持session的JSP网页,服务器会创建一个session对象记录客户的信息。当客户访问同一网站的不同网页时,仍处于同一个session中。

后台代码

request.getSession().setAttribute("name", name); 
request.getSession().setMaxInactiveInterval(2); 
response.sendRedirect("welcome.jsp"); 

前台代码

Object user=request.getSession().getAttribute("name");
  1. 利用request转发,设置setAttribute

后台代码

request.setAttribute("name", "cute"); 
request.getRequestDispatcher("welcome.jsp").forward(request, response);  //网址不会改变

PS:如果后台使用的重定向代码为 response.sendRedirect("welcome.jsp"); //网址变为welcome.jsp

则request设置的参数无效,因为已经切换到另一个请求了,request参数的有效期为本次请求。

前台代码

String name=request.getAttribute("name").toString();
  1. 利用Ajax进行异步数据请求(得到的数据可以以json或xml格式返回,便于处理)

后台代码案例(运用servlet传输数据)

public class TestServlet extends HttpServlet { 
    /**
     * Constructor of the object.
     */ 
    public TestServlet() { 
        super(); 
    } 
    public void doGet(HttpServletRequest request, HttpServletResponse response) 
            throws ServletException, IOException { 
        doPost(request, response); 
    } 
    public void doPost(HttpServletRequest request, HttpServletResponse response) 
            throws ServletException, IOException { 
        response.setContentType("text/html"); 
        PrintWriter out = response.getWriter(); 
        String data="[{\"name\":\"apple\",\"price\":23},{\"name\":\"banana\",\"price\":12},{\"name\":\"orange\",\"price\":8}]"; 
        out.write(data); 
        out.flush(); 
        out.close(); 
    } 
    /**
     * Initialization of the servlet. <br>
     *
     * @throws ServletException if an error occurs
     */ 
    public void init() throws ServletException { 
        // Put your code here 
    } 
} 

前台js请求处理数据代码

function createXMLHttpRequest(){ 
    var xmlrequest; 
    if(window.XMLHttpRequest){ 
        xmlrequest=new XMLHttpRequest(); 
    }else if(window.ActiveXObject){ 
        try{ 
            xmlrequest=new ActiveXObject("Msxm12.XMLHTTP"); 
        }catch(e){ 
            try{ 
                xmlrequest=new ActiveXObject("Microsoft.XMLHTTP"); 
            }catch(e){ 
                xmlrequest=""; 
            } 
        } 
    } 
    return xmlrequest; 
} 
//获取数据的函数 
function change(){ 
    var xmlrequest=createXMLHttpRequest(); 
    xmlrequest.open("POST","TestServlet",true); 
    xmlrequest.onreadystatechange=function(){ 
        if(xmlrequest.readyState==4&&xmlrequest.status==200){ 
            var data=JSON.parse(xmlrequest.responseText); 
            var content="<table border=1>"; 
            for(var i=0;i<data.length;i++){ 
                content+="<tr>"; 
                for(o in data[i]){ 
                    content+="<td>"+data[i][o]+"</td>"; 
                } 
                content+="</tr>"; 
            } 
            content+="</table>"; 
            document.getElementById("test").innerHTML=content; 
        } 
    }; 
    xmlrequest.send(); 
} 

总结:在用户访问网站整个生命周期中都会用到的数据用session来存储,例如用户名,登录状态,购物车信息

显示在网页上的信息数据大多通过 request或Ajax方式获取


相关文章
|
18天前
|
前端开发 JavaScript Python
Python Web应用中的WebSocket实战:前后端分离时代的实时数据交换
在前后端分离的Web应用开发模式中,如何实现前后端之间的实时数据交换成为了一个重要议题。传统的轮询或长轮询方式在实时性、资源消耗和服务器压力方面存在明显不足,而WebSocket技术的出现则为这一问题提供了优雅的解决方案。本文将通过实战案例,详细介绍如何在Python Web应用中运用WebSocket技术,实现前后端之间的实时数据交换。
36 0
|
19天前
|
前端开发 API 开发者
从零到精通,AJAX与Fetch API让你的Python Web前后端交互无所不能!
从零到精通,AJAX与Fetch API让你的Python Web前后端交互无所不能!
32 3
|
5天前
|
存储 前端开发 API
前端开发中,Web Storage的存储数据的方法localstorage和sessionStorage的使用及区别
前端开发中,Web Storage的存储数据的方法localstorage和sessionStorage的使用及区别
33 0
|
7天前
|
存储 JSON 前端开发
JSON与现代Web开发:数据交互的最佳选择
JSON(JavaScript Object Notation)是一种轻量级的数据交换格式,易于人阅读和编写,同时也便于机器解析和生成。它以文本格式存储数据,常用于Web应用中的数据传输,尤其是在客户端和服务器之间。
22 0
|
1月前
|
开发框架 JSON 缓存
震撼发布!Python Web开发框架下的RESTful API设计全攻略,让数据交互更自由!
在数字化浪潮推动下,RESTful API成为Web开发中不可或缺的部分。本文详细介绍了在Python环境下如何设计并实现高效、可扩展的RESTful API,涵盖框架选择、资源定义、HTTP方法应用及响应格式设计等内容,并提供了基于Flask的示例代码。此外,还讨论了版本控制、文档化、安全性和性能优化等最佳实践,帮助开发者实现更流畅的数据交互体验。
57 1
|
2月前
|
开发者 图形学 API
从零起步,深度揭秘:运用Unity引擎及网络编程技术,一步步搭建属于你的实时多人在线对战游戏平台——详尽指南与实战代码解析,带你轻松掌握网络化游戏开发的核心要领与最佳实践路径
【8月更文挑战第31天】构建实时多人对战平台是技术与创意的结合。本文使用成熟的Unity游戏开发引擎,从零开始指导读者搭建简单的实时对战平台。内容涵盖网络架构设计、Unity网络API应用及客户端与服务器通信。首先,创建新项目并选择适合多人游戏的模板,使用推荐的网络传输层。接着,定义基本玩法,如2D多人射击游戏,创建角色预制件并添加Rigidbody2D组件。然后,引入网络身份组件以同步对象状态。通过示例代码展示玩家控制逻辑,包括移动和发射子弹功能。最后,设置服务器端逻辑,处理客户端连接和断开。本文帮助读者掌握构建Unity多人对战平台的核心知识,为进一步开发打下基础。
96 0
|
2月前
|
物联网 C# 智能硬件
智能家居新篇章:WPF与物联网的智慧碰撞——通过MQTT协议连接与控制智能设备,打造现代科技生活的完美体验
【8月更文挑战第31天】物联网(IoT)技术的发展使智能家居设备成为现代家庭的一部分。通过物联网,家用电器和传感器可以互联互通,实现远程控制和状态监测等功能。本文将探讨如何在Windows Presentation Foundation(WPF)应用中集成物联网技术,通过具体示例代码展示其实现过程。文章首先介绍了MQTT协议及其在智能家居中的应用,并详细描述了使用Wi-Fi连接方式的原因。随后,通过安装Paho MQTT客户端库并创建MQTT客户端实例,演示了如何编写一个简单的WPF应用程序来控制智能灯泡。
75 0
|
2月前
|
Java 数据库 API
JSF与JPA的史诗级联盟:如何编织数据持久化的华丽织锦,重塑Web应用的荣耀
【8月更文挑战第31天】JavaServer Faces (JSF) 和 Java Persistence API (JPA) 分别是构建Java Web应用的用户界面组件框架和持久化标准。结合使用JSF与JPA,能够打造强大的数据驱动Web应用。首先,通过定义实体类(如`User`)和配置`persistence.xml`来设置JPA环境。然后,在JSF中利用Managed Bean(如`UserBean`)管理业务逻辑,通过`EntityManager`执行数据持久化操作。
46 0
|
2月前
|
开发者 前端开发 开发框架
JSF与移动应用,开启全新交互体验!让你的Web应用轻松征服移动设备,让用户爱不释手!
【8月更文挑战第31天】在现代Web应用开发中,移动设备的普及使得构建移动友好的应用变得至关重要。尽管JSF(JavaServer Faces)主要用于Web应用开发,但结合Bootstrap等前端框架,也能实现优秀的移动交互体验。本文探讨如何在JSF应用中实现移动友好性,并通过示例代码展示具体实现方法。使用Bootstrap的响应式布局和组件可以确保JSF页面在移动设备上自适应,并提供友好的表单输入和提交体验。尽管JSF存在组件库较小和学习成本较高等局限性,但合理利用其特性仍能显著提升用户体验。通过不断学习和实践,开发者可以更好地掌握JSF应用的移动友好性,为Web应用开发贡献力量。
45 0
|
2月前
|
Java 开发者 关系型数据库
JSF与AWS的神秘之旅:如何在云端部署JSF应用,让你的Web应用如虎添翼?
【8月更文挑战第31天】在云计算蓬勃发展的今天,AWS已成为企业级应用的首选平台。本文探讨了在AWS上部署JSF(JavaServer Faces)应用的方法,这是一种广泛使用的Java Web框架。通过了解并利用AWS的基础设施与服务,如EC2、RDS 和 S3,开发者能够高效地部署和管理JSF应用。文章还提供了具体的部署步骤示例,并讨论了使用AWS可能遇到的挑战及应对策略,帮助开发者更好地利用AWS的强大功能,提升Web应用开发效率。
60 0