AngularJs $ http.post () n'envoie pas de données
Quelqu'un pourrait-il me dire pourquoi la déclaration suivante n'envoie pas les données de publication à l'URL désignée? L'URL est appelé mais sur le serveur lorsque j'imprime $ _POST - Je reçois un tableau vide. Si j'imprime un message dans la console avant de l'ajouter aux données, le contenu correct s'affiche.
$http.post('request-url', { 'message' : message });
J'ai aussi essayé avec les données sous forme de chaîne (avec le même résultat):
$http.post('request-url', "message=" + message);
Il semble fonctionner lorsque je l’utilise dans le format suivant:
$http({
method: 'POST',
url: 'request-url',
data: "message=" + message,
headers: {'Content-Type': 'application/x-www-form-urlencoded'}
});
mais y a-t-il moyen de le faire avec $ http.post () - et dois-je toujours inclure l'en-tête pour que cela fonctionne? Je crois que le type de contenu ci-dessus spécifie le format des données envoyées, mais puis-je l'envoyer en tant qu'objet javascript?
J'ai eu le même problème en utilisant asp.net MVC et trouvé la solution ici
Il y a beaucoup de confusion parmi les nouveaux arrivants à AngularJS sur la raison pour laquelle le
$httpfonctions abrégées du service ($http.post(), etc.) don ' t semble être permutable avec les équivalents jQuery (jQuery.post(), etc.)La différence réside dans la manière dont jQuery et AngularJS sérialisent et transmettent les données. Le problème réside essentiellement dans le fait que la langue de votre choix de serveur est incapable de comprendre la transmission d’AngularJS en mode natif ... Par défaut, jQuery transmet les données en utilisant
Content-Type: x-www-form-urlencodedet le familier
foo=bar&baz=moesérialisation.AngularJS , cependant, transmet les données en utilisant
Content-Type: application/jsonet
{ "foo": "bar", "baz": "moe" }La sérialisation JSON, dont malheureusement certaines langues de serveur Web - , notamment PHP - ne se désérialisent pas nativement.
Fonctionne comme un charme.
CODE
// Your app's root module...
angular.module('MyModule', [], function($httpProvider) {
// Use x-www-form-urlencoded Content-Type
$httpProvider.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=utf-8';
/**
* The workhorse; converts an object to x-www-form-urlencoded serialization.
* @param {Object} obj
* @return {String}
*/
var param = function(obj) {
var query = '', name, value, fullSubName, subName, subValue, innerObj, i;
for(name in obj) {
value = obj[name];
if(value instanceof Array) {
for(i=0; i<value.length; ++i) {
subValue = value[i];
fullSubName = name + '[' + i + ']';
innerObj = {};
innerObj[fullSubName] = subValue;
query += param(innerObj) + '&';
}
}
else if(value instanceof Object) {
for(subName in value) {
subValue = value[subName];
fullSubName = name + '[' + subName + ']';
innerObj = {};
innerObj[fullSubName] = subValue;
query += param(innerObj) + '&';
}
}
else if(value !== undefined && value !== null)
query += encodeURIComponent(name) + '=' + encodeURIComponent(value) + '&';
}
return query.length ? query.substr(0, query.length - 1) : query;
};
// Override $http service's default transformRequest
$httpProvider.defaults.transformRequest = [function(data) {
return angular.isObject(data) && String(data) !== '[object File]' ? param(data) : data;
}];
});
Ce n'est pas très clair ci-dessus, mais si vous recevez la demande dans PHP, vous pouvez utiliser:
$params = json_decode(file_get_contents('php://input'),true);
Pour accéder à un tableau dans PHP à partir d'un POST AngularJS.
Vous pouvez définir le type de contenu par défaut comme ceci:
$http.defaults.headers.post["Content-Type"] = "application/x-www-form-urlencoded";
À propos du format data:
Les méthodes $ http.post et $ http.put acceptent tout objet JavaScript (ou une chaîne) comme paramètre de données. Si data est un objet JavaScript, il sera converti par défaut en chaîne JSON.
Essayez d'utiliser cette variante
function sendData($scope) {
$http({
url: 'request-url',
method: "POST",
data: { 'message' : message }
})
.then(function(response) {
// success
},
function(response) { // optional
// failed
});
}
J'ai eu un problème similaire, et je me demande si cela peut aussi être utile: https://stackoverflow.com/a/11443066
var xsrf = $.param({fkey: "key"});
$http({
method: 'POST',
url: url,
data: xsrf,
headers: {'Content-Type': 'application/x-www-form-urlencoded'}
})
Cordialement,
J'aime utiliser une fonction pour convertir des objets pour poster des paramètres.
myobject = {'one':'1','two':'2','three':'3'}
Object.toparams = function ObjecttoParams(obj) {
var p = [];
for (var key in obj) {
p.Push(key + '=' + encodeURIComponent(obj[key]));
}
return p.join('&');
};
$http({
method: 'POST',
url: url,
data: Object.toparams(myobject),
headers: {'Content-Type': 'application/x-www-form-urlencoded'}
})
Ceci a finalement été traité dans angular 1.4 en utilisant $ httpParamSerializerJQLike
Voir https://github.com/angular/angular.js/issues/6039
.controller('myCtrl', function($http, $httpParamSerializerJQLike) {
$http({
method: 'POST',
url: baseUrl,
data: $httpParamSerializerJQLike({
"user":{
"email":"[email protected]",
"password":"123456"
}
}),
headers:
'Content-Type': 'application/x-www-form-urlencoded'
})})
J'utilise jQuery param avec message AngularJS requrest. Voici un exemple ... Créez le module d'application AngularJS, où myapp est défini avec ng-app dans votre code HTML.
var app = angular.module('myapp', []);
Créons maintenant un contrôleur de connexion et un POST email et un mot de passe.
app.controller('LoginController', ['$scope', '$http', function ($scope, $http) {
// default post header
$http.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=utf-8';
// send login data
$http({
method: 'POST',
url: 'https://example.com/user/login',
data: $.param({
email: $scope.email,
password: $scope.password
}),
headers: {'Content-Type': 'application/x-www-form-urlencoded'}
}).success(function (data, status, headers, config) {
// handle success things
}).error(function (data, status, headers, config) {
// handle error things
});
}]);
Je n'aime pas analyser le code, il est assez simple à comprendre :) Notez que param est issu de jQuery. Vous devez donc installer jQuery et AngularJS pour que cela fonctionne. Voici une capture d'écran.
J'espère que c'est utile. Merci!
J'ai eu le même problème avec AngularJS et Node.js + Express 4 + Router
Le routeur attend les données de la requête de la poste dans le corps. Ce corps était toujours vide si je suivais l'exemple de Angular Docs
Notation 1
$http.post('/someUrl', {msg:'hello Word!'})
Mais si je l'utilisais dans les données
Notation 2
$http({
withCredentials: false,
method: 'post',
url: yourUrl,
headers: {'Content-Type': 'application/x-www-form-urlencoded'},
data: postData
});
Modifier 1:
Sinon, le routeur node.js attendra les données dans req.body si la notation 1 est utilisée:
req.body.msg
Qui envoie également les informations sous forme de données utiles JSON. C'est mieux dans certains cas où vous avez des tableaux dans votre json et x-www-form-urlencoded donnera quelques problèmes.
ça a marché. J'espère que ça aide.
Contrairement à JQuery et pour le pédantisme, Angular utilise le format JSON pour le POST transfert de données à partir d'un client. sur le serveur (JQuery applique probablement x-www-form-urlencoded, bien que JQuery et Angular utilisent JSON pour l’imputation des données). Par conséquent, il y a deux parties du problème: dans la partie client js et dans la partie serveur. Donc vous avez besoin de:
mettez js Angular une partie client comme ceci:
$http({ method: 'POST', url: 'request-url', data: {'message': 'Hello world'} });
ET
écrivez dans votre partie serveur pour recevoir les données d'un client (si c'est php).
$data = file_get_contents("php://input"); $dataJsonDecode = json_decode($data); $message = $dataJsonDecode->message; echo $message; //'Hello world'
Note: $ _POST ne fonctionnera pas!
La solution fonctionne bien pour moi, espérons-le, et pour vous.
Pour envoyer des données via la méthode Post avec $http d'angularjs, vous devez changer
data: "message=" + message, avec data: $.param({message:message})
Pour poursuivre sur la réponse de @ felipe-miosso:
- Téléchargez-le en tant que module AngularJS à partir de here ,
- Installez-le
Ajoutez-le à votre application:
var app = angular.module('my_app', [ ... , 'httpPostFix']);
Je n'ai pas la réputation de commenter, mais en réponse à la réponse de Don F:
$params = json_decode(file_get_contents('php://input'));
Un second paramètre de true doit être ajouté à la fonction json_decode afin de renvoyer correctement un tableau associatif:
$params = json_decode(file_get_contents('php://input'), true);
Angular
var payload = $.param({ jobId: 2 });
this.$http({
method: 'POST',
url: 'web/api/ResourceAction/processfile',
data: payload,
headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
});
WebAPI 2
public class AcceptJobParams
{
public int jobId { get; set; }
}
public IHttpActionResult ProcessFile([FromBody]AcceptJobParams thing)
{
// do something with fileName parameter
return Ok();
}
Ce code a résolu le problème pour moi. C'est une solution au niveau de l'application:
moduleName.config(['$httpProvider',
function($httpProvider) {
$httpProvider.defaults.transformRequest.Push(function(data) {
var requestStr;
if (data) {
data = JSON.parse(data);
for (var key in data) {
if (requestStr) {
requestStr += "&" + key + "=" + data[key];
} else {
requestStr = key + "=" + data[key];
}
}
}
return requestStr;
});
$httpProvider.defaults.headers.post["Content-Type"] = "application/x-www-form-urlencoded";
}
]);
Ajoutez ceci dans votre fichier js:
$http.defaults.headers.post["Content-Type"] = "application/x-www-form-urlencoded";
et ajoutez ceci à votre fichier serveur:
$params = json_decode(file_get_contents('php://input'), true);
Cela devrait fonctionner.
c'est probablement une réponse tardive, mais je pense que le moyen le plus approprié est d'utiliser le même fragment de code angular à utiliser lors d'une requête "get" utilisant votre compte $httpParamSerializer devra l'injecter dans votre contrôleur afin que vous puissiez simplement faire ce qui suit sans avoir à utiliser Jquery du tout, $http.post(url,$httpParamSerializer({param:val}))
app.controller('ctrl',function($scope,$http,$httpParamSerializer){
$http.post(url,$httpParamSerializer({param:val,secondParam:secondVal}));
}
Dans mon cas, je résous le problème comme ceci:
var deferred = $q.defer();
$http({
method: 'POST',
url: 'myUri',
data: $.param({ param1: 'blablabla', param2: JSON.stringify(objJSON) }),
headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
}).then(
function(res) {
console.log('succes !', res.data);
deferred.resolve(res.data);
},
function(err) {
console.log('error...', err);
deferred.resolve(err);
}
);
return deferred.promise;
Vous devez utiliser JSON.stringify pour chaque paramètre contenant un objet JSON, puis construire votre objet de données avec "$ .param" :-)
NB: Mon "objJSON" est un objet JSON contenant un contenu tableau, entier, chaîne et html. Sa taille totale est supérieure à 3500 caractères.
J'ai également fait face à un problème similaire et je faisais quelque chose comme ça et cela n'a pas fonctionné. Mon contrôleur Spring n'a pas pu lire le paramètre de données.
var paramsVal={data:'"id":"1"'};
$http.post("Request URL", {params: paramsVal});
Mais en lisant ce forum et API Doc, j’ai essayé de suivre et cela a fonctionné pour moi. Si quelqu'un a également un problème similaire, vous pouvez également essayer ci-dessous.
$http({
method: 'POST',
url: "Request URL",
params: paramsVal,
headers: {'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8'}
});
S'il vous plaît vérifier https://docs.angularjs.org/api/ng/service/ $ http # post pour ce que param config fait. {data: '"id": "1"'} - Carte des chaînes ou des objets qui seront transformés en URL? data = "id: 1"
Je sais a accepté réponse. Cependant, suivre pourrait aider les futurs lecteurs si la réponse ne leur convient pas pour quelque raison que ce soit.
Angular ne fait pas ajax comme jQuery. Pendant que j'essayais de suivre le guide pour modifier angular $httpprovider, j'ai rencontré d'autres problèmes. Par exemple. J'utilise codeigniter dans lequel la fonction $this->input->is_ajax_request() échouait toujours (ce qui a été écrit par un autre programmeur et utilisé globalement, donc impossible de changer) en disant que ce n'était pas une demande ajax réelle.
Pour le résoudre, j'ai pris l'aide de promesse reportée . Je l'ai testé dans Firefox, et ie9 et cela a fonctionné.
J'ai la fonction suivante définie en dehors de l'un quelconque du code angular. Cette fonction effectue un appel ajax jquery régulier et retourne un objet différé/promis (j'apprends toujours).
function getjQueryAjax(url, obj){
return $.ajax({
type: 'post',
url: url,
cache: true,
data: obj
});
}
Ensuite, je l’appelle angular code en utilisant le code suivant. Veuillez noter que nous devons mettre à jour le $scope manuellement à l'aide de $scope.$apply().
var data = {
media: "video",
scope: "movies"
};
var rPromise = getjQueryAjax("myController/getMeTypes" , data);
rPromise.success(function(response){
console.log(response);
$scope.$apply(function(){
$scope.testData = JSON.parse(response);
console.log($scope.testData);
});
}).error(function(){
console.log("AJAX failed!");
});
Ce n'est peut-être pas la réponse parfaite, mais cela m'a permis d'utiliser des appels jquery ajax avec angular et de mettre à jour le $scope.
Si vous utilisez Angular> = 1.4 , voici la solution la plus propre utilisant le sérialiseur fourni par Angular :
angular.module('yourModule')
.config(function ($httpProvider, $httpParamSerializerJQLikeProvider){
$httpProvider.defaults.transformRequest.unshift($httpParamSerializerJQLikeProvider.$get());
$httpProvider.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded; charset=utf-8';
});
Et vous pouvez simplement le faire n'importe où dans votre application:
$http({
method: 'POST',
url: '/requesturl',
data: {
param1: 'value1',
param2: 'value2'
}
});
Et il va sérialiser correctement les données en tant que param1=value1¶m2=value2 et les envoyer à /requesturl avec l'en-tête application/x-www-form-urlencoded; charset=utf-8 Content-Type comme il est normalement prévu avec les demandes POST sur les systèmes d'extrémité.
TL; DR
Au cours de mes recherches, j'ai constaté que la réponse à ce problème se présentait sous différentes formes. certains sont très compliqués et dépendent de fonctions personnalisées, certains dépendent de jQuery et d'autres sont incomplets en suggérant que vous devez uniquement définir l'en-tête.
Si vous ne définissez que l'en-tête Content-Type, le point de fin verra les données POST, mais ce ne sera pas au format standard, à moins que vous ne fournissiez une chaîne comme data , ou sérialisez manuellement votre objet de données, tout sera sérialisé en tant que JSON par défaut et peut être interprété de manière incorrecte sur le noeud final.
par exemple. si le sérialiseur correct n'était pas défini dans l'exemple ci-dessus, il serait vu dans le noeud final comme suit:
{"param1":"value1","param2":"value2"}
Et cela peut conduire à une analyse inattendue, par exemple ASP.NET le traite comme un nom de paramètre null, avec {"param1":"value1","param2":"value2"} comme valeur; ou Fiddler l'interprète dans l'autre sens, avec {"param1":"value1","param2":"value2"} comme nom de paramètre et null comme valeur.
Si vous utilisez PHP, c’est un moyen simple d’accéder à un tableau dans PHP à partir d’un POST AngularJS.
$params = json_decode(file_get_contents('php://input'),true);
J'utilise les services Web WCF asp.net avec angular js et le code ci-dessous fonctionnent:
$http({
contentType: "application/json; charset=utf-8",//required
method: "POST",
url: '../../operation/Service.svc/user_forget',
dataType: "json",//optional
data:{ "uid_or_phone": $scope.forgettel, "user_email": $scope.forgetemail },
async: "isAsync"//optional
}).success( function (response) {
$scope.userforgeterror = response.d;
})
J'espère que ça aide.
Nous n'avons pas trouvé d'extrait de code complet expliquant comment utiliser la méthode $ http.post pour envoyer des données au serveur et pourquoi cela ne fonctionnait pas dans ce cas.
Explications de l'extrait de code ci-dessous ...
- J'utilise la fonction jQuery $ .param pour sérialiser les données JSON sur www post data
Définir le type de contenu dans la variable config qui sera transmise avec la requête de angularJS $ http.post qui indique au serveur que nous envoyons des données au format www post.
Remarquez la méthode $ htttp.post, où j’envoie le premier paramètre sous forme d’url, le deuxième paramètre sous forme de données (sérialisé) et le troisième paramètre sous forme de config.
Le code restant est auto-compris.
$scope.SendData = function () {
// use $.param jQuery function to serialize data from JSON
var data = $.param({
fName: $scope.firstName,
lName: $scope.lastName
});
var config = {
headers : {
'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8;'
}
}
$http.post('/ServerRequest/PostDataResponse', data, config)
.success(function (data, status, headers, config) {
$scope.PostDataResponse = data;
})
.error(function (data, status, header, config) {
$scope.ResponseDetails = "Data: " + data +
"<hr />status: " + status +
"<hr />headers: " + header +
"<hr />config: " + config;
});
};
Regardez l'exemple de code de méthode $ http.post ici .
Semblable au format de travail suggéré par le PO et à la réponse de Denison, sauf que vous utilisez $http.post au lieu de simplement $http et que vous restez dépendant de jQuery.
La bonne chose à propos de l'utilisation de jQuery ici est que les objets complexes sont correctement transmis; convertir manuellement en paramètres d’URL pouvant altérer les données.
$http.post( 'request-url', jQuery.param( { 'message': message } ), {
headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
});
J'ai eu le même problème dans express .. pour résoudre vous devez utiliser Bodyparser pour analyser les objets JSON avant d'envoyer des requêtes http ..
app.use(bodyParser.json());
Récemment mis à jour de angular 1.2 à 1.3, nous avons trouvé un problème dans le code. Transformer une ressource mènera à une boucle sans fin parce que (je pense) de la promesse $ tenant à nouveau le même objet. Peut-être que ça va aider quelqu'un ...
Je pourrais résoudre ce problème en:
[...]
/**
* The workhorse; converts an object to x-www-form-urlencoded serialization.
* @param {Object} obj
* @return {String}
*/
var param = function (obj) {
var query = '', name, value, fullSubName, subName, subValue, innerObj, i;
angular.forEach(obj, function(value, name) {
+ if(name.indexOf("$promise") != -1) {
+ return;
+ }
value = obj[name];
if (value instanceof Array) {
for (i = 0; i < value.length; ++i) {
[...]
J'utilise le code de réponse accepté (le code de Felipe) depuis un moment et il fonctionne très bien (merci, Felipe!).
Cependant, j'ai récemment découvert qu'il y avait des problèmes avec les objets vides ou les tableaux. Par exemple, lors de la soumission de cet objet:
{
A: 1,
B: {
a: [ ],
},
C: [ ],
D: "2"
}
PHP ne semble pas voir B et C du tout. Il obtient ceci:
[
"A" => "1",
"B" => "2"
]
Un regard sur la demande réelle dans Chrome montre ceci:
A: 1
:
D: 2
J'ai écrit un extrait de code alternatif. Cela semble bien fonctionner avec mes cas d'utilisation mais je ne l'ai pas testé de manière approfondie, utilisez-le avec prudence.
J'ai utilisé TypeScript parce que j'aime bien le typage fort, mais il serait facile de convertir en JS pur:
angular.module("MyModule").config([ "$httpProvider", function($httpProvider: ng.IHttpProvider) {
// Use x-www-form-urlencoded Content-Type
$httpProvider.defaults.headers.post["Content-Type"] = "application/x-www-form-urlencoded;charset=utf-8";
function phpize(obj: Object | any[], depth: number = 1): string[] {
var arr: string[] = [ ];
angular.forEach(obj, (value: any, key: string) => {
if (angular.isObject(value) || angular.isArray(value)) {
var arrInner: string[] = phpize(value, depth + 1);
var tmpKey: string;
var encodedKey = encodeURIComponent(key);
if (depth == 1) tmpKey = encodedKey;
else tmpKey = `[${encodedKey}]`;
if (arrInner.length == 0) {
arr.Push(`${tmpKey}=`);
}
else {
arr = arr.concat(arrInner.map(inner => `${tmpKey}${inner}`));
}
}
else {
var encodedKey = encodeURIComponent(key);
var encodedValue;
if (angular.isUndefined(value) || value === null) encodedValue = "";
else encodedValue = encodeURIComponent(value);
if (depth == 1) {
arr.Push(`${encodedKey}=${encodedValue}`);
}
else {
arr.Push(`[${encodedKey}]=${encodedValue}`);
}
}
});
return arr;
}
// Override $http service's default transformRequest
(<any>$httpProvider.defaults).transformRequest = [ function(data: any) {
if (!angular.isObject(data) || data.toString() == "[object File]") return data;
return phpize(data).join("&");
} ];
} ]);
C'est moins efficace que le code de Felipe mais je ne pense pas que cela compte beaucoup, car il devrait être immédiat par rapport à la surcharge globale de la requête HTTP elle-même.
Maintenant, PHP affiche:
[
"A" => "1",
"B" => [
"a" => ""
],
"C" => "",
"D" => "2"
]
Autant que je sache, il est impossible d'obtenir que PHP reconnaisse que Ba et C sont des tableaux vides, mais au moins, les clés apparaissent, ce qui est important lorsqu'il existe du code qui repose sur une certaine structure, même lorsque sa essentiellement vide à l'intérieur.
Notez également qu'il convertit ndefined s et null s en chaînes vides.
Lorsque j'ai eu ce problème, le paramètre que je publiais s'est avéré être un tableau d'objets au lieu d'un simple objet.
Ce n'est pas la faute de Angular. Angular est conçu pour fonctionner dans le monde JSON. Ainsi, lorsque le service $ http envoie la demande AJAX, il envoie toutes vos données sous forme de données utiles, et non sous forme de données de formulaire afin que votre application dorsale puisse les gérer. Mais jQuery fait certaines choses en interne. Vous indiquez au module $ ajax de jQuery de lier les données de formulaire en tant que JSON, mais avant d'envoyer la demande AJAX, il a sérialisé JSON et ajouté l'en-tête application/x-www-form-urlencoded. De cette façon, votre application backend capable de recevoir des données de formulaire sous forme de paramètres de publication et non JSON.
Mais vous pouvez modifier le comportement par défaut du service angular $ http en
- Ajout d'en-tête
- Sérialiser json
$ httpParamSerializerJQLike est un service intégré à Angular qui sérialise json de la même façon que $ .param le fait avec jQuery.
$http({
method: 'POST',
url: 'request-url',
data: $httpParamSerializerJQLike(json-form-data),
headers: {
'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8;'
}
});
Si vous avez besoin d’un plugin pour sérialiser les données de formulaire en JSON d’abord, utilisez celui-ci https://github.com/marioizquierdo/jquery.serializeJSON
Il suffit de mettre les données que vous voulez envoyer comme second paramètre:
$http.post('request-url', message);
Une autre forme qui fonctionne aussi est:
$http.post('request-url', { params: { paramName: value } });
Assurez-vous que paramName correspond exactement au nom du paramètre de la fonction que vous appelez.
J'ai résolu ceci par les codes ci-dessous:
Côté client (Js):
$http({
url: me.serverPath,
method: 'POST',
data: data,
headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
}).
success(function (serverData) {
console.log("ServerData:", serverData);
......
remarquez que les données sont un objet.
Sur le serveur (ASP.NET MVC):
[AllowCrossSiteJson]
public string Api()
{
var data = JsonConvert.DeserializeObject<AgentRequest>(Request.Form[0]);
if (data == null) return "Null Request";
var bl = Page.Bl = new Core(this);
return data.methodName;
}
et 'AllowCrossSiteJsonAttribute' est nécessaire pour les demandes entre domaines:
public class AllowCrossSiteJsonAttribute : ActionFilterAttribute
{
public override void OnActionExecuting(ActionExecutingContext filterContext)
{
filterContext.RequestContext.HttpContext.Response.AddHeader("Access-Control-Allow-Origin", "*");
base.OnActionExecuting(filterContext);
}
}
J'espère que cela a été utile.
J'ai écrit un petit fonction d'assistance PHP qui autorise les deux types de paramètres d'entrée:
function getArgs () {
if ($input = file_get_contents('php://input') && $input_params = json_decode($input,true))
return $input_params + $_POST + $_GET;
return $_POST + $_GET;
}
Utilisation:
<?php
include("util.php"); # above code
$request = getArgs();
$myVar = "";
if (isset($request['myVar']))
$myVar = $request['myVar'];
?>
Par conséquent, aucune modification requise de votre JavaScript.
J'ai eu ce problème, le problème était je ne pouvais pas obtenir les données lors de la publication en utilisant l'en-tête mentionné ci-dessus i.e.
headers: {
'Accept': 'application/json',
'Content-Type': 'application/x-www-form-urlencoded'
}
En utilisant jquery Ajax, nous obtenions généralement des données dans response.body sur le serveur principal, mais lors de la mise en œuvre de Angular ajax, les données ne venaient pas dans response.body à la place, elles tombaient sous
request.getParameterMap.keySet().iterator().next()
Trouvé la solution simple sur
http://jasonwatmore.com/post/2014/04/18/post-a-simple-string-value-from-angularjs-to-net-web-api
return $http.post(Config.apiUrl + '/example/processfile', '"' + fileName + '"');
Je propose juste une version modernisée de réponse de FelipeMiosso :
.config(["$httpProvider", function ($httpProvider) {
function buildKey(parentKey, subKey) {
return parentKey + "[" + subKey + "]";
}
function buildObject(key, value) {
var object = {};
object[key] = value;
return object;
}
function join(array) {
return array.filter(function (entry) {
return entry;
}).join("&");
}
function arrayToQueryString(parentKey, array) {
return join(array.map(function (value, subKey) {
return toQueryString(buildObject(buildKey(parentKey, subKey), value));
}));
}
function objectToQueryString(parentKey, object) {
return join(Object.keys(object).map(function (subKey) {
return toQueryString(buildObject(buildKey(parentKey, subKey), object[subKey]));
}));
}
function toQueryString(input) {
return join(Object.keys(input).map(function (key) {
var value = input[key];
if (value instanceof Array) {
return arrayToQueryString(key, value);
} else if (value instanceof Object) {
return objectToQueryString(key, value);
} else if (undefined !== value && null !== value) {
return encodeURIComponent(key) + "=" + encodeURIComponent(value);
} else {
return "";
}
}));
}
function isQueryStringEligible(input) {
return null !== input && "object" === typeof input && "[object File]" !== String(input);
}
var interceptor = [function () {
return {
request: function (config) {
if (0 <= ["post", "put", "patch"].indexOf(config.method.toLowerCase()) && isQueryStringEligible(config.data)) {
config.headers["Content-Type"] = "application/x-www-form-urlencoded;charset=utf-8";
config.data = toQueryString(config.data);
}
return config;
}
};
}];
$httpProvider.interceptors.Push(interceptor);
}])
Version ES6:
.config(["$httpProvider", function ($httpProvider) {
"use strict";
const buildKey = (parentKey, subKey) => `${parentKey}[${subKey}]`;
const buildObject = (key, value) => ({ [key]: value });
const join = (array) => array.filter((entry) => entry).join("&");
const arrayToQueryString = (parentKey, array) =>
join(array.map((value, subKey) =>
toQueryString(buildObject(buildKey(parentKey, subKey), value))));
const objectToQueryString = (parentKey, object) =>
join(Object.keys(object).map((subKey) =>
toQueryString(buildObject(buildKey(parentKey, subKey), object[subKey]))));
const toQueryString = (input) => join(Object.keys(input).map((key) => {
const value = input[key];
if (value instanceof Array) {
return arrayToQueryString(key, value);
} else if (value instanceof Object) {
return objectToQueryString(key, value);
} else if (undefined !== value && null !== value) {
return `${encodeURIComponent(key)}=${encodeURIComponent(value)}`;
} else {
return "";
}
}));
const isQueryStringEligible = (input) =>
null !== input && "object" === typeof input && "[object File]" !== String(input);
const interceptor = [() => ({
request(config) {
if (0 <= ["post", "put", "patch"].indexOf(config.method.toLowerCase()) && isQueryStringEligible(config.data)) {
config.headers["Content-Type"] = "application/x-www-form-urlencoded;charset=utf-8";
config.data = toQueryString(config.data);
}
return config;
}
})];
$httpProvider.interceptors.Push(interceptor);
}])
utilisez cette façon. pas besoin d'écrire autant
isAuth = $http.post("Yr URL", {username: username, password: password});
et dans le noeud final noeudjs
app.post("Yr URL",function(req,resp)
{
var username = req.body.username||req.param('username');
var password = req.body.password||req.param('password');
}
J'espère que ça aide
En utilisant une méthode très simple, nous pouvons suivre ceci:
$http({
url : "submit_form_adv.php",
method : 'POST',
headers: {'Content-Type': 'application/x-www-form-urlencoded'},
transformRequest: function(obj) {
var str = [];
for(var p in obj)
str.Push(encodeURIComponent(p)+' = '+encodeURIComponent(obj[p]));
return str.join('&');
},
data : {sample_id : 100, sample_name: 'Abin John'},
}).success(function(data, status, headers, config) {
}).error(function(ata, status, headers, config) {
});