web開發中前端頁面是如何跟后端服務器數據交互的


 

本文鏈接:https://blog.csdn.net/kangkanglhb88008/article/details/84446173后端服務器一般是指servlet容器,用於執行java源程序
常見的網頁有html,htm,shtml,asp,aspx,php,jsp等格式前兩個常用於靜態網頁,后面幾個常用於動態網頁。
這里前端網頁以比較常見的 xx.html 和 xx.jsp 網頁作為介紹,其它類似
 
一、靜態頁面xx.html如何跟后台交互:先來看一個最簡單的登陸界面源代碼  <body>    <form action="loginServlet" method="post">       user:<input type="text" name="username"/>       password:<input type="password" name="password"/>             <input type="submit" value="Submit"/>    </form>  </body>
這是一個表單,我們看到里面都是純html內容,這是一個靜態頁面,當我們點擊submit按鈕時候,瀏覽器會提交表單內的數據到服務器的loginServlet這個相對地址,我們看看瀏覽器的地址變成啥了:
這不就是我們的后台servlet的地址嘛,然后這個地址指向的是loginServlet這個servlet,然后在web.xml文件中找到這個servlet關聯的java類,從而執行了服務器端的程序(第一次執行,那么會實例化,然后執行里面init()函數,然后執行service()函數,如果是第二次調用,那么不用實例化了,直接執行service()函數),我們來看看服務器端的源程序:package com.atguigu.javaweb;
import java.io.IOException;import java.io.PrintWriter;
import javax.servlet.Servlet;import javax.servlet.ServletConfig;import javax.servlet.ServletContext;import javax.servlet.ServletException;import javax.servlet.ServletRequest;import javax.servlet.ServletResponse;import javax.servlet.http.HttpServletRequest;
public class loginServlet extends MyGeneriServlet {    public void init(javax.servlet.ServletConfig config) throws ServletException{        super.init(config);    }    public void service(ServletRequest request, ServletResponse response)            throws ServletException, IOException {        //獲取請求方式是GET,POST方式?        HttpServletRequest httpServletRequest=(HttpServletRequest) request;        String method=httpServletRequest.getMethod();        System.out.println(method);        //1.獲取請求參數:username,password        String username=request.getParameter("username");        String password=request.getParameter("password");        //獲取請求參數        String initUser=getServletContext().getInitParameter("user");        String initpassword=getServletContext().getInitParameter("password");                 PrintWriter out=response.getWriter();        //3.對比        if(initUser.equals(username)&&initpassword.equals(password)){            out.print("Hello"+username);    // 生成html內容        }else{            out.print("Sorry"+username);    // 生成html內容        }    }}上面沒有判斷此時對servlet的請求是post還是get方法,不過沒關系,request這個傳進來的參數以及包含了這些信息,自己判斷一下執行相應的操作即可
由於頁面路徑已經跳轉到servlet了,但是servlet不是一個.html文件啊,那豈不是沒有內容供瀏覽器顯示了,不是的,我們看到返回的參數response中的對象PrintWriter out用於動態生成html內容的字符串"Hello",所以這時候相當於servlet這個路徑也有了html內容了,瀏覽器的頁面就會顯示上述字符串了
二、jsp頁面如何跟后端服務器交互:jsp網頁文件就是html內容里面插入java代碼,當我們訪問.jsp網頁文件時候,服務器提前已經知道這個頁面內含有java代碼,那么服務器這邊就得先執行一下這些代碼(就跟執行servlet的java源代碼一樣),同時把執行的結果嵌入在當前這個.jsp頁面內,我們看看源代碼:
<%@page import="java.util.Date"%>     // 如果這個.jsp頁面中用到了一些java函數,就得導入庫,這就跟java源文件一樣的
<html>    <head>           <title>第一個 JSP 程序</title>    </head>    <body>           <%                  out.println("Hello World!"); // 這里實際上是服務器執行了結果,然后以文本返回給瀏覽器進行顯示           %>    </body></html>
上面紅色代碼就是java代碼,剛剛說過對象PrintWriter out用於動態生成html內容的字符串,所以服務器執行完嵌入在里面的java代碼后,就是動態生成了一串html代碼,然后一起傳給客戶端瀏覽器進行顯示
當然這種情況.jsp里面沒有按鈕,表單這樣的控件,現在再來看看有表單這種.jsp如何跟后端交互:
view.jsp
<%@page import="day03_student.Student"%>  // 還是得帶入java用到的庫文件
<style type="text/css">  // 樣式設計部分,即css
table{
border:1px solid gray;
border-collapse:collapse;
width:50%
}
td{
border:1px solid gray;
}
</style>
<body>    <h2>學生個人基本信息</h2>   <table>   <tr>    <td>編號</td>    <td>學號</td>    <td>姓名</td>    <td>性別</td>    <td>年齡</td>    </tr>      <tr>      <%    Student s=(Student)request.getAttribute("students");  //      %>     <td><%=s.getId()%></td>     <td><%=s.getStuno()%></td>     <td><%=s.getName()%></td>     <td><%=s.getGender()%></td>     <td><%=s.getAge() %></td>     </tr>   </table>  </body>參考的原文:https://blog.csdn.net/myclass1312/article/details/80571867 
這時候如果我們直接訪問這兒view.jsp文件,應該是沒有數據的,因為對象s無法從request對象獲取,必須得先給這個request對象賦值才行,即應該從如下servlet路徑跳轉來view.jsp文件路徑才行
public class viewservlet extends HttpServlet {     private StudentDao dao=new StudentDao();    public void doGet(HttpServletRequest request, HttpServletResponse response)            throws ServletException, IOException {                String idstr = request.getParameter("id");                int id = Integer.parseInt(idstr);                //將數據放入request中,傳遞到頁面                Student student=dao.queryById(id);                request.setAttribute("students", student);                request.getRequestDispatcher("view.jsp").forward(request, response);    // 這里是從當前頁面跳轉去哪個頁面,同時傳遞了request, response這兩個參數,這時候的request就是有內容的,接下來的view.jsp頁面就能獲取到內容而且動態生成html內容    }        public void doPost(HttpServletRequest request, HttpServletResponse response)            throws ServletException, IOException {        this.doGet(request, response);        }}
總結:每個xx.html文件,xx.jsp文件,servlet響應程序...都是需要在客戶端瀏覽器通過URL來訪問的。xx.jsp文件,servlet響應程序因為含有java源代碼,需要服務器電腦先執行一下,.jsp文件中的java代碼一般會動態生成一些html內容嵌入在當前.jsp文件里面一起給瀏覽器顯示出來;而servlet中的java代碼一般是數據處理功能的,可能會通過request.getRequestDispatcher("view.jsp").forward(request, response); 這樣的方式跳轉到其它有html內容的頁面的URL(同時傳遞處理好的數據過去) 來顯示結果。
————————————————版權聲明:本文為CSDN博主「biao2488890051」的原創文章,遵循 CC 4.0 BY-SA 版權協議,轉載請附上原文出處鏈接及本聲明。原文鏈接:https://blog.csdn.net/kangkanglhb88008/article/details/84446173


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM