Как использовать Angular с Liberty WebSphere Server

У меня есть проект на работе, который использует AngularJS + JSP на Liberty WebSphere Server 17.0.0.2, и теперь мне нужно обновить его. Проект необходимо обновить до Angular 4 + Liberty, и я понятия не имею, как это сделать правильно.

То, что я пробовал сейчас, это:

Создал проект с помощью Angular-CLI для создания папки dist. Затем я поместил dist в WEB-INF > представления. Я также сделал ссылки на spring-context.xml, web.xml и server.xml (на стороне Liberty), но все, что я получаю, это ошибка 404 при попытке доступа к localhost: 9090/AngularPoC/dist/index

Заранее спасибо.


angular websphere-liberty jakarta-ee open-liberty
person Arthur Gomes    schedule 20.03.2018    source источник
comment
Когда вы говорите WEB-INF › представления, вы имеете в виду папку представлений внутри WEB-INF? Что произойдет, если вы попытаетесь получить доступ к файлу как index.html, а не просто как index? Вы сделали некоторую настройку, чтобы не было необходимости ссылаться на папку представлений в пути к вашим статическим файлам?   -  person lwestby    schedule 21.03.2018
comment
Контент в WEB-INF веб-приложения не обслуживается через http из соображений безопасности, я думаю, вам нужно положить пыль в корень веб-приложения.   -  person Alasdair    schedule 21.03.2018
comment
Это должно было быть рассеянием, а не пылью. Автокоррекция.   -  person Alasdair    schedule 21.03.2018
comment
Если вы наведете курсор мыши на свое сообщение, в конце появится маленький значок карандаша, который позволит вам его отредактировать. Трудно найти :)   -  person lwestby    schedule 21.03.2018
comment
Я получаю то же сообщение об ошибке при попытке доступа к index.html и index. Я настроил так, чтобы не было необходимости добавлять .html в конец.   -  person Arthur Gomes    schedule 21.03.2018

Ответы (1)


arrow_upward
5
arrow_downward

Я напишу обзор того, как я настроил свои приложения Angular для обслуживания через (Open) Liberty:

  1. Скопируйте продукт команды ng build в корень файла .war. Это означает размещение его в другом месте в зависимости от того, как вы выполняете сборку. Если вы используете Eclipse/WDT, это, вероятно, означает, что вывод будет вашей папкой WebContent. Если вы используете Gradle с военным плагином, он переходит прямо в src/main/webapp. Хотя изначально я установил выходную папку с помощью ng build --output-dir=..., я обнаружил, что это удаляет папку, поэтому я терял свой файл web.xml при каждой сборке. Я бы порекомендовал скопировать содержимое dist на более позднем этапе вашей сборки, если вы не согласны с обслуживанием из подпапки корня контекста.

  2. Настройте перенаправление ошибок для глубинных ссылок. Если вы используете модуль Angular Router, вам необходимо настроить связывание и обновление глубинных маршрутов. По умолчанию Liberty выдает страницу ошибки 404 для любого несуществующего пути. Если пользователь обновит страницу, когда строка URL содержит глубокий маршрут в ваше приложение, он получит эту страницу с ошибкой. Вам нужно будет настроить его так, чтобы все 404 запроса направлялись обратно к вашему index.html (location обычно должен указывать на то же место, что и base-href, см. ниже.) В web.xml у меня есть

    <error-page>
    <error-code>404</error-code>
    <location>/</location>
</error-page>

    Другой вариант — использовать HashLocationStrategy, который использует старый синтаксис привязки. Маршрут помещается в хеш-фрагмент URL-адреса. Это означает, что вам не нужно настраивать страницу ошибки, но это также означает, что вы не сможете беспрепятственно заменить глубокий маршрут отдельной страницей в будущем — людям придется обновлять закладки, если они у них есть. .

    Это делается путем обновления вашего файла app-routing.module.ts, чтобы указать RouterModule.forRoot(routes, {useHash: true}) в строке импорта.

  3. Убедитесь, что base-href совпадает. Убедитесь, что base-href в вашем index.html указывает на путь, содержащий этот index.html и созданные файлы CSS и JS из сборки. В противном случае вы не заметите, что ничего не загружается, и вы получите кучу ошибок 404 в своем веб-инспекторе. Если контекст-корень изменяется, это значение необходимо обновить. Мое веб-приложение обычно имеет контекстный корень / с index.html непосредственно под ним, поэтому мой base-href равен /.

person lwestby    schedule 21.03.2018
comment
Спасибо за напоминание помещать файлы JSP в папку WebContent, а не в папку WEB-INF! Решил мою проблему, просто перетащив jsp в WebContent - person JesseBoyd; 04.11.2018