জাভাস্ক্রিপ্টে কোয়েরি পরামিতিগুলি কীভাবে তৈরি করবেন?


133

জাভাস্ক্রিপ্টে জিইটি অনুরোধ করার জন্য কোয়েরি পরামিতিগুলি তৈরি করার কোনও উপায় আছে কি ?

পাইথনের মতোই urllib.urlencode(), যা একটি অভিধানে (বা দুটি টিপলের তালিকা) নেয় এবং একটি স্ট্রিং তৈরি করে 'var1=value1&var2=value2'

উত্তর:


189

আপনি এখানে যান:

function encodeQueryData(data) {
   const ret = [];
   for (let d in data)
     ret.push(encodeURIComponent(d) + '=' + encodeURIComponent(data[d]));
   return ret.join('&');
}

ব্যবহার:

const data = { 'first name': 'George', 'last name': 'Jetson', 'age': 110 };
const querystring = encodeQueryData(data);

12
এর সাথে পুনরাবৃত্তি করার সময় আন্তঃব্যবহারযোগ্যতা নিশ্চিত forকরতে hasnwnProperty ব্যবহার করুন ।
19-08 এ ট্রয়স্কলন

3
@ ট্রয়লস্কন, ভালো কথা ... যদিও এই ক্ষেত্রে, কেউ এটি ভাঙতে অবজেক্ট.প্রোটোটাইপ প্রসারিত করতে হবে, যা শুরু করা বেশ খারাপ ধারণা।
শোগ 9

1
@ শোগ 9 কেন এটি খারাপ ধারণা?
সিজার কানাসা

@Cesar, দেখুন: stackoverflow.com/questions/3832617/... **
Shog9

কেবলমাত্র একটি ছোট বিশদ, তবে ret হতে পারে কনস্ট্যান্ট
অ্যালকিস মাভারিডিস

85

ইউআরএল সার্চপ্যারামগুলির ব্রাউজার সমর্থন বাড়ছে।

const data = {
  var1: 'value1',
  var2: 'value2'
};

const searchParams = new URLSearchParams(data);

// searchParams.toString() === 'var1=value1&var2=value2'

নোড.জেএস কোয়েরিস্ট্রিং মডিউলটি সরবরাহ করে।

const querystring = require('querystring');

const data = {
  var1: 'value1',
  var2: 'value2'
};

const searchParams = querystring.stringify(data);

// searchParams === 'var1=value1&var2=value2'

1
অবশ্যই পরিষ্কার এবং আধুনিক পদ্ধতির। পরে আপনি নির্দ্বিধায় কল করতে পারেনsearchParams.append(otherData)
কানাও

81

ক্রিয়ামূলক

function encodeData(data) {
    return Object.keys(data).map(function(key) {
        return [key, data[key]].map(encodeURIComponent).join("=");
    }).join("&");
}   

1
সুন্দর! .map () জাভাস্ক্রিপ্ট ১.6 এ প্রয়োগ করা হয়েছে তাই প্রায় সমস্ত ব্রাউজার, এমনকি বৃদ্ধা লোকেরা এটি সমর্থন করে। তবে আপনি যেমন অনুমান করতে পারেন IE 9+ বাদে নয়। তবে চিন্তা করবেন না, একটি কর্মক্ষেত্র আছে। সূত্র: ডেভেলপার.মোজিলা.আর.ইন-
ইউএস / ডকস / জাভা স্ক্রিপ্ট / রেফারেন্স/…

var data = { bloop1: true, bloop2: "something" }; var url = "https://something.com/?"; var params = encodeData(data); var finalUrl = url + params; // Is this the right use?উত্পাদন করা উচিত https://www.something.com/?bloop1=true&bloop2=something?
dylanh724

1
@DylanHunt: হ্যাঁ ...
Przemek

38

জবাবা বর্তমানে গৃহীত উত্তরের একটি মন্তব্যে একটি পরামর্শ দিয়েছেন যে আমার কাছে সবচেয়ে ভাল সমাধান: jQuery.param () ব্যবহার করুন

যদি আমি jQuery.param()মূল প্রশ্নে ডেটা ব্যবহার করি তবে কোডটি সহজভাবে:

const params = jQuery.param({
    var1: 'value',
    var2: 'value'
});

পরিবর্তনশীল paramsহবে

"var1=value&var2=value"

আরও জটিল উদাহরণ, ইনপুট এবং আউটপুটগুলির জন্য, jQuery.param () ডকুমেন্টেশন দেখুন।


10

