web-dev-qa-db-fra.com

fireBase hébergeant le script de blocage en raison d'un problème lié à CORS

J'utilise un hébergement firebase pour héberger quelques scripts et j'essaie d'y accéder depuis un autre site. il est naturellement bloqué en raison de problèmes liés à la CORS. sur la base de mes recherches sur d'autres sujets de forum, etc., j'ai modifié le fichier firebase.json comme indiqué

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

qui permettent essentiellement aux URL d’accéder aux ressources hébergées ici. cependant, en essayant de faire tourner mon site, je vois encore ci-dessous 

        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.

quoi d'autre est nécessaire?

firebasecorsfirebase-hosting
11
Vik

En plus de vos modifications firebase.json pour cors, la fonction http/https de vos fonctions firebase doit également inclure le plug-in cors.

Exemple

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>);
    });
});

Exemple d'application rapide

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>);
    });
});

Plus de documentation Servir du contenu dynamique avec des fonctions de cloud - Créez une fonction HTTP sur votre site d'hébergement (Cors n'est pas mentionné dans la documentation)

1
Matthew Rideout

Essayez de coller ceci car il provient directement de la documentation, Personnalisation du comportement d'hébergement :

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

Le site ( https://insurance-bot.moblize.it/ ) qui appelle vers https://Oracle-bot-sdk.firebaseapp.com est-il une application hébergée Firebase?

Je demande seulement parce qu'avec la version 4.2+ de Firebase Tools vous permet de configurer un hébergement multisite en utilisant le même projet Firebase. Je ne suis pas sûr que cela puisse vous aider du tout. je voulais juste le mentionner.

Dans le message d'erreur:

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.

J'ai remarqué un '/' supplémentaire dans https://Oracle-bot-sdk.firebaseapp.com//loader.json . Je doute que ce soit le problème, mais je voulais le mentionner.

Il y a quelque chose que vous pourriez essayer. Semblable aux réponses ci-dessus mais un peu différent:

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

Aussi je voudrais lire certaines des informations ici: https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS#Access-Control-Allow-Origin Si vous ne l'avez pas déjà fait.

J'espère que j'ai pu aider d'une certaine manière. Faites le moi savoir.

0
Jared

Assurez-vous que vous avez le plan Blaze ou Flame, je pense que le plan Spark bloque l'accès externe, peut-être pour la même raison que pour les fonctions cloud

Fonctions Cloud pour Firebase - Compte de facturation non configuré

0
Marc D

Je suppose que vous avez mélangé les fonctions d’hébergement firebase et de cloud firebase. L'hébergement Firebase est conçu pour l'hébergement de sites Web statiques et d'applications Web. Lorsque vous essayez d'accéder à partir de votre site Web hébergé sur un domaine différent, votre configuration d'hébergement n'est pas appliquée. Vous avez mentionné que vous hébergez des scripts et que cela ressemble à des fonctions cloud. Et les bons vieux en-têtes CORS peuvent vous aider dans vos fonctions cloud telles que:

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
  ...
}

Plus d'infos: https://cloud.google.com/functions/docs/writing/http#handling_cors_requests

0
Yevgen