day23-服务器端渲染技术01

打印 上一主题 下一主题

主题 543|帖子 543|积分 1629

服务器端渲染技术01


  • 为什么需要jsp?
在之前的开发过程中,我们可以发现servlet做界面非常不方便:
引出jsp技术=>  jsp=html+java代码+标签+javascript+css
1.JSP基本介绍


  • JSP全称是Java Server Pages,Java的服务器页面,就是服务器端渲染技术
  • JSP这门技术最大的特点在于,写JSP就像在写HTML

    • 相比HTML而言,HTML只能为用户提供静态数据,而JSP技术允许在页面中嵌套java代码,为用户提供动态数据
    • 相比Servlet而言,Servlet很难对数据进行排版,而jJSP除了可以用java代码产生动态数据的同时,也很容易对数据进行排版

  • JSP技术基于Servlet,可以理解成JSP就是对Servlet的包装,JSP的本质就是Servlet
  • 会使用JSP的程序员,再使用thymeleaf是非常容易的事情,几乎是无缝接轨。
2.JSP的快速入门

2.1应用实例-jsp的基本使用


  • 创建web项目,并引入jsp和servlet的jar包(servlet和jsp的jar包在tomcat安装目录下的lib目录下)

  • 创建的jsp文件应放在web目录下面

  • 配置Tomcat
  • 编写jsp
    1. <%--
    2.   Created by IntelliJ IDEA.
    3.   User: li
    4.   Date: 2022/11/24
    5.   Time: 16:59
    6.   To change this template use File | Settings | File Templates.
    7. --%>
    8. <%@ page contentType="text/html;charset=UTF-8" language="java" %>
    9. <html>
    10. <head>
    11.     <title>jsp简单的求和计算器</title>
    12. </head>
    13. <body>
    14. <h1>jsp简单的求和计算器</h1>
    15. <%
    16.     //1. 在jsp中的该标签内可以写java代码
    17.     int i = 10;
    18.     int j = 20;
    19.     int res = i + j;
    20.     //jsp的本质就是servlet,因此servlet可以使用的东西jsp都可以使用
    21.     //2.jsp中内置了许多对象,可以直接使用,比如out
    22.     out.print(i + "+" + j + "=" + res);
    23. %>
    24. </body>
    25. </html>
    复制代码
  • 运行Tomcat,在浏览器中访问该jsp资源

2.1注意事项和细节


  • jsp页面不能像html页面一样,直接用浏览器运行。只能通过浏览器访问Tomcat来访问jsp页面
  • 如何设置jsp模板,设置完模板后,当你再去生成一个jsp文件后就会根据模板的内容自动生成文件头

3.JSP的运行原理


  • jsp页面本质是一个Servlet程序(jsp本质就是java程序),其性能是和java相关的,只是长得丑
  • 第一次访问jsp页面的时候,Tomcat服务器会将jsp页面解析成一个java源文件,并且将它编译成一个.clsaa字节码程序。

  • 分析下sum_jsp.java源码,可以看出jsp本质就是Servlet
    3.1可以看到sum_jsp类继承了一个名叫HttpJspBase的类:
    想要看到源码和分析类图,需要加入jasper.jar包。这个包在tomcat/lib下拷贝
    3.2我们引入jasper.jar包,查看该类的类图:

4.常用的jsp指令


  • language表示jsp翻译后是什么语言文件,只支持java
  • contentType表示jsp返回的数据类型,对应源码中response.setContentType()参数值
  • pageEncoding属性表示当前jsp页面文件本身的字符集
  • import属性和java源代码中一样,用于导包,导类。
5.JSP三种常用脚本

