前后端数据交互的方式与过程

最新推荐文章于 2024-07-12 07:37:24 发布

ScratKong

最新推荐文章于 2024-07-12 07:37:24 发布

阅读量4.6k

点赞数 6

分类专栏：前后端交互文章标签：前后端交互

前后端交互专栏收录该内容

5 篇文章 0 订阅

订阅专栏

前后端交互的方式：

1.利用cookie对象

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

（1）后台代码

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

（2）前台代码

Cookie[] cookies=request.getCookies();
for(int i=0;i<cookies.length;i++){
if(cookies[i].getName().toString().equals("name")){
out.print(cookies[i].getValue());
}
}

2.利用session对象

session对象表示特定会话session的用户数据。客户第一次访问支持session的JSP网页，服务器会创建一个session对象记录客户的信息。当客户访问同一网站的不同网页时，仍处于同一个session中。

（1）后台代码

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

（2）前台代码（jsp页面）

Object user=request.getSession().getAttribute("name");

3.利用request重定向，设置setAttribute

（1）后台代码

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

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

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

（2）前台代码

String name=request.getAttribute("name").toString();

4.利用Ajax进行异步数据请求（得到的数据可以以json或xml格式返回，便于处理）

(1)后台代码案例（运用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  
    }  
  
}

2.前台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方式获取

交互实现原理：

1.前端请求数据URL由谁来写?

在开发中,URL主要是由后台来写的,写好了给前端开发者.如果后台在查询数据,需要借助查询条件才能查询到前端需要的数据时,这时后台会要求前端提供相关的查询参数，这里的查询参数也就是URL请求的参数。


2.接口文档主要由谁来写?

接口文档也是主要由后台开发者来写的,因为直接跟数据打交道的就是后台,后台是最清楚,数据库里面有什么数据,能返回什么数据.前端开发只是数据的被动接受者.所以接口文档也主要是由后台来完成的,前端只是接口文档的使用者,使用过程中,发现返回的数据不对,则需要跟后台进行商量,由后台来修改.切记 前端不要随意更改接口文档,除非在取得后台开发人员的同意的情况下.总的来讲,接口文档主要由后台来设计,修改,前端开发者起到了辅助的作用。


3.前端开发与后台交互的数据格式主要是什么?

主要是JSON
XML现在用的不多


4.前端开发的后台交互原理？

在项目的时候，我们前后端会大概说一下接口地址，前端请求的参数，后端返回的参数，然后大家就开始写，写的差不多的时候，大家调一下接口看一下返回的数据，没问题就可以了。


5.前端请求参数的形式

GET和POST两种方式
对安全性不高 采用get方便
post要比get安全
GET - 从指定的服务器中获取数据
POST - 提交数据给指定的服务器处理


6.前端应该告知后台哪些有效信息,后台才能返回前端想的数据的呢?

先将要展示的页面内容进行模块划分，将模块的内容提取出来，以及方便前端的一些标志值等，将所有想要的内容和逻辑告知后端，
后端就会去数据库里面去查找相应的数据表中去获得相应的内容，或者图片地址信息。
URL中的参数主要是根据后台需要,如果后台需要一个参数作为查询的辅助条件 前端在URL数据请求时就传递参数。
参数前面？
几个参数中间&


7.我们应该怎么把页面这些信息有效传达给后台,以及后台是如何获取到这些数据?

总的来讲:所有前端请求的URL后面的参数,都是辅助后台数据查询的.如果不需要参数,那么后台就会直接给个URL给前端。


8.前端应该如何回拒一些本不属于自己做的一些功能需求或任务?

在与后台打交道中,我们经常遇到这种情况,有时候明明后台来处理某个事件很简单,后台非要你来做,这时候我们应该懂得去回绝他。
原则:前端就是负责把数据展示在页面上
发挥:这就需要我们对一个需求,一个任务的要有清晰认识了,如果对任务含糊不清,自己都没搞明白,你只能受后台摆布了.最后也会因为任务没有完成而备受责难了。


9.当前端在调用数据接口时,发现有些数据不是我们想要的,那么前端应该怎么办呢或者怎么跟后台讲呢?

首先要把请求的URL和返回的数据以及在页面的展示的情况给跟后台看,这样有理有据,后台开发人员是不会说什么的,否则,后台会很不耐烦的,甚至骂你的可能都有,本身做后台比较难,尤其在查询数据,取数据,封装数据方面都比较难处理。


10.为什么需要在请求的时候传入参数？

因为后台在查询数据库的时候需要条件查询。