AngularJS - S http.post এর জন্য JSON এর পরিবর্তে অনুরোধের পরামিতিগুলি প্রেরণের কোনও উপায়?

Question

আমার কিছু পুরাতন কোড রয়েছে যা jQuery এর পোস্ট পদ্ধতির মাধ্যমে একটি এজাক্স পোস্ট অনুরোধ করছে এবং এরকম কিছু দেখাচ্ছে:

$.post("/foo/bar", requestData,
    function(responseData)
    {
        //do stuff with response
    }

requestData কিছু প্রাথমিক স্ট্রিং বৈশিষ্ট্য সহ কেবল একটি জাভাস্ক্রিপ্ট অবজেক্ট।

আমি কৌণিক ব্যবহারের জন্য আমাদের জিনিসগুলি সরানোর প্রক্রিয়াধীন এবং আমি এই কলটি $ http.post দিয়ে প্রতিস্থাপন করতে চাই। আমি নিম্নলিখিত নিয়ে এসেছি:

$http.post("/foo/bar", requestData).success(
    function(responseData) {
        //do stuff with response
    }
});

যখন আমি এটি করেছি, আমি সার্ভার থেকে একটি 500 ত্রুটি প্রতিক্রিয়া পেয়েছি। ফায়ারব্যাগ ব্যবহার করে, আমি দেখতে পেলাম যে এটি অনুরোধের বডিটি এভাবে পাঠিয়েছে:

{"param1":"value1","param2":"value2","param3":"value3"}

সফল jQuery $.postশরীরকে এইভাবে প্রেরণ করে:

param1=value1&param2=value2&param3=value3

আমি যে শেষ পয়েন্টটি হিট করছি তা জেএসএন নয়, অনুরোধের পরামিতিগুলির প্রত্যাশা করছে। সুতরাং, আমার প্রশ্নটি কি $http.postজাভাস্ক্রিপ্ট অবজেক্টটি JSON এর পরিবর্তে অনুরোধের প্যারামিটার হিসাবে প্রেরণ করার কথা বলা আছে? হ্যাঁ, আমি জানি আমি বস্তুটি থেকে নিজেই স্ট্রিংটি তৈরি করতে পারি, তবে আমি জানতে চাই যে এঙ্গুলারটি বাক্সের বাইরে কিছু সরবরাহ করে কিনা।

Answer 1

আমি মনে করি params কনফিগার প্যারামিটারটি এখানে কাজ করবে না কারণ এটি শরীরের পরিবর্তে ইউআরএলটিতে স্ট্রিং যুক্ত করে তবে ইনফেলিগো এখানে যা প্রস্তাব করেছিল তা যুক্ত করার জন্য এটি একটি ডিফল্ট ট্রান্সফর্মের গ্লোবাল ওভাররাইডের উদাহরণ (jQuery প্যারাম ব্যবহার করে) উদাহরণ হিসাবে প্যারাম স্ট্রিং থেকে ডেটা)।

গ্লোবাল ট্রান্সফর্ম রিকোয়েস্ট ফাংশন সেট আপ করুন:

var app = angular.module('myApp');

app.config(function ($httpProvider) {
    $httpProvider.defaults.transformRequest = function(data){
        if (data === undefined) {
            return data;
        }
        return $.param(data);
    }
});

এইভাবে সমস্ত কল $ http.post এ স্বয়ংক্রিয়ভাবে শরীরকে jQuery $.postকল দ্বারা ব্যবহৃত একই প্যারাম ফর্ম্যাটে রূপান্তরিত করে ।

দ্রষ্টব্য আপনি কলের জন্য সামগ্রী বা প্রকারের শিরোনামটি সেট করতে বা বিশ্বব্যাপী এমনটিও করতে চাইতে পারেন:

$httpProvider.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded; charset=UTF-8';

প্রতি কল প্রতি অ-গ্লোবাল ট্রান্সফর্ম অনুরোধ:

    var transform = function(data){
        return $.param(data);
    }

    $http.post("/foo/bar", requestData, {
        headers: { 'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'},
        transformRequest: transform
    }).success(function(responseData) {
        //do stuff with response
    });

Comments

আমি ভাবছিলাম যে ট্রান্সফর্মআরকুয়েস্ট ফাংশন ছাড়াও অন্য কিছু ছিল, তবে মনে হচ্ছে এটি নেই। JQuery প্যারাম ফাংশন সম্পর্কে মাথা আপ করার জন্য ধন্যবাদ।