5.1声明脚本基本语法


  • 声明脚本的格式是:
    1. [/code]
    2. [*]作用:定义jsp需要的属性,方法,静态代码块和内部类等
    3. [/list][indent]应用实例
    4. [/indent]statement.jsp:
    5. [code]<%--
    6.   Created by IntelliJ IDEA.
    7.   User: li
    8.   Date: 2022/11/24
    9.   Time: 18:28
    10.   Version: 1.0
    11. --%>
    12. <%@ page contentType="text/html;charset=UTF-8" language="java" %>
    13. <html>
    14. <head>
    15.     <title>jsp声明脚本</title>
    16. </head>
    17. <body>
    18. <h1>jsp声明脚本</h1>
    19. <%!
    20.     //这里我们可以声明该jsp需要的属性,方法,静态代码块和内部类等,
    21.     // 也就是给statement.jsp对应的statement_jsp类定义成员
    22.     //1.属性
    23.     private String name = "jack";
    24.     private int age;
    25.     private static String company;
    26.     //2.方法
    27.     public String getName() {
    28.         return name;
    29.     }
    30.     //3.静态代码块
    31.     static {
    32.         company = "中国移动";
    33.     }
    34. %>
    35. </body>
    36. </html>
    复制代码

    • 在浏览器中访问该jsp页面,在Tomcat启动时的Using CATALINA_BASE:文件目录下可以看到对应jsp文件生成的java文件:

    • 打开该java文件,可以看到在jsp页面中定义的属性和方法等:

    5.2表达式脚本基本语法


    • 表达式脚本的格式是:
      1. [/code][indent]表达式的概念和java基础的表达式一样,只要有一个具体的值返回,都可以称之为一个表达式
      2. [/indent]
      3. [*]表达式脚本的作用是:在jsp页面上输出数据
      4. [*]脚本中的表达式不能以分号结束
      5. [/list][indent]应用实例
      6. [/indent]expression.jsp:
      7. [code]<%--
      8.   Created by IntelliJ IDEA.
      9.   User: li
      10.   Date: 2022/11/24
      11.   Time: 18:47
      12.   Version: 1.0
      13. --%>
      14. <%@ page contentType="text/html;charset=UTF-8" language="java" %>
      15. <html>
      16. <head>
      17.     <title>表达式脚本的使用</title>
      18. </head>
      19. <body>
      20. <h1>表达式脚本的使用</h1>
      21. <%
      22.     String name = "一只大猫咪";
      23.     //可以在jsp页面中动态获取一些值,并将其展示出来
      24.     String email = request.getParameter("email");
      25.     //表达式可以是变量,常量,还可以是动态获取的变量
      26. %>
      27. 用户名:<%=name%><br/>
      28. 工作是:<%="java工程师"%><br/>
      29. 年龄:<%=request.getParameter("age")%><br/>
      30. 邮箱:<%=email%>
      31. </body>
      32. </html>
      复制代码
      访问浏览器:http://localhost:8080/jsp/expression.jsp?age=100&email=mimi@qq.com
      5.3代码脚本基本语法


      • 代码脚本的语法是:
        1. [/code]
        2. [*]代码脚本的作用是:可以在jsp页面中,编写我们需要的功能(使用java)
        3. [*]可以由多个代码脚本块组合完成一个完整的java语句
        4. [*]代码脚本还可以和表达式脚本一起组合使用,在jsp页面上输出数据
        5. [/list][indent]应用实例
        6. [/indent]在src文件夹下创建一个Monster类:
        7. [code]package com.li.entity;
        8. public class Monster {
        9.     private Integer id;
        10.     private String name;
        11.     private String skill;
        12.     public Monster(Integer id, String name, String skill) {
        13.         this.id = id;
        14.         this.name = name;
        15.         this.skill = skill;
        16.     }
        17.     public Integer getId() {
        18.         return id;
        19.     }
        20.     public void setId(Integer id) {
        21.         this.id = id;
        22.     }
        23.     public String getName() {
        24.         return name;
        25.     }
        26.     public void setName(String name) {
        27.         this.name = name;
        28.     }
        29.     public String getSkill() {
        30.         return skill;
        31.     }
        32.     public void setSkill(String skill) {
        33.         this.skill = skill;
        34.     }
        35. }
        复制代码
        javaCode.jsp:
        1. <%@ page import="java.util.ArrayList" %>
        2. <%@ page import="com.li.entity.Monster" %>
        3. <%--
        4.   Created by IntelliJ IDEA.
        5.   User: li
        6.   Date: 2022/11/24
        7.   Time: 19:16
        8.   Version: 1.0
        9. --%>
        10. <%@ page contentType="text/html;charset=UTF-8" language="java" %>
        11. <html>
        12. <head>
        13.     <title>演示代码脚本的使用</title>
        14. </head>
        15. <body>
        16. <h1>演示代码脚本的使用</h1>
        17. <%
        18.     //先创建ArrayList,放入两个monster对象(使用的类会自动导入)
        19.     ArrayList<Monster> monsterList = new ArrayList<>();
        20.     monsterList.add(new Monster(1, "牛魔王", "芭蕉扇"));
        21.     monsterList.add(new Monster(2, "蜘蛛精", "吐丝"));
        22. %>
        23. </body>
        24. <%--tr 是行标签,th是表头标签,td是单元格标签--%>
        25. <table bgcolor="#f0f8ff" border="1px" width="300px">
        26.     <tr>
        27.         <th>id</th>
        28.         <th>名字</th>
        29.         <th>技能</th>
        30.     </tr>
        31.     <%
        32.         for (int i = 0; i < monsterList.size(); i++) {
        33.             //先取出monster对象
        34.             Monster monster = monsterList.get(i);
        35.     %>
        36.             <tr>
        37.                 <th><%=monster.getId()%></th>
        38.                 <th><%=monster.getName()%></th>
        39.                 <th><%=monster.getSkill()%></th>
        40.             </tr>
        41.          <%
        42.         }
        43.     %>
        44. </table>
        45. </html>
        复制代码

        • 在浏览器访问:http://localhost:8080/jsp/javaCode.jsp

        • 在Tomcat启动时的Using CATALINA_BASE:文件目录下可以看到对应jsp文件生成的java文件。
          可以看到jsp文件中的for循环被解析成如下形式:

        6.JSP注释

        jsp可以写java代码和html,可以使用java代码的注释,以及html的注释。此外还可以使用jsp自己的注释方式

        7.JSP的内置对象


        • 基本介绍

          • JSP内置对象(已经创建好的对象,可以直接使用-inbuild),是指Tomcat在翻译jsp页面成为Servlet后,内部提供的九大对象,称为内置对象
          • 内置对象可以在jsp页面直接使用,不需要手动定义

        • JSP九大内置对象

          • out:向客户端输出数据,out.println("");
          • request:客户端的http请求
          • response:响应对象
          • session:会话对象
          • application:对应 ServletContext
          • pageContext:jsp页面的上下文,是一个域对象,可以setAttribute(),作用范围是本页面
          • exception:异常对象,getMessage()
          • page:代表jsp这个实例本身
          • config:对应ServletConfig

        • 对照Servlet来理解就轻松了
          只要学某个类,建议熟悉该类的继承关系

        应用实例
        inbuild.jsp:
        1. <%--
        2.   Created by IntelliJ IDEA.
        3.   User: li
        4.   Date: 2022/11/24
        5.   Time: 20:05
        6.   Version: 1.0
        7. --%>
        8. <%@ page contentType="text/html;charset=UTF-8" language="java" %>
        9. <html>
        10. <head>
        11.     <title>jsp内置对象</title>
        12. </head>
        13. <body>
        14. <h1>jsp内置对象</h1>
        15. <%
        16.     //jsp的内置对象
        17.     //1.out 的类型是 JspWriter
        18.     out.print("jsp out");
        19.     //2.request 的类型是 HttpServletRequest
        20.     request.getParameter("age");
        21.     //3.response 的类型是 HttpServletResponse
        22.     //response.sendRedirect("http://www.baidu.com");
        23.     //4.session 的类型是 HttpSession
        24.     session.setAttribute("中国", "北京");
        25.     //5.application 的类型 ServletContext
        26.     application.setAttribute("name", "jack");
        27.     //6.pageContext 的类型是PageContext
        28.     //该对象可以存放数据(属性),但是该数据只能在本页使用
        29.     pageContext.setAttribute("age", 99);
        30.     //7.exception:异常对象使用比较少,忽略
        31.     //8.page 内置对象,类似this
        32.     out.print("page对象= " + page);//org.apache.jsp.inbuild_jsp@2ac0d5df
        33.     //9.config 的内置对象就是ServletConfig
        34.     String password = config.getInitParameter("password");
        35. %>
        36. </body>
        37. age:<%=pageContext.getAttribute("age")%>
        38. </html>
        复制代码
        对照一下servlet的对象使用,其实是大同小异的:

        免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!

本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有账号?立即注册

x
回复

使用道具 举报

0 个回复

正序浏览

快速回复

您需要登录后才可以回帖 登录 or 立即注册

本版积分规则

商道如狼道

金牌会员
这个人很懒什么都没写!

标签云

快速回复 返回顶部 返回列表