Что такое jsp

Продолжаем изучать java веб и сегодня мы узнаем об jsp страницах:

  • что это такое;
  • как работает jsp;
  • как работать с jsp.

JSP (Java server pages) — это технология, которая позволяет внедрять Java-код, а также EL (expression language) в статичное содержимое страницы) и позволяющая веб-разработчикам динамически генерировать HTML, XML и другие веб-страницы. JSP является составной частью единой технологии создания бизнес-приложений J2EE.

JSP — может выполняться практически на любом веб сервере, так как эта технология основана на языке программирования Java, который не зависит от платформы. Java server pages поддерживает теги HTML, Javascript, а также собственный набор тегов.

JSP — позволяет отделить динамическую часть страницы от статической. Эта технология предусматривает вставку Java кода в страницу. Мы не будем рассматривать такой вариант использования JSP поскольку эта технология считается устаревшей и несовершенной. Причина проста: разработчики дизайнеры, которые разрабатывают внешний вид страницы не всегда могут быть знакомы с Java и это может вызвать дополнительные трудности при редактировании или поддержке веб приложений.

Вместо вставки Java кода сейчас используется библиотека тегов jstl или Javascript для совсем продвинутых. Мы рассмотрим пример именно с jstl тегами. Это очень удобная библиотека, которая имеет почти весь функционал, который необходим при создании динамических страниц. Если нужно что-то специфическое, то всегда можно написать собственный тег и вставить его содержимое на страницу.

Мы уже частично знакомы с JSP по первым веб статьям. Основная часть JSP страницы это HTML, в которую вставляются теги с динамическим содержимым.

Пример JSP страницы

Очень необходимым знанием, которым мы будем пользоваться является директива JSP.

Директива JSP — это сообщение, которое страница может послать соответствующему контейнеру с указанием действий. Синтаксис директивы:<%@ директива атрибут=«значение» %>

Есть три основных типа директив:

  1. page (может использоваться для импорта классов);
  2. include (дает вам возможность вставить файл в класс сервлета при трансляции JSP файла в сервлет);
  3. taglib (дает возможность подключить библиотеку тегов).

Так, как код в страницу мы вставлять не будем, рассмотрим последние две директивы.

Include

Например у нас есть страницы, которые будут иметь одинаковую верхнюю и нижнюю часть. Очень распространенный шаблон, в котором футер и хедер одинаковы для всех страниц. Для того, чтобы не писать Код этих страниц в каждом JSP файле можно вынести их код в отдельный файлы и потом подключить в нужном нам месте с помощью директивы include.

Код   
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<c:set var="language"
    value="${not empty param.language ? param.language : not empty language ? language : pageContext.request.locale}"
    scope="session" />
<fmt:setLocale value="${language}" />
<fmt:setBundle basename="message" />
<html>
<head>
<title><fmt:message key="home.title"></fmt:message></title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Bootstrap -->
<link href="resources/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<!-- styles -->
<link href="resources/css/styles.css" rel="stylesheet">
<script src="https://code.jquery.com/jquery.js"></script>
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
      <script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
    <![endif]-->
</head>
<body>
    <jsp:include page="template/header.jsp" />

    <div class="page-content">
        <div class="row">
            <div class="col-md-2">
                <jsp:include page="template/sidebar.jsp" />
            </div>

Расположение файлов в проекте:

директива

Tagllib

В коде выше можно проследить использование директивы taglib. С ее помощью мы подключили библиотеку тегов jstl. С помощью этой директивы можно подключить библиотеку собственных тегов: <%@ taglib uri=»/WEB-INF/mylib.tld» prefix=»test» %>.

Заметьте, что важным атрибутом taglib является prefix. Это обязательный к использованию атрибут. С помощью prefix можно вызывать библиотеку в коде. Имя prefix можно выбирать любое. К стати, вот и использование jstl тегов на деле:

Код   
<c:forEach items="${accounts}" var="account">
<tr align="center">
<td>${account.number}</td>
<td>${account.balance}</td>
<td><c:if test="${!account.isBlocked}">${statusActive }</c:if>
<c:if test="${account.isBlocked}">${statusBlocked }</c:if></td>
<td><c:if test="${!account.isBlocked}">
<a href="?command=blockaccount&accountId=${account.accountId}">${block }</a>
</c:if></td>
<td><a href="?command=showinfo&accountId=${account.accountId}">${showInfo }</a></td>       
</tr>
</c:forEach>

Код выше демонстрирует вывод всех элементов списка. О том, как мы его передали на страницу будет в следующих статьях. Его синтаксис:

<c:forEach items=”${list}” begin=”5” end=”20” step=”4” var=”item”> ${item} </c:forEach>

Код   
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<c:set var="language"
    value="${not empty param.language ? param.language : not empty language ? language : pageContext.request.locale}"
    scope="session" />
<fmt:setLocale value="${language}" />
<fmt:setBundle basename="message" />
<div class="sidebar content-box" style="display: block;">
    <ul class="nav">
        <!-- Main menu -->
        <li class="current"><a href="/"><i
                class="glyphicon glyphicon-home"></i><fmt:message key="sidebar.home"></fmt:message></a></li>
        <li><c:if test="${currentUser.role.id==2 }">
        <form action="add-user" method="post">
        <fmt:message key="sidebar.addUser" var="addNewUser"></fmt:message>
        <input type="hidden" name="command" value="adduser">
        <input type="submit" value="${addNewUser}">
        </form>
            </c:if></li>
        <li><c:if test="${currentUser.role.id==1 }">
                <a href="?command=create-payment"><fmt:message key="sidebar.createPayment"></fmt:message></a>
            </c:if></li>
    </ul>
</div>

Это код сайдбара, который подключался выше. Как видим, здесь используется разветвления, чтобы вывести только ту информацию, которая доступна определенном типу пользователя.

Синтаксис: <c:if test=”${a == b}”>
a equals b
</c:if>

Лучше всего рассматривать теги jstl при написании реального проекта, так как я не вижу смысла учить и запоминать весь синтаксис для каждого действия. Код выше должен послужить только примером, как это используется. Не нужно ничего заучивать. Когда Вы будете писать код, тогда и обратитесь к данному синтаксису.

К стати, код проекта, с которого был взят этот код, находится тут: https://github.com/caligula95/payment-systemapp

Я выложил проект на heroku: https://payment-systemapp.herokuapp.com/ — тут используется бесплатный аккаунт, так что для первого запроса нужно подождать пару минут, чтобы проект запустился.

 

Понравилась статья? Поделиться с друзьями:
Добавить комментарий

;-) :| :x :twisted: :smile: :shock: :sad: :roll: :razz: :oops: :o :mrgreen: :lol: :idea: :grin: :evil: :cry: :cool: :arrow: :???: :?: :!: