Заблокирован из-за запрещенного типа mime ("text/html")
Я знаю, что есть много вопросов по этой теме, но после тщательного изучения был только один пример Firebase, и он не охватывал мой сценарий с использованием хостинга.
У меня есть приложение, которое я в настоящее время тестирую на хостинге Firebase, приложение достаточно хорошо проходит процесс извлечения данных, и данные поступают нормально при входе на первую страницу.
Когда я обновляю страницу, чтобы проверить, правильно ли используемый нами кеш извлекает данные, все приложение становится пустым, и я получаю сообщения об ошибках, показанные ниже.
После некоторого изучения того, задавался ли уже подобный пример, я обнаружил, что ошибки в консоли не обязательно указывают на реальную проблему, что делает это еще более запутанным. Чтобы помочь читателю, я включу файлы конфигурации vite и firebase, чтобы показать, что проект подключен нормально. Я также добавлю index.html в свою папку dist, чтобы показать файл .js, упомянутый в ошибке.
Одна вещь, которую я заметил при проверке своих облачных функций на серверной части, заключается в том, что функция, которая извлекает подробную информацию, срабатывает только один раз при первой успешной загрузке. Когда я обновляюсь, он снова не попадает, что наводит меня на мысль, что это может быть что-то связанное с маршрутизатором, но я не понял, в чем может быть проблема, кроме того, что docId, переданный как реквизит, недоступен. .
Я могу обновить любую страницу, где я также не передаю docId в качестве реквизита, но у меня есть некоторая путаница, я не могу воспроизвести ошибку, которую я получаю на локальном хосте. Там я могу нормально обновиться где угодно без проблем. Есть идеи, в чем здесь проблема? Я использую Vue 3 с Vite и Firebase.
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 2
Проблема здесь в вашем "rewrites", из-за которого каждый маршрут обслуживается index.html. Затем, поскольку FireFox по умолчанию является nosniff, он не работает, когда все ваши ресурсы имеют тип контента text/html.
В вашем конкретном случае посетите /assets/index.659db071.js и нажмите CTRL+u, чтобы просмотреть исходный код. Обратите внимание, что это ваш файл index.html, а не тот JavaScript, которым он должен быть.
Я зашел в файл и нажал CTRL+U и ничего не произошло. Каков порядок исправления ситуации?
Как указано в ответе @BrownieInMotion, ваше правило перезаписи для "source": "**" перенаправляет все несуществующие файлы в ваш основной /index.html файл. Поскольку ./assets/index.659db071.js не существует в вашем развернутом приложении (на момент написания текущая версия — ./assets/index.2b83c04b.js), браузер вместо этого отправляет содержимое /index.html (файл text/html). Это вызывает ошибку, которую вы видите.
Чтобы исправить правило перезаписи, чтобы оно не перенаправляло что-либо в папке /assets, вам следует обновить файл firebase.json следующим образом:
{
"hosting": {
"public": "dist",
"ignore": [
"firebase.json",
"**/.*",
"**/node_modules/**",
],
"rewrites": [
{
"source": "!/@(assets|images)/**",
"destination": "/index.html"
}
]
}
}
Здесь любой файл в папках «активы» (убедитесь, что это то же самое, что и build.assetsDir) или «изображения» (включено, чтобы показать, как указать несколько папок) не будет перенаправлен в /index.html, а вместо этого будет показан настроенная страница ошибки 404.
Кроме того, ваш index.html, вероятно, следует обновить, чтобы вместо этого ссылаться на /assets/index.****.js (обратите внимание на отсутствие . в начале), чтобы он всегда ссылался на https://example.com/assets/index.****.js вместо неправильной обработки вложенных путей, таких как https://example.com/renter-team-profile/assets/index.****.js, в вашей ошибке в вопросе. К сожалению, я недостаточно знаком с Vite, чтобы знать, где находится настройка для этого.
Я ценю тщательное руководство, Сэм! К сожалению, такое же поведение повторилось, когда я перестроил проект и повторно развернул его. Это хорошее направление для начала, очень признателен!
При дальнейшем рассмотрении кажется, что он создает этот ./assets/main.css путь к папке из моего main.js файла, куда я добавляю загрузочный и другие css, которые идут с ним.
@AdamBrashear Я только что перешел на ваш сайт и вижу, что исправление работает, как и предполагалось, однако я также вижу, что второй упомянутый мною пункт по-прежнему вызывает проблемы из-за относительных URL-адресов.
Ты был прав. Я удалил точку в vite.config, и это решило мою проблему.
В Stack Overflow, пожалуйста, не показывайте изображения текста и кода. Скопируйте текст в сам вопрос и отформатируйте его так, чтобы его было легко читать, копировать и искать. Вы можете отредактировать вопрос, чтобы исправить это, используя ссылку редактирования внизу.