скрипт блокировки хостинга firebase из-за проблемы с CORS

Question

Я использую хостинг Firebase для размещения нескольких скриптов и пытаюсь получить к ним доступ с другого сайта. это естественно блокируется из-за проблем с CORS. основываясь на моих исследованиях в других темах форума и т.д., я изменил firebase.json как показано ниже

{
  "hosting": {
    "public": "public",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ],
    "headers": [ {
    "source" : "**",
    "headers" : [ {
      "key" : "Access-Control-Allow-Origin",
      "value" : "*"
    } ]
  }]
}
}

, которые по сути позволяют любому URL получить доступ к ресурсам, размещенным здесь. однако, пытаясь запустить мой сайт, я все равно вижу ниже

        Access to XMLHttpRequest at 'https://oracle-bot-sdk.firebaseapp.com//loader.json' 
    from origin 'https://insurance-bot.moblize.it' has been blocked by CORS policy: 
No 'Access-Control-Allow-Origin' header is present on the requested resource.

что еще нужно?

Answer 1

Убедитесь, что у вас есть план Blaze или Flame, я думаю, что план Spark блокирует внешний доступ, возможно, по той же причине, что и с облачными функциями

Облачные функции для Firebase - учетная запись не настроена

Answer 2

В дополнение к вашим изменениям в firebase.json для cors, функция http / https для ваших функций firebase должна также включать плагин cors.

* ** 1003 тысяча два * Пример

const cors = require('cors')({origin: true});
const functions = require('firebase-functions');

const app = functions.https.onRequest((req, res) => {
    cors(req, res, () => {
        // Your app stuff here

        // Send Response
        res.status(200).send(<response data>);
    });
});

Пример приложения Express

import express from "express";
const cors = require('cors')({origin: true});

const app = express();
app.get('**', (req, res) => {
  cors(req, res, () => {
      // Your App Here

      // Send response
      res.status(200).send(<response data>);
    });
});

Дополнительная документация Обслуживание динамического контента с облачными функциями - создание функции HTTP для вашего хостинга ( Cors не упоминается в документации, кстати )

Answer 3

Полагаю, вы перепутали функции хостинга Firebase и облачных функций Firebase. Firebase хостинг предназначен для размещения статических веб-сайтов и веб-приложений. Когда вы пытаетесь получить доступ с вашего веб-сайта, размещенного на другом домене, ваша конфигурация хостинга не применяется. Вы упомянули, что у вас есть несколько скриптов, и это звучит как облачные функции. А старые добрые заголовки CORS могут помочь вашим облачным функциям, таким как:

exports.corsEnabledFunction = (req, res) => {
  res.set("Access-Control-Allow-Origin", "*");
  res.set("Access-Control-Allow-Methods", "GET");
  res.set("Access-Control-Allow-Headers", "Content-Type");
  res.set("Access-Control-Max-Age", "3600");

  // Continue with function code
  ...
}

Подробнее: https://cloud.google.com/functions/docs/writing/http#handling_cors_requests

Answer 4

Является ли сайт (https://insurance -bot.moblize.it / ), который вызывает https://oracle -bot-sdk.firebaseapp.com приложением, размещенным на Firebase?

Я только спрашиваю, потому что с версией 4.2+ Firebase Tools позволяет вам настраивать мультисайтовый хостинг, используя тот же проект Firebase. Я не уверен, поможет ли это вашей ситуации вообще. Просто хотел упомянуть об этом.

В сообщении об ошибке:

insurance-bot.moblize.it/:1 Failed to load https://oracle-bot-sdk.firebaseapp.com//loader.json: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://insurance-bot.moblize.it' is therefore not allowed access.

Я заметил дополнительный '/' в https://oracle -bot-sdk.firebaseapp.com // loader.json . Я сомневаюсь, что это проблема, но хотел упомянуть об этом.

Есть кое-что, что вы могли бы попробовать. Аналогично ответам выше, но немного по-другому:

"headers": [
    {
        "source": "*",
        "headers": [
            {
                "key": "Access-Control-Allow-Origin",
                "value": "*"
            }
        ]
    }
]

Также я бы прочитал некоторую информацию здесь: https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS#Access-Control-Allow-Origin Если вы еще этого не сделали.

Я надеюсь, что смог чем-то помочь. Дайте мне знать.

Answer 5

Попробуйте вставить это, как прямо из документации, Настроить поведение хостинга :

"hosting": {
  // Add the "headers" section within "hosting".
  "headers": [ {
    "source" : "**/*.@(eot|otf|ttf|ttc|woff|font.css)",
    "headers" : [ {
      "key" : "Access-Control-Allow-Origin",
      "value" : "*"
    } ]
  }
}