Access-Control-Allow-Origin funktioniert nicht Google Cloud-Funktionen GCF

Ich fühle mich wie ein Neuling hier, aber ich versuche, zur Ausführung einer einfachen AJAX-request von einem browser aus einen Zugriff auf eine GCF und Chrome meldet:

XMLHttpRequest-Objekt kann nicht geladen werden
https://us-central1-bustling-opus-830.cloudfunctions.net/Authenticate.
Kein "Access-Control-Allow-Origin' - header vorhanden ist, auf die angeforderte
Ressource. Herkunft ' https://beast.reachboarding.com.au " ist daher nicht
wird der Zugriff erlaubt.

Habe ich eine Funktion namens Authentifizieren (wie oben gezeigt), die mit einem Eimer heißen:

bustling-opus-830.appspot.com

Ich verwendet habe, gsutil zu setzen CORS mit dem folgenden JSON-Datei:

[{
    "origin": ["https://beast.localdev.com.au","*"],
    "responseHeader": ["Content-Type"],
    "method": ["GET", "HEAD", "DELETE", "OPTIONS"],
    "maxAgeSeconds": 3600
}]

Mit dem folgenden Befehl:

gsutil cors set cors.json gs://bustling-opus-830.appspot.com/

Und dann erhalten Sie die folgende Ausgabe aus dem entsprechenden get-Befehl:

gsutil cors get gs://bustling-opus-830.appspot.com/

[{"maxAgeSeconds": 3600, "method": ["GET", "HEAD", "DELETE", "OPTIONS"], "origin": ["https://beast.localdev.com.au", "*"], "responseHeader": ["Content-Type"]}]

Ich bin mit den Standard-Beispiel-code zur Verfügung gestellt, wenn Sie erstellen eine neue Funktion, wie unten angegeben:

/**
 * Responds to any HTTP request that can provide a "message" field in the body.
 *
 * @param {!Object} req Cloud Function request context.
 * @param {!Object} res Cloud Function response context.
 */
exports.helloWorld = function helloWorld(req, res) {
    //Example input: {"message": "Hello!"}
    if (req.body.message === undefined) {
        //This is an error case, as "message" is required.
        res.status(200).send('No message defined!');
    } else {
        //Everything is okay.
        console.log(req.body.message);
        res.status(200).send(req.body.message);
    }
};

Und ein einfaches HTML mit dem folgenden Javascript-Code:

$.ajax({
    url: "https://us-central1-bustling-opus-830.cloudfunctions.net/Authenticate",
    type: "POST",
    data: {
        message: 'Testing'
    },
    dataType: 'json', 
    success: function (response) {
        console.log(response);
    },
    error: function (xhr, status) {
        console.log(xhr);
    }
});

Welche den Fehler verursacht.

In meinem DEV-Konsole sehe ich die Netzwerk-request Durchlaufen. Hier sind die HTTP-Antwort-Headern, die ich bekommen hab sind:

cache-control:private
content-encoding:gzip
content-length:27
content-type:text/html; charset=utf-8
date:Wed, 08 Feb 2017 03:45:50 GMT
etag:W/"7-274e639a"
function-execution-id:azc1zqfb1tq8
server:Google Frontend
status:200
vary:Accept-Encoding
x-cloud-trace-context:70e08d634a9644c32530326de0471a64;o=1
x-cloud-trace-context:70e08d634a9644c32530326de0471a64
x-powered-by:Express

Hätte ich erwartet, um zu sehen, die Access-Control-Allow-Origin-header in der Response-Header, um anzugeben, dass es erlaubt * aber ich bin definitiv nicht sehen.

Das verrückte an der Sache ist aber, dass wenn ich einen Blick in das Netzwerk-Element und klicken Sie auf Antwort erhalte ich:

Testing

Was darauf hindeutet, dass alle Dinge gleich sind, ist es TATSÄCHLICH lief!

