Не удается найти изображения и файлы - PullRequest
0 голосов
/ 07 января 2020

Мое Angular приложение обслуживается сервером Play. Приложение не может найти изображения и шрифты, которые я добавил в компонент, когда я создаю приложение и запускаю его.

Доступ к изображениям осуществляется в компоненте. html следующим образом

<div id="nav" class="nav-style nav-flexbox-container">
    <img id="stats-icon-pic" src="assets/images/StatsIcon.png">
    <img id="mail-icon-pic" src="assets/images/MailIcon.png">
    <img id="profile-pic" src="assets/images/ExampleProfilePic.png">
  </div>

Шрифты используются как

@font-face{
  font-family:"solway-bold";
  src:url(../../assets/fonts/solway/fonts/Solway-Bold.ttf);
}

, изображения и шрифты находятся в папке активов в Angular приложении

enter image description here

Когда я создаю приложение, я использую папку publi c Play в качестве выходного каталога.

"build": "ng build --output-path ../public/ui",

У меня две проблемы

1) Приложение не может найти изображения и шрифты

enter image description here

Я вижу следующее сообщение об ошибке в моем Play приложении

[trace] u.CustomHttpErrorHandler - client error: request GET /assets/images/ExampleLogo.png, statusCode: 404, message:Resource not found by Assets controller
[trace] u.CustomHttpErrorHandler - client error: request GET /assets/images/MailIcon.png, statusCode: 404, message:Resource not found by Assets controller
[trace] u.CustomHttpErrorHandler - client error: request GET /assets/images/ExampleProfilePic.png, statusCode: 404, message:Resource not found by Assets controller
[trace] u.CustomHttpErrorHandler - client error: request GET /assets/images/StatsIcon.png, statusCode: 404, message:Resource not found by Assets controller
[trace] u.CustomHttpErrorHandler - client error: request GET /Solway-ExtraBold.ttf, statusCode: 404, message:
[trace] u.CustomHttpErrorHandler - client error: request GET /Solway-Light.ttf, statusCode: 404, message:

Я изменил путь к изображениям в src на ui/assets/images/StatsIcon.png, но все равно получаю ошибку client error: request GET /ui/assets/images/StatsIcon.png, statusCode: 404, message:

2) файлы шрифтов копируются как в папку ui/assets/fonts/..., так и в папку ui/assets/ верхнего уровня. Почему?

enter image description here

1 Ответ

0 голосов
/ 07 января 2020

Проблема не в Angular, а в неправильном использовании в play фреймворке. Play имеет правило маршрута

GET     /assets/*file               controllers.Assets.versioned(path="/public", file: Asset)

Вышеуказанное означает, что все запросы на ресурсы с путем /assets/abc/def должны быть взяты из папки /public/abc/def. В моем случае ресурсы находятся по адресу /public/ui/assets/images. So I had to change thesrcin the Angularhtmlto. This makes requests with pathassets/ui/assets/images/example-logo.png which gets mapped to the path публичный / щ / активы / изображения / пример-ло go .png`

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...