— dnc253

কল-মেথড প্রতি কল-পদ্ধতিটি আমার পক্ষে ভাল কাজ করছে, তবে যখন বিশ্বব্যাপী মাধ্যমে সেট আপ করার চেষ্টা করা হচ্ছে $httpProvider.defaults, তখন এটি কাজ করছে না, এ সম্পর্কে কোনও ক্লু?

— Dfr

ডাব্লুআরটি বিশ্বব্যাপী এটি কনফিগার করছে, আমারও সমস্যা আছে। আমি এখানে প্রদত্ত স্নিপেট ব্যবহার করে যখন এটি করার চেষ্টা করি তখন আমার একটি ত্রুটি হয় Cannot read property "jquery" of undefined.আমি কীভাবে এটি ঠিক করব? পুনশ্চ. প্রতি কল ট্রান্সফর্মেশন কাজ।

— kshep92

@ kshep92 যা হচ্ছে তা হ'ল ট্রান্সফর্মআরকুয়েস্ট ফাংশনটি কোনও ডেটা ছাড়াই একটি অনুরোধের ভিত্তিতে কল করা হচ্ছে যাতে 'ডেটা' অপরিবর্তিত থাকে। আমি 'রিটার্ন $ .প্রেম (ডেটা);' এর আগে একটি গার্ড যুক্ত করেছি। ট্রান্সফর্মআরকুয়েস্ট ফাংশনে প্রথম লাইন হিসাবে এটি সন্নিবেশ করুন: 'যদি (ডেটা === অপরিবর্তিত) রিটার্ন ডেটা;' আমি উত্তরে সম্পাদনা দেখুন।

— জেরে জোনস

কৌণিক ১.৪ অনুসারে আপনি jQuery ডকসগুলির

— api/

Answer 2

যদি কৌণিক> = 1.4 ব্যবহার করা হয় তবে আমি এখানে সবচেয়ে পরিষ্কার সমাধানটি পেয়েছি যা কাস্টম বা বাহ্যিক কোনও কিছুর উপর নির্ভর করে না:

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';
});

এবং তারপরে আপনি এটি আপনার অ্যাপ্লিকেশনটিতে যে কোনও জায়গায় করতে পারেন:

$http({
  method: 'POST',
  url: '/requesturl',
  data: {
    param1: 'value1',
    param2: 'value2'
  }
});

এবং এটি ডেটাটিকে যথাযথভাবে সিরিয়ালাইজ করবে এবং এটিকে বিষয়বস্তু-টাইপ শিরোনামের সাথে param1=value1&param2=value2প্রেরণ করবে কারণ এটি সাধারণত শেষ পয়েন্টগুলিতে POST অনুরোধগুলির সাথে প্রত্যাশিত।/requesturlapplication/x-www-form-urlencoded; charset=utf-8

Answer 3

অ্যাঙ্গুলারজেএস ডকুমেন্টেশন থেকে:

প্যারাম - ject অবজেক্ট} - স্ট্রিং বা অবজেক্টের মানচিত্র যা ইউআরএল পরে? কী 1 = মান 1 এবং কী 2 = মান 2 তে পরিণত হবে। মানটি যদি স্ট্রিং না হয় তবে এটি JSONified হবে।

সুতরাং, পরামিতি হিসাবে স্ট্রিং সরবরাহ করুন। যদি আপনি এটি না চান, তবে রূপান্তরগুলি ব্যবহার করুন। আবার, ডকুমেন্টেশন থেকে:

স্থানীয়ভাবে এই রূপান্তরটি ওভাররাইড করতে ট্রান্সফর্ম ফাংশনগুলি ট্রান্সফর্মআরকুয়েস্ট এবং / অথবা কনফিগার অবজেক্টের ট্রান্সফর্মআরস্পোন বৈশিষ্ট্য হিসাবে নির্দিষ্ট করুন। ডিফল্ট রূপান্তরগুলি বিশ্বব্যাপী ওভাররাইড করতে, $ httpProvider.defaults.transformRequest এবং $ httpProvider.defaults.transforResponse বৈশিষ্ট্যগুলি $ httpProvider এর ওভাররাইড করুন।

পড়ুন ডকুমেন্টেশন আরো বিস্তারিত জানার জন্য।

Comments