Ich entschuldige mich, wenn dies wurde beantwortet vor, aber ich habe gesucht wie viele verschiedene keywords und nichts scheint mein problem gelöst. Ich dachte ein frisches paar Augen auf das Problem (und einige anständige know-how) würde helfen.

Vielen Dank im Voraus!

Ist der richtige Befehl gsutil gsutil cors set cors.json gs://bustling-opus-830 oder Sie bereits sicher, dass gsutil cors set cors.json gs://bustling-opus-830.appspot.com/ erreichen muss, um die gleiche Sache? Ich Frage, weil die docs in cloud.google.com/storage/docs/... benutzen Sie einfach die unqualifizierte form gsutil cors set cors-json-file.json gs://example
Ich glaube, die beiden Befehle sind syntaktisch gleich. Der einzige Unterschied, den ich sehe, ist, den Namen der JSON-Datei. Ich verwendet cors.json-wo, wie das Beispiel von cors-json-Datei.json. Ist es das, was du meinst?
Nein, ich meinte nur gs://bustling-opus-830.appspot.com/ vs gs://bustling-opus-830
Ahh bekam Sie. Ich habe gerade versucht, ohne .appspot.com und ein "NotFoundException: 404" - Meldung. Ich habe dann versucht gsutil cors get-gs://belebten-opus-830 und erhalten "BucketNotFoundException: 404 gs://belebten-opus-830 Eimer existiert nicht." also ich ' m vorausgesetzt, was Google docs haben, ist nur ein Verweis auf den Eimer anstatt den absoluten Pfad. Vielen Dank für Ihre Hilfe so weit. Alle anderen Gedanken? Haben Sie sich erfolgreich bei der post per AJAX an eine GCF?

InformationsquelleAutor Encoder | 2017-02-09

22

Vordergrundfarbe (HTTP) Google-Cloud-Funktion, um die passenden CORS Header in den Antworten auf die AJAX client-Anfragen. Die Anfrage-und antwortparameter zu HTTP-Funktionen haben gleichwertige Eigenschaften der entsprechenden ExpressJS Objekte, die können verwendet werden, um die CORS-Header und reagieren preflight requests benötigt.

Beispiel:
```
exports.Authenticate = function Authenticate (req, res) {
    //set JSON content type and CORS headers for the response
    res.header('Content-Type','application/json');
    res.header('Access-Control-Allow-Origin', '*');
    res.header('Access-Control-Allow-Headers', 'Content-Type');

    //respond to CORS preflight requests
    if (req.method == 'OPTIONS') {
        res.status(204).send('');
    }

    //continue function ...

};
```
Den Kopf-und Logik oben geändert werden sollte, um widerzuspiegeln, die die besonderen Bedürfnisse von Ihrem service, aber sollte hoffentlich helfen Ihnen den Einstieg.
- Ryan Sie tot-set-Legende! Ich kann nicht glauben, dass dies ist, wie DUMM einfach es war. Ich habe den Header und drücken Sie aktualisieren, und es sofort ausgeführt, als erwartet. Vielen, vielen DANK!
- Sie sind mein Retter. Ich verbrachte den ganzen Tag damit, dies herauszufinden, und dies war die einzige Sache, die es behoben.
InformationsquelleAutor ryanmac
2

Wenn Sie immer noch interessiert an einer Antwort, die ich schrieb sogar einen blog-post auf, wie zu behandeln, die mit Express-middleware: https://mhaligowski.github.io/blog/2017/03/10/cors-in-cloud-functions.html.

InformationsquelleAutor mhaligowski
2

Können Sie auch die cors - Paket, um dieses Problem zu lösen, wie von Google empfohlen. In der Tat, werden Sie dieses auch verwenden, in Ihrem eigenen Beispiel-codes. Überprüfen Sie diese Beispiel.
Dies ist der code -
```
const cors = require('cors')({
    origin: true,
});

//Your code here

//Use the following function instead of just res.send. return keyword is not compulsory here
return cors(req, res, () => {
    res.send();
});
```
InformationsquelleAutor noob

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.