আমরা সবেমাত্র arg.js প্রকাশ করেছি , এই প্রকল্পটি একবার এবং সবার জন্য সমাধান করার লক্ষ্য imed এটি traditionতিহ্যগতভাবে এতটা কঠিন ছিল তবে এখন আপনি এটি করতে পারেন:

var querystring = Arg.url({name: "Mat", state: "CO"});

এবং পড়া কাজ:

var name = Arg("name");

বা পুরো লট পেয়ে:

var params = Arg.all();

এবং যদি আপনি তার মধ্যে পার্থক্য সম্পর্কে যত্নশীল হন ?query=trueএবং #hash=trueতবে আপনি পদ্ধতি Arg.query()এবং Arg.hash()পদ্ধতিগুলি ব্যবহার করতে পারেন ।


9

এটি কাজ করা উচিত:

const createQueryParams = params => 
      Object.keys(params)
            .map(k => `${k}=${encodeURI(params[k])}`)
            .join('&');

উদাহরণ:

const params = { name : 'John', postcode: 'W1 2DL'}
const queryParams = createQueryParams(params)

ফলাফল:

name=John&postcode=W1%202DL

1
আমি পরে বুঝতে পেরেছি যে এটি নীচে @ মানবের প্রতিক্রিয়াটির কিছুটা আলাদা সংস্করণ। তবে যাইহোক, এটি এখনও ES6 সিনট্যাক্সের পক্ষে পছন্দনীয় হতে পারে।
নয়েগো

প্রথমত, আপনি কীগুলি এনকোড করছেন না। এছাড়াও, আপনার encodeURIComponent()পরিবর্তে ব্যবহার করা উচিত encodeURIপার্থক্য সম্পর্কে পড়ুন
প্রেজেমেক

9

ES2017 (ES8)

ব্যবহার করা Object.entries(), যা বস্তুর জোড়গুলির একটি অ্যারের প্রদান করে [key, value]। উদাহরণস্বরূপ, {a: 1, b: 2}এটির জন্য ফিরে আসবে [['a', 1], ['b', 2]]। এটি কেবল আইই দ্বারা সমর্থিত নয় (এবং হবে না)।

কোড:

const buildURLQuery = obj =>
      Object.entries(obj)
            .map(pair => pair.map(encodeURIComponent).join('='))
            .join('&');

উদাহরণ:

buildURLQuery({name: 'John', gender: 'male'});

ফলাফল:

"name=John&gender=male"

8

আপনি যদি প্রোটোটাইপ ব্যবহার করেন তবে ফর্ম.সিরিয়ালাইজ রয়েছে

আপনি যদি jQuery ব্যবহার করেন তবে সেখানে অ্যাজাক্স / সিরিয়ালাইজ রয়েছে

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


6
jQuery.param () অবজেক্ট নেয় এবং এটিকে জিইটি কোয়েরি স্ট্রিংয়ে রূপান্তর করে (এই ফাংশনটি আরও ভাল প্রশ্নের সাথে মেলে)।
আজুরকিন

5

প্রায় 10 বছরের পুরানো এই প্রশ্নের পুনরায় দর্শন করতে চান। অফ-দ্য শেল্ফ প্রোগ্রামিংয়ের যুগে, আপনার সেরা বাজি হ'ল নির্ভরতা পরিচালক ( npm) ব্যবহার করে আপনার প্রকল্পটি সেট আপ করা । এখানে লাইব্রেরির একটি সম্পূর্ণ কুটির শিল্প রয়েছে যা ক্যোয়ারী স্ট্রিংগুলি এনকোড করে এবং সমস্ত প্রান্তের কেস যত্ন করে। এটি অন্যতম জনপ্রিয় একটি -

https://www.npmjs.com/package/query-string


খুব অদম্য উত্তর।
মাস্টারেক্সিলো


-11

এই থ্রেডটি পিএইচপি-তে ইউআরএলগুলি পালনের জন্য কিছু কোডকে নির্দেশ করে। রয়েছে escape()এবং unescape()যা বেশিরভাগ কাজ করবে, তবে আপনার কয়েকটি অতিরিক্ত জিনিস যুক্ত করতে হবে।

function urlencode(str) {
str = escape(str);
str = str.replace('+', '%2B');
str = str.replace('%20', '+');
str = str.replace('*', '%2A');
str = str.replace('/', '%2F');
str = str.replace('@', '%40');
return str;
}

function urldecode(str) {
str = str.replace('+', ' ');
str = unescape(str);
return str;
}

3
এনকোডিউআরআইকিউম্পোনেন্ট এটি পরিচালনা করে এবং কোনও জায়গার জন্য ভুলভাবে + ব্যবহার করে না।
অ্যান্থনিডাব্লু জোন্স
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.