Access Control Request Headers, wird mit jQuery zu den Headern in AJAX-Anfragen hinzugefügt

Question

Ich möchte eine benutzerdefinierte Kopfzeile zu einer AJAX POST-Anfrage von jQuery hinzufügen.

Das habe ich versucht:

$.ajax({
    type: 'POST',
    url: url,
    headers: {
        "My-First-Header":"first value",
        "My-Second-Header":"second value"
    }
    //OR
    //beforeSend: function(xhr) { 
    //  xhr.setRequestHeader("My-First-Header", "first value"); 
    //  xhr.setRequestHeader("My-Second-Header", "second value"); 
    //}
}).done(function(data) { 
    alert(data);
});

Wenn ich diese Anfrage sende und mit FireBug beobachte, sehe ich diesen Header:

OPTIONEN xxxx/yyyy HTTP/1.1
Rechner: 127.0.0.1:6666
Benutzer-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64; rv:11.0) Gecko/20100101 Firefox/11.0
Akzeptieren: text/html,application/xhtml+xml,application/xml;q=0.9, / ;q=0.8
Accept-Language: fr,fr-fr;q=0.8,en-us;q=0.5,en;q=0.3
Accept-Encoding: gzip, deflate
Verbindung: keep-alive
Herkunft: null
Zugriffskontroll-Request-Methode: POST
Zugriffskontroll-Request-Kopfzeilen: meine-erste-Kopfzeile,meine-zweite-Kopfzeile
Pragma: no-cache
Cache-Kontrolle: no-cache

Warum gehen meine benutzerdefinierten Kopfzeilen zu Access-Control-Request-Headers :

Zugriffskontroll-Request-Kopfzeilen: meine-erste-Kopfzeile,meine-zweite-Kopfzeile

Ich hatte eine Kopfzeile wie diese erwartet:

Meine-Erste-Kopfzeile: erster Wert
My-Second-Header: zweiter Wert

Ist das möglich?

Answer 1

Auf der Client-Seite kann ich dieses Problem nicht lösen.

Von der Node.js y Express.js Seite, können Sie die Korsett Modul, um damit umzugehen.

var express    = require('express');
var app        = express();
var bodyParser = require('body-parser');
var cors       = require('cors');

var port = 3000;
var ip = '127.0.0.1';

app.use('*/myapi',
        cors(), // With this row OPTIONS has handled
        bodyParser.text({type: 'text/*'}),
        function(req, res, next) {
            console.log('\n.----------------' + req.method + '------------------------');
            console.log('| prot:' + req.protocol);
            console.log('| host:' + req.get('host'));
            console.log('| URL:' + req.originalUrl);
            console.log('| body:', req.body);
            //console.log('| req:', req);
            console.log('.----------------' + req.method + '------------------------');
            next();
        });

app.listen(port, ip, function() {
    console.log('Listening to port:  ' + port);
});

console.log(('dir:' + __dirname));
console.log('The server is up and running at http://' + ip + ':' + port + '/');

Ohne cors() müssen diese OPTIONEN vor POST erscheinen.

.----------------OPTIONS------------------------
| prot:http
| host:localhost:3000
| url:/myapi
| body: {}
.----------------OPTIONS------------------------

.----------------POST------------------------
| prot:http
| host:localhost:3000
| url:/myapi
| body: <SOAP-ENV:Envelope .. P-ENV:Envelope>
.----------------POST------------------------

Der Ajax-Anruf:

$.ajax({
    type: 'POST',
    contentType: "text/xml; charset=utf-8",

    //These does not work
    //beforeSend: function(request) {
    //  request.setRequestHeader('Content-Type', 'text/xml; charset=utf-8');
    //  request.setRequestHeader('Accept', 'application/vnd.realtime247.sct-giro-v1+cms');
    //  request.setRequestHeader('Access-Control-Allow-Origin', '*');
    //  request.setRequestHeader('Access-Control-Allow-Methods', 'POST, GET');
    //  request.setRequestHeader('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type');
    //},
    //headers: {
    //  'Content-Type': 'text/xml; charset=utf-8',
    //  'Accept': 'application/vnd.realtime247.sct-giro-v1+cms',
    //  'Access-Control-Allow-Origin': '*',
    //  'Access-Control-Allow-Methods': 'POST, GET',
    //  'Access-Control-Allow-Headers': 'Origin, X-Requested-With, Content-Type'
    //},
    url: 'http://localhost:3000/myapi',
    data: '<SOAP-ENV:Envelope .. P-ENV:Envelope>',
    success: function(data) {
      console.log(data.documentElement.innerHTML);
    },
    error: function(jqXHR, textStatus, err) {
      console.log(jqXHR, '\n', textStatus, '\n', err)
    }
  });

Answer 2

Versuchen Sie hinzuzufügen 'Content-Type':'application/json' :

 $.ajax({
        type: 'POST',
        url: url,
        headers: {
            'Content-Type':'application/json'
        }
        //OR
        //beforeSend: function(xhr) {
        //  xhr.setRequestHeader("My-First-Header", "first value");
        //  xhr.setRequestHeader("My-Second-Header", "second value");
        //}
    }).done(function(data) {
        alert(data);
    });

Answer 3

Versuchen Sie, die rack-cors gem. Und fügen Sie das Header-Feld in Ihrem Ajax-Aufruf hinzu.