আমি ডকুমেন্টেশনে প্যারামগুলি দেখেছি, এবং গ্লোপি উল্লেখ করার মতো, আমার এটি শরীরে দরকার, ইউআরএলে নয়। আমি ভাবছিলাম যে JSON এর পরিবর্তে প্যারামিটারগুলি করার জন্য আমি কিছু অপশন বা কিছু অনুপস্থিত ছিলাম, তবে মনে হচ্ছে কেবল ট্রান্সফর্মআরকোস্ট সম্পত্তিটি ব্যবহার করা দরকার।

— dnc253

Answer 4

JQuery এর ব্যবহার করুন $.paramঅনুরোধডেটায় JSON ডেটা ক্রমিক করতে ফাংশনটি ।

সংক্ষেপে, আপনার মতো অনুরূপ কোড ব্যবহার করে:

$http.post("/foo/bar",
$.param(requestData),
{
    headers:
    {
        'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'
    }
}
).success(
    function(responseData) {
        //do stuff with response
    }
});

এটি ব্যবহারের জন্য, আপনাকে অ্যাংুলারজেএস সহ আপনার পৃষ্ঠাতে jQuery অন্তর্ভুক্ত করতে হবে।

Answer 5

নোট করুন যে কৌণিক 1.4 হিসাবে, আপনি jQuery ব্যবহার না করে ফর্ম ডেটা ক্রমিক করতে পারেন।

অ্যাপ.জেজেসে:

module.run(function($http, $httpParamSerializerJQLike) {
  $http.defaults.transformRequest.unshift($httpParamSerializerJQLike);
});

তারপরে আপনার নিয়ামকটিতে:

$http({
    method: 'POST',
    url: myUrl',
    headers: {'Content-Type': 'application/x-www-form-urlencoded'},
    data: myData
});

Comments

এই উত্তর দুর্দান্ত। এটি অ্যাঙ্গুলার থেকে পোস্টের সাথে 2 টি প্রধান সমস্যার সমাধান করে। শিরোনামটি অবশ্যই সঠিকভাবে সেট করা উচিত এবং আপনাকে জসন ডেটা সিরিয়ালাইজ করতে হবে। আপনার যদি আইই 8 সমর্থন প্রয়োজন না হয় তবে 1.4+ বা তার পরে ব্যবহার করুন।

— এমবোকিল

আমি কেবল এটি বাস্তবায়ন করেছি এবং এটি পোস্টের সাথে থাকা সমস্যাগুলির সমাধান করে তবে প্যাচ কীভাবে কাজ করে তা পরিবর্তিত করে এবং $ http.patch () এর আমার সমস্ত ব্যবহার ভঙ্গ করে বলে মনে হয়।

— মাইক ফেল্টম্যান

Answer 6

এটি কিছুটা হ্যাক হতে পারে তবে আমি সমস্যাটি এড়িয়ে গিয়ে সার্ভারের দিক থেকে জেসনকে পিএইচপি-র পোস্টের অ্যারে রূপান্তরিত করেছি:

$_POST = json_decode(file_get_contents('php://input'), true);

Comments

আমি এই পদ্ধতিটি ব্যবহার করেছি, তবে আমি এটি ঘৃণা করি; আমাকে কেন এটি ব্যবহার করতে হয়েছে তা নির্ধারণ করতে এবং আমাকে দীর্ঘ সময় নিয়েছিল।

— মেকনরোয়

যেমন আমি বলেছিলাম - এটি হ্যাকি লাগছে। বেশিরভাগ পিএইচপি;)

— টিমোসোলো

Answer 7

কাস্টম HTTP প্রমাণীকরণ সেট করার ক্ষেত্রে আমারও সমস্যা আছে কারণ $ সংস্থানটি অনুরোধটিকে ক্যাশে করে।

এটি কাজ করতে আপনাকে এটি করতে গিয়ে বিদ্যমান শিরোনামগুলি ওভাররাইট করতে হবে

var transformRequest = function(data, headersGetter){
  var headers = headersGetter();
  headers['Authorization'] = 'WSSE profile="UsernameToken"';
  headers['X-WSSE'] = 'UsernameToken ' + nonce
  headers['Content-Type'] = 'application/json';
};

return $resource(
  url,
    {
    },
    {
      query: {
        method: 'POST',
        url: apiURL + '/profile',
        transformRequest: transformRequest,
        params: {userId: '@userId'}
      },
    }
);

আমি আশা করি আমি কাউকে সাহায্য করতে সক্ষম হয়েছি এটি বের করতে আমার 3 দিন সময় লেগেছে।

Comments

আমার ধারণা আপনি আমাকে মাত্র 3 দিনের কাজ বাঁচিয়েছেন। ধন্যবাদ !!! আমি এখনও অনুরোধ কলকে কোনওভাবে বাধা দিতে পারি কিনা তা খুঁজে বের করার চেষ্টা করছি যাতে আমি প্রতিটি কলের জন্য একটি কাস্টম শিরোনাম ইনজেক্ট করতে পারি।

— মার্কোসেউ

Answer 8

ডিফল্ট শিরোলেখগুলি সংশোধন করুন:

$http.defaults.headers.post["Content-Type"] = "application/x-www-form-urlencoded;charset=utf-8";

তারপরে JQuery এর $.paramপদ্ধতিটি ব্যবহার করুন :

var payload = $.param({key: value});
$http.post(targetURL, payload);

Answer 9

   .controller('pieChartController', ['$scope', '$http', '$httpParamSerializerJQLike', function($scope, $http, $httpParamSerializerJQLike) {
        var data = {
                TimeStamp : "2016-04-25 12:50:00"
        };
        $http({
            method: 'POST',
            url: 'serverutilizationreport',
            headers: {'Content-Type': 'application/x-www-form-urlencoded'},
            data: $httpParamSerializerJQLike(data),
        }).success(function () {});
    }
  ]);

Comments

আমার মতে এটির সবচেয়ে সহজ এবং সহজ ... আরও অনেক উপায় থাকতে পারে

— রোহিত লুথ্রা

Answer 10

দ্রুত সমন্বয় - আপনারা যারা ট্রান্সফর্মআরকুয়েস্ট ফাংশনটির বৈশ্বিক কনফিগারেশন নিয়ে সমস্যায় পড়েছেন, Cannot read property 'jquery' of undefinedত্রুটি থেকে মুক্তি পেতে আমি যে স্নিপেটটি ব্যবহার করছি তা এখানে :

$httpProvider.defaults.transformRequest = function(data) {
        return data != undefined ? $.param(data) : null;
    }

Answer 11

আপনি সার্ভারে কোড পরিবর্তন না করে, $http.postকলটিতে শিরোনাম পরিবর্তন করতে $_POSTএবং নিয়মিত উপায় ব্যবহার না করেও এই সমস্যার সমাধান করতে পারেন । এখানে ব্যাখ্যা করা হয়েছে: http://victorblog.com/2012/12/20/make-angularjs-http-service-behave- Like-jquery-ajax/

Answer 12

আমি পুরো এর বহুবার সমস্যাযুক্ত আচরণ পেয়েছি। আমি এটিকে এক্সপ্রেস (টাইপিং ছাড়াই) এবং বডি পার্সার (ডিটি-বডি পার্সার টাইপ সহ) ব্যবহার করেছি used

আমি কোনও পোস্ট আপলোড করার চেষ্টা করিনি, পরিবর্তে কোনও পোস্ট স্ট্রিংয়ে দেওয়া জেএসএনকে ব্যাখ্যা করার জন্য।

request.bodyকেবল একটি খালি JSON ছিল ( {})।

অনেক তদন্তের পরে অবশেষে এটি আমার পক্ষে কাজ করেছে:

import { json } from 'body-parser';
...
app.use(json()); <-- should be defined before the first POST handler!

application/jsonক্লায়েন্টের পক্ষ থেকে অনুরোধ স্ট্রিংয়ে সামগ্রীর ধরণটি দেওয়াও গুরুত্বপূর্ণ হতে পারে ।

Comments

স্টাইলের উত্তরের জন্য "এবং একটি কালো মুরগি উত্সর্গ" -এর জন্য আমি দুঃখিত, টাইপস্ক্রিপ্ট / নোড / কৌণিক পরিবেশের বর্তমান পর্যায়ে দুর্ভাগ্যক্রমে সাধারণ what

— পিটারহ - মনিকা পুনরায় ইনস্টল করুন

Answer 13

AngularJS v1.4.8 + (v1.5.0) এর জন্য সিনট্যাক্স

       $http.post(url, data, config)
            .then(
                    function (response) {
                        // success callback
                    },
                    function (response) {
                        // failure callback
                    }
            );

উদাহরণ:

    var url = "http://example.com";

    var data = {
        "param1": "value1",
        "param2": "value2",
        "param3": "value3"
    };

    var config = {
        headers: {
            'Content-Type': "application/json"
        }
    };

    $http.post(url, data, config)
            .then(
                    function (response) {
                        // success callback
                    },
                    function (response) {
                        // failure callback
                    }
            );