установка корня документа в Angular 5.6.0 за прокси-сервером Varnish

Мое приложение Angular 5 будет работать за прокси-сервером лака. Скажем, наш корпоративный веб-сайт работает на test.corporate.com, а мой локальный компьютер — на dev5.local, тогда лак сейчас, на данный момент, настроен системным управлением на точку https://test.corporate.com/albert на http://dev5.local:4200/ (но они могут указывать на что угодно). Это прокси, а не редирект. В моем angular index.html, работающем с ng-serve, я настроил documentroot:

<base href="/albert/">

Когда я перехожу в своем браузере на https://test.corporate.com/albert/, html моего index.html загружается, но все остальные файлы (css, javascript) не загружаются. То же самое происходит, когда я перехожу на http://dev5.local:4200/, но последний не 't work имеет смысл из-за documentroot.

Мы пробовали варианты вышеуказанной конфигурации лака и документа, но, похоже, ничего не работает. С приведенной выше конфигурацией, которая является вариантом, который имеет для меня наибольший смысл, он пытается и не может загрузить https://test.corporate.com/albert/inline.bundle.js . Я также, похоже, не могу вручную отредактировать URL-адрес и посмотреть, смогу ли я загрузить этот js-файл в свой браузер, например. https://test.corporate.com/albert/albert/inline.bundle.js также дает «не найдено» с перенаправлением.

Поскольку html загружается, он не должен быть связан с http и https.


person Albert Hendriks    schedule 15.05.2018    source источник
comment
Итак, вы видите тег base в обслуживаемом html? Если это так, вам нужно убедиться, что статические файлы загружаются с использованием таких путей, как static/js/app.js, а не /static/js/app.js или ./static/js/app.js.   -  person Tarun Lalwani    schedule 19.05.2018
comment
У меня нет опыта работы с Varnish, но один из вариантов, который помог мне в какой-то момент, заключается в том, чтобы заставить базовый href обслуживать файлы, сделав путь относительным «./albert/» и настроив все внедренные файлы в index.html для использования относительного путь вместо абсолютного. Это решение может работать в производственной сборке.   -  person Sameh Awad    schedule 22.05.2018
comment
Извините, я ошибся версией Angular, она должна быть 5.6.0. Я не знаю, повлияет ли это на текущие комментарии и ответ, но я собираюсь отредактировать вопрос.   -  person Albert Hendriks    schedule 22.05.2018


Ответы (3)


Я не уверен насчет Varnish Proxy, но я столкнулся с этой же проблемой при развертывании моего кода на сервере apache-tomcat и обслуживании сайта не из «/», а из «/anotherPath/» в angular 4.

Что я сделал, так это при создании приложения, которое я добавил ниже 2 атрибутов в команду сборки.

ng build --prod --base-href "/" --deployUrl="/anotherPath/"

Опубликуйте эту сборку, я обновил <base href="/"> до <base href="/anotherPath/"> в файле index.html во вновь созданной папке dist, а затем развернул ее на сервере.

Это был обходной путь, который решил мою проблему.

Как только вы это исправите, вы также можете столкнуться с другой проблемой, т. е. перезагрузка не будет работать, так как вы будете обслуживать с «/anotherPath/», а не с «/». Например, при перезагрузке https://test.corporate.com/albert/user/login вы получите сообщение об ошибке.

Для этого в apache-tomcat были настроены правила перезаписи. Пожалуйста, дайте мне знать, если вам нужна дополнительная информация.

person djain4    schedule 25.05.2018

У вас есть два варианта: просмотреть все ваши статические файлы и добавить их относительные пути в index.html.

OR

Вы можете использовать средство запуска задач, например Grunt, с такими пакетами, как grunt-injector, с помощью которого вы можете проверить наличие всех статических файлов, которые вы хотите использовать, из папки проекта, и он автоматически добавит относительный путь внутри файл index.html.

person Abhishek Singh    schedule 21.05.2018
comment
Проблема также в том, что я не могу загрузить статические файлы напрямую через адрес браузера. Так что кажется, что статические файлы вообще не обслуживаются. - person Albert Hendriks; 21.05.2018
comment
Вы пытались получить доступ к одному из ваших статических файлов, удаляя base-href из URL-адреса? - person Abhishek Singh; 22.05.2018
comment
Я пробовал варианты URL-адреса, но удаление /albert/ не работает, так как лак не пересылает его. - person Albert Hendriks; 22.05.2018
comment
Если вы используете URL-адрес с базовым href, ссылка всегда будет рассматриваться как угловой маршрут, а не как статический путь к файлу. Нужно искать добавление фильтра в конфигурации лака для /albert/. - person Abhishek Singh; 22.05.2018

Вы можете сделать что-то вроде этого (в зависимости от конфигурации маршрутизатора):

<!--angular routing-->
<script type="text/javascript">
   document.write('<base href="' + document.location.href.split('#')[0] + '" />');
</script>
person kemsky    schedule 23.05.2018