SVG-файл не загружается должным образом на движке приложения

Question

У меня angular приложение, развернутое в ядре приложения. У меня есть некоторые ресурсы изображения для загрузки на определенной странице приложения. Когда я обслуживаю его локально, используя live-server, он прекрасно работает.

live-server --port = 8080 --entry-file =. / Index. html

Однако, когда я внедряю в движке приложения, один из моих файлов SVG загружается на страницу, хотя, когда я пытаюсь проверить элемент, он есть, но цвет невидим.

Вот мой (app.yaml ) файл:

runtime: python27
threadsafe: true
api_version: 1

handlers:
- url: /(.*\.(gif|png|jpeg|jpg|css|js|ico|svg))$
  static_files: knowledge-space/\1
  upload: knowledge-space/(.*)

- url: /(.*)
  static_files: knowledge-space/index.html
  upload: knowledge-space/index.html

Вот файл svg (star-rating.icons.svg):

    <symbol id="star-empty" viewBox="0 0 34 32">
        <path class="path-star-empty"
              d="M33.412 12.395l-11.842-1.021-4.628-10.904-4.628 10.92-11.842 1.005 8.993 7.791-2.701 11.579 10.179-6.144 10.179 6.144-2.685-11.579 8.976-7.791zM16.941 22.541l-6.193 3.739 1.647-7.049-5.468-4.744 7.214-0.626 2.8-6.638 2.816 6.654 7.214 0.626-5.468 4.744 1.647 7.049-6.209-3.755z"/>
    </symbol>

    <symbol id="star-half" viewBox="0 0 34 32">
        <path class="path-star-half"
              d="M 33.412,12.395 21.57,11.374 16.942,0.47 12.314,11.39 0.472,12.395 9.465,20.186 6.764,31.765 16.943,25.621 27.122,31.765 24.437,20.186 33.413,12.395 Z M 16.941,22.541 c 0,0 -0.297971,-14.6455833 0,-15.318 l 2.816,6.654 7.214,0.626 -5.468,4.744 1.647,7.049 z"/>
        </symbol>

    <symbol id="star-filled" viewBox="0 0 34 32">
        <path class="path-star-filled"
              d="M16.941 25.621l10.179 6.144-2.701-11.579 8.993-7.791-11.842-1.005-4.628-10.92-4.628 10.92-11.842 1.005 8.993 7.791-2.701 11.579z"/>
    </symbol>

</defs>

Answer 1

Есть несколько возможных решений для этого. В большинстве случаев это связано с конфигурацией в файле app.yaml - например, это может быть связано с типом Mime, читаемым в файле app.yaml. Учитывая это, я бы порекомендовал вам взглянуть на следующие сообщения Сообщества, где есть подобные случаи с вашими, о том, как загружать изображения (SVG) на веб-страницах.

• Как настроить Google AppEngine для работы с векторной графикой c?
• Google App Engine отправляет SVG с неверным MIME-типом

В дополнение к этому, есть еще один пост от сообщества - Изображения не отображаются html - который может помочь вам, предоставляя решение с использованием тега <img>, которое я бы порекомендовал вам посмотреть .

Я нашел эту статью, в которой показано, как использовать SVG с нуля, на случай, если вы захотите взглянуть также: Использование Google App Engine для обслуживания файлов SVG

Дайте мне знать, помогла ли вам информация!