AngularJS $ressource rend HTTP OPTIONS de demande au lieu de HTTP POST pour $méthode save
Je suis dans le processus de l'écriture d'une simple application de la bibliothèque pour être prêt pour un grand projet avec AngularJS. Après la lecture de beaucoup en ligne sur l'utilisation de $resource
d'interagir avec une API RESTful, j'ai décidé qu'il serait probablement vous proposons permet d'économiser du temps et de l'échelle des avantages à mettre en œuvre au lieu de l'utilisation $http
pour chaque demande. Le problème est que pour une raison (je ne suis pas spécialiste de la SCRO et que la demande est envoyée cross-domain) lors de l'utilisation de la $save
ma méthode Node.js la console affiche:
OPTIONS /books 200 1ms - 161b
À l'aide de la query()
méthode fonctionne très bien - le Nœud de la console affiche:
GET /books 200 1ms - 228b
J'ai été bloqué pendant plusieurs heures à ce point, en essayant de variations sur le dessous, mais il finit toujours par être une des OPTIONS de demande à la place de la POSTE (qui est ce qu'elle devrait être selon l'angle de la documentation) pour l' $save
méthode.
AngularJS Web App
app.js
var libraryApp = angular.module('libraryApp', ['ngResource', 'ngRoute', 'libraryControllers']);
libraryApp.factory('$book', ['$resource', function ($resource) {
return $resource('http://mywebserver\\:1337/books/:bookId', { bookId: '@bookId' });
}]);
controllers.js
var libraryControllers = angular.module('libraryControllers', []);
libraryControllers.controller('BookCtrl', ['$scope', '$book', function($scope, $book) {
...
$scope.addBook = function () {
var b = new $book;
b.isbn = "TEST";
b.description = "TEST";
b.price = 9.99;
b.$save();
};
}]);
Node.js avec Express API REST
app.js
var express = require('express'),
books = require('./routes/books'),
http = require('http'),
path = require('path');
var app = express();
...
//enable cross-domain scripting
app.all('*', function(req, res, next) {
res.header("Access-Control-Allow-Origin", req.headers.origin);
res.header("Access-Control-Allow-Headers", "X-Requested-With");
next();
});
//routing
app.get('/books', books.getAll);
app.get('/books/:isbn', books.get);
//This is what I want to fire with the $save method
app.post('/books', books.add);
http.createServer(app).listen(app.get('port'), function(){
console.log('Express server listening on port ' + app.get('port'));
});
./routes/books.js
...
exports.add = function(req, res) {
console.log("POST request received...");
console.log(req.body.isbn);
};
Essayé de mettre cette ligne dans ma config fonction delete $httpProvider.defaults.headers.common["X-Requested-With"];
mais pas de changement.
Je ne suis pas Angulaire/Node pro mais pour l'instant je pense que c'est quelque chose à voir avec la croix de domaine et, comme je l'ai dit, je ne suis pas spécialiste de la SCRO.
Merci d'avance.
- Vérifier ce post
Vous devez vous connecter pour publier un commentaire.
Je sais que cela peut être de mauvais goût de répondre à ma propre question, mais j'ai compris le problème quelques jours après cette annonce.
Tout se résume à la façon dont les navigateurs gérer la SCRO. Lors d'une demande de domaines en JavaScript qui n'est pas "simple" (c'est à dire une requête GET - ce qui explique pourquoi la
query()
fonction travaillé), le navigateur va automatiquement faire une HTTP OPTIONS de requête à l'URL/URI, appelé "pré-vol" demande ou de la "promesse". Aussi longtemps que la distance de la source de renvoie un code d'état HTTP 200, et les détails pertinents au sujet de ce qu'il va accepter dans les en-têtes de réponse, alors le navigateur ira de l'avant avec l'original de l'appel JavaScript.Voici un bref jQuery exemple:
Tout ce que j'avais à faire était d'ajouter les détails de ce que le serveur accepte les en-têtes de réponse:
Et ensuite insérer ces quelques lignes avant la ligne Express de routage pour simplement retourner un code d'état HTTP 200 pour chaque demande OPTIONS:
J'espère que cela va aider quelqu'un qui trébuche sur cette page qui souffrent du même problème.
Je n'ai pas vraiment l'essayer, mais wouldnt être assez pour dire la Ressource comment gérer l' $enregistrer la demande?