Рубрики
Без рубрики

Введение в веб-семинары

Краткое и практическое руководство по использованию веб-сайтов с Spring.

Автор оригинала: baeldung.

1. Обзор

Этот учебник знакомит с веб-сайтами и с тем, как их использовать в Java-приложении.

Проще говоря, WebJars-это зависимости на стороне клиента, упакованные в файлы архива JAR. Они работают с большинством контейнеров JVM и веб-фреймворков.

Вот несколько популярных веб-сайтов: Twitter Bootstrap , jQuery , Angular JS , Chart.js и т.д.; полный список доступен на официальном сайте .

2. Зачем использовать веб-сайты?

На этот вопрос есть очень простой ответ – потому что это легко.

Ручное добавление и управление зависимостями на стороне клиента часто приводит к трудностям в обслуживании баз кода .

Кроме того, большинство разработчиков Java предпочитают использовать Maven и Gradle в качестве инструментов управления сборкой и зависимостями.

Основная проблема, которую решает WebJars, заключается в том, чтобы сделать зависимости на стороне клиента доступными для Maven Central и пригодными для использования в любом стандартном проекте Maven.

Вот несколько интересных преимуществ веб-семинаров:

  1. Мы можем явно и легко управлять зависимостями на стороне клиента в веб-приложениях на основе JVM
  2. Мы можем использовать их с любым широко используемым инструментом сборки, например: Maven, Gradle и т. Д
  3. Веб-джары ведут себя так же, как и любая другая зависимость Maven, что означает, что мы также получаем транзитивные зависимости

3. Зависимость Maven

Давайте сразу перейдем к этому и добавим Twitter Bootstrap и jQuery в pom.xml :


    org.webjars
    bootstrap
    3.3.7-1


    org.webjars
    jquery
    3.1.1

Теперь Twitter Bootstrap и jQuery доступны в пути к классам проекта; мы можем просто ссылаться на них и использовать их в нашем приложении.

Примечание: Вы можете проверить последнюю версию Twitter Bootstrap и jQuery зависимостей от Maven Central.

4. Простое приложение

Теперь, когда эти две зависимости веб-Jar определены, давайте создадим простой проект Spring MVC, чтобы иметь возможность использовать зависимости на стороне клиента.

Однако, прежде чем мы перейдем к этому , важно понять, что Веб-сайты не имеют ничего общего с Spring , и мы используем Spring здесь только потому, что это очень быстрый и простой способ настроить проект MVC.

Вот хорошее место для начала настройки проекта Spring MVC и Spring Boot.

И, с помощью простой настройки проекта, мы определим некоторые сопоставления для наших новых клиентских зависимостей:

@Configuration
@EnableWebMvc
public class WebConfig implements WebMvcConfigurer {

    @Override
    public void addResourceHandlers(ResourceHandlerRegistry registry) {
        registry
          .addResourceHandler("/webjars/**")
          .addResourceLocations("/webjars/");
    }
}

Конечно, мы можем сделать это и с помощью XML:

5. Зависимости От Версии

При использовании Spring Framework версии 4.2 или выше он автоматически обнаружит библиотеку webjars-locator в пути к классу и использует ее для автоматического разрешения версии любых ресурсов WebJars.

Чтобы включить эту функцию, мы добавим библиотеку webjars-locator в качестве зависимости приложения:


    org.webjars
    webjars-locator
    0.30

В этом случае мы можем ссылаться на ресурсы WebJars без использования версии; см. Следующий раздел для нескольких реальных примеров.

6. Веб-семинары на Клиенте

Давайте добавим простую HTML-страницу приветствия в ваше приложение (это index.html ):


    
        WebJars Demo

Теперь мы можем использовать Twitter Bootstrap и jQuery в проекте – давайте использовать оба на нашей странице приветствия, начиная с Bootstrap:

Для версии-агностический подход:

Добавить jQuery:

И версия-агностический подход:

7. Тестирование

Теперь, когда мы добавили Twitter Bootstrap и jQuery на нашу HTML-страницу, давайте протестируем их.

Мы добавим bootstrap alert на нашу страницу:



    
         
        Success! It is working as we expected.

Обратите внимание, что здесь предполагается некоторое базовое понимание начальной загрузки Twitter; вот руководство по началу работы на официальном сайте.

Это покажет alert , как показано ниже, что означает, что мы успешно добавили загрузчик Twitter в наш путь к классам.

Давайте теперь воспользуемся jQuery. Мы добавим кнопку закрытия к этому оповещению:

×

Теперь нам нужно добавить jQuery и bootstrap.min.js для функциональности кнопки закрытия, поэтому добавьте их в тег тела index.html, как показано ниже:

Примечание: Если вы используете подход, не зависящий от версии, обязательно удалите только версию из пути, в противном случае относительный импорт может не сработать:

Вот как должна выглядеть наша заключительная страница приветствия:


    
        
        
        WebJars Demo
        
    
    
        


            

                ×
                Success! It is working as we expected.

Вот как должно выглядеть приложение. (И предупреждение должно исчезнуть при нажатии кнопки закрытия.)

webinarsdemo

8. Заключение

В этой краткой статье мы сосредоточились на основах использования WebJars в проекте на базе JVM, что значительно упрощает разработку и обслуживание.

Мы реализовали проект с поддержкой Spring Boot и использовали Twitter Bootstrap и jQuery в нашем проекте с помощью WebJars.

Исходный код приведенного выше примера можно найти в проекте Github -это проект Maven, поэтому его должно быть легко импортировать и создавать.

Читайте ещё по теме: