hapi.js Cors Pre-flight-nicht Rückkehr-Access-Control-Allow-Origin-header

Habe ich ein ajax Datei-upload mit (Dropzone js). sendet eine Datei an meinen server hapi. Ich merkte, sendet der browser eine PREFLIGHT-OPTIONEN-METHODE. aber mein hapi-server scheint nicht zu senden Sie die richtige Antwort-Headern, so bin ich immer Fehler in chrome.
hier ist der Fehler, bekomme ich auf chrome

XMLHttpRequest cannot load http://localhost:3000/uploadbookimg. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:4200' is therefore not allowed access.

dies ist die hapi js route-handler

server.route({
        path: '/uploadbookimg',
        method: 'POST',
        config: {
            cors : true,
            payload: {
                output: 'stream',
                parse: true,
                allow: 'multipart/form-data'
            },
        handler: require('./books/webbookimgupload'),
        }
    });

In meinem Verständnis hapi js sollte senden alle cors-Header aus der Pre-Kampf (OPTIONEN) verlangen.
Cant verstehen, warum Ihr nicht

Netzwerk-Anfrage - /Antwort-aus Chrom -

**General**
Request Method:OPTIONS
Status Code:200 OK
Remote Address:127.0.0.1:3000

**Response Headers**
view parsed
HTTP/1.1 200 OK
content-type: application/json; charset=utf-8
cache-control: no-cache
vary: accept-encoding
Date: Wed, 27 Apr 2016 07:25:33 GMT
Connection: keep-alive
Transfer-Encoding: chunked

**Request Headers**
view parsed
OPTIONS /uploadbookimg HTTP/1.1
Host: localhost:3000
Connection: keep-alive
Pragma: no-cache
Cache-Control: no-cache
Access-Control-Request-Method: POST
Origin: http://localhost:4200
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/50.0.2661.87 Safari/537.36
Access-Control-Request-Headers: accept, cache-control, content-type
Accept: */*
Referer: http://localhost:4200/books/upload
Accept-Encoding: gzip, deflate, sdch
Accept-Language: en-US,en;q=0.8

Vielen Dank im Voraus

InformationsquelleAutor kweku360 | 2016-04-27
  1. 15

    Des hapi cors: true ist eine wildcard-Regel, die CORS-Anfragen von allen domains, mit Ausnahme von ein paar Fällen auch bei zusätzlichen request-Header außerhalb des hapi ' s default-whitelist:

    ["accept", "authorization", "content-type", "if-none-match", "origin"]

    Finden Sie die cors - option Abschnitt in den API-docs unter Routenoptionen:

    headers - ein Zeichenfolgen-array mit den erlaubten Header ('Access-Control-Allow-Headers'). Standardmäßig ['Accept', 'Authorization', 'Content-Type', 'If-None-Match'].

    additionalHeaders - ein Zeichenfolgen-array der zusätzliche Header in den Header. Verwenden Sie dies, um die Standard-Header vorhanden.

    Dein problem ist, dass Dropzone sendet ein paar Header zusammen mit dem Datei-upload, die nicht in dieser Liste:

    • x-requested-with (nicht in dem Header oben, aber gesendet wurde für mich)
    • cache-control

    Haben Sie zwei Möglichkeiten, um die Dinge zu arbeiten, müssen Sie etwas ändern, entweder auf dem server oder dem client:

    Option 1 - Whitelist das zusätzliche Header:

    server.route({
    config: {
        cors: {
            origin: ['*'],
            additionalHeaders: ['cache-control', 'x-requested-with']
        }
    },
    method: 'POST',
    path: '/upload',
    handler: function (request, reply) {

        ...
    }
});

    Option 2 - Sagen, dropzone, dass nicht senden Sie diese zusätzlichen Header

    Nicht möglich, doch durch Ihre config, aber es gibt eine ausstehende PR um es zu ermöglichen: https://github.com/enyo/dropzone/pull/685

    • ok..das perfekt funktioniert, eine andere Lösung fand ich aus war, war der Einsatz des hapi-cors-header-plugin npmjs.com/package/hapi-cors-headers
    • Ja, das würde funktionieren. Würde nicht empfehlen es aber. Die strikte whitelist gibt es für einen Grund (Sicherheit).
    • Gibt es eine Methode der Einstellung der CORS Herkunft für alle Routen, anstatt auf einem Weg-von-route basis?
    InformationsquelleAutor Matt Harrison
  2. 0

    Möchte ich hinzufügen, meine 2 cents auf diesen einen, wie die obige nicht vollständig zu beheben das Problem in meinem Fall.

    Begann ich meine Hapi-Server an localhost:3300. Dann machte ich eine Anfrage von localhost:80 zu http://localhost:3300/ zu testen CORS. Diese führen zu chrome immer noch die Blockierung der ressource, da hieß es, dass

    Kein 'Access-Control-Allow-Origin' - header vorhanden ist, auf die angeforderte
    Ressource

    (das war überhaupt nicht wahr).
    Dann ich änderte den XHR-Request zum abrufen der url für die ich eigentlich erstellt eine route innerhalb HapiJS, die - in meinem Fall - war http://localhost:3300/api/test. Dies funktionierte.

    Zu overgo diesem Thema erstellte ich eine "catch-all" - route in HapiJS (zu overgo die eingebaute 404 fangen).

    const Boom = require('Boom'); //You can require Boom when you have hapi

Route({
  method: '*',
  path: '/{any*}',
  handler: function(request, reply) {
    reply(Boom.notFound());
  }
})
    InformationsquelleAutor androidavid
Schreibe einen Kommentar