Манифест: строка: 1, столбец: 1, синтаксическая ошибка. Ошибка с AWS - PullRequest
Новая
       103

Манифест: строка: 1, столбец: 1, синтаксическая ошибка. Ошибка с AWS

0 голосов
/ 19 марта 2020

У меня есть приложение Angular 8, и я выполнил эту команду, чтобы попытаться настроить функциональность PWA: 

$ ng add @angular/pwa --project my-app

Оттуда файлы, кажется, настроены так, как вы ожидаете для PWA, как описано здесь .

Никаких ошибок в разработке.

Однако я сейчас запустил приложение в производство, размещенное через AWS Amplify, и я считаю, эта попытка добавления функциональности PWA создала проблемы.

Как только браузер загружает производственное приложение, он «застревает» в этой версии приложения. Так, например, мой браузер chrome по-прежнему загружается с первой версией приложения несколько дней назад, хотя с тех пор я несколько раз обновлял приложение при усилении. Это также происходило в других браузерах, таких как мобильное сафари.

Когда он загружает старую версию, в инспекторе появляется эта ошибка: 

Manifest: Line: 1, column: 1, Syntax error.

Так что в некотором смысле AWS не ладить с чем-то относительно функциональности PWA. Есть ли известное исправление для этого?

Это приложение уже в разработке, поэтому я очень признателен за вашу помощь.

Подробнее:

Для получения дополнительной информации, мой индекс. html включает следующее: 

 <link rel="manifest" href="manifest.webmanifest">

И в папке app / sr c находится файл manifest.webmanifest: 

{
  "name": "My App",
  "short_name": "My App",
  "theme_color": "#1976d2",
  "background_color": "#fafafa",
  "display": "standalone",
  "scope": "./",
  "start_url": "./",
  "icons": [
    {
      "src": "assets/icons/icon-72x72.png",
      "sizes": "72x72",
      "type": "image/png"
    },
    {
      "src": "assets/icons/icon-96x96.png",
      "sizes": "96x96",
      "type": "image/png"
    },
    {
      "src": "assets/icons/icon-128x128.png",
      "sizes": "128x128",
      "type": "image/png"
    },
    {
      "src": "assets/icons/icon-144x144.png",
      "sizes": "144x144",
      "type": "image/png"
    },
    {
      "src": "assets/icons/icon-152x152.png",
      "sizes": "152x152",
      "type": "image/png"
    },
    {
      "src": "assets/icons/icon-192x192.png",
      "sizes": "192x192",
      "type": "image/png"
    },
    {
      "src": "assets/icons/icon-384x384.png",
      "sizes": "384x384",
      "type": "image/png"
    },
    {
      "src": "assets/icons/icon-512x512.png",
      "sizes": "512x512",
      "type": "image/png"
    }
  ]
}

Также отмечу, что с самого начала Angular приложение, запущенное на Amplify, создало несколько проблем. Для начала работы приложения требовалось добавить следующее:

Переписывает и перенаправляет:

Исходный адрес 

</^[^.]+$|\.(?!(css|gif|ico|jpg|js|png|txt|svg|woff|map|json|mp3|tff)$)([^.]+$)/>

Целевой адрес 

/index.html

Тип 

200 (Rewrite)

1 Ответ

0 голосов
/ 23 марта 2020

Как я уже отмечал в вопросе, чтобы заставить Amplify работать с Angular, мне пришлось добавить перенаправление следующим образом:

Исходный адрес 

</^[^.]+$|\.(?!(css|gif|ico|jpg|js|png|txt|svg|woff|map|json|mp3|tff)$)([^.]+$)/>

Целевой адрес 

/index.html

Тип 

200 (Rewrite)

В результате получается, что Amplify будет перенаправлять файл манифеста (которого не было в группе типов файлов в разделе "Адрес источника"). "), поэтому для файла манифеста вообще ничего не будет отображаться.

Я добавил тип файла webmanifest в группу, и теперь он работает без ошибок:

Адрес источника 

</^[^.]+$|\.(?!(css|gif|ico|jpg|js|png|txt|svg|woff|map|json|mp3|tff|webmanifest)$)([^.]+$)/>

Целевой адрес 

/index.html

Тип 

200 (Rewrite)
...