Chrome-এ WebAuthn-এর জন্য ইঙ্গিত, সম্পর্কিত অরিজিন অনুরোধ এবং JSON সিরিয়ালাইজেশন পেশ করা হচ্ছে

Chrome 128 এবং 129 WebAuthn-এর জন্য উত্তেজনাপূর্ণ নতুন বৈশিষ্ট্যগুলি প্রবর্তন করে—পাসকি-ভিত্তিক প্রমাণীকরণ সিস্টেম তৈরি করার অন্তর্নিহিত API।

ইজি কিতামুরা

  • ইঙ্গিত : ইঙ্গিতগুলি নির্ভরকারী পক্ষগুলিকে (RPs) ব্রাউজারে WebAuthn UI এর উপর আরও ভাল নিয়ন্ত্রণ দেয়৷ এগুলি এন্টারপ্রাইজ ব্যবহারকারীদের জন্য বিশেষভাবে সহায়ক যারা নিরাপত্তা কী ব্যবহার করতে চান৷
  • রিলেটেড অরিজিন রিকোয়েস্ট : রিলেটেড অরিজিন রিকোয়েস্টের সাথে, RPs একাধিক ডোমেনে পাসকি বৈধ করতে পারে। আপনি যদি একাধিক সাইটের মালিক হন, তাহলে আপনি এখন আপনার ব্যবহারকারীদের আপনার সাইট জুড়ে তাদের পাসকি পুনরায় ব্যবহার করতে সক্ষম করতে পারেন, লগইন ঘর্ষণ দূর করে৷
  • JSON সিরিয়ালাইজেশন : JSON সিরিয়ালাইজেশন API গুলি আপনাকে এনকোডিং এবং ডিকোডিং বিকল্প এবং WebAuthn API-তে এবং থেকে পাস করা শংসাপত্রগুলিকে একটি RP এর ফ্রন্টএন্ড কোড সহজ করতে দেয়৷

ইঙ্গিত

hints সহ, নির্ভরকারী পক্ষগুলি (RP) এখন একটি পাসকি তৈরি করার জন্য বা একটি পাসকি দিয়ে প্রমাণীকরণের জন্য UI পছন্দগুলি নির্দিষ্ট করতে পারে৷

পূর্বে, যখন একটি RP প্রমাণীকরণকারীকে সীমাবদ্ধ করতে চেয়েছিল যা ব্যবহারকারী একটি পাসকি তৈরি করতে বা প্রমাণীকরণ করতে ব্যবহার করতে পারে, তারা "platform" বা "cross-platform" নির্দিষ্ট করতে authenticatorSelection.authenticatorAttachment ব্যবহার করতে পারে। তারা যথাক্রমে প্রমাণীকরণকারীকে একটি প্ল্যাটফর্ম প্রমাণীকরণকারী বা একটি রোমিং প্রমাণীকরণকারীতে সীমাবদ্ধ করে। hints সহ, এই স্পেসিফিকেশন আরও নমনীয় হতে পারে।

RP একটি অ্যারেতে পছন্দের ক্রমে "security-key" , "client-device" এবং "hybrid" নির্দিষ্ট করতে PublicKeyCredentialCreationOptions বা PublicKeyCredentialRequestOptions এ ঐচ্ছিক hints ব্যবহার করতে পারে।

নিম্নলিখিত একটি উদাহরণ শংসাপত্র তৈরির অনুরোধ যা একটি ইঙ্গিত হিসাবে "security-key" সহ "cross-platform" প্রমাণীকরণকে পছন্দ করে। এটি ক্রোমকে এন্টারপ্রাইজ ব্যবহারকারীদের জন্য একটি নিরাপত্তা কী ফোকাসড UI দেখাতে বলে৷

const credential = await navigator.credentials.create({
  publicKey: {
    challenge: *****,
    hints: ['security-key'],
    authenticatorSelection: {
      authenticatorAttachment: 'cross-platform'
    }
  }
});
একটি ইঙ্গিত হিসাবে 'নিরাপত্তা-কী' নির্দিষ্ট করে, ব্রাউজার একটি নিরাপত্তা কী ফোকাসড ডায়ালগ দেখায়।
একটি ইঙ্গিত হিসাবে 'নিরাপত্তা-কী' নির্দিষ্ট করে, ব্রাউজার একটি নিরাপত্তা কী ফোকাসড ডায়ালগ দেখায়।

যখন একটি RP একটি ক্রস-ডিভাইস যাচাইকরণের দৃশ্যকে অগ্রাধিকার দিতে চায়, তখন তারা একটি প্রমাণীকরণ অনুরোধ পাঠাতে পারে যা একটি ইঙ্গিত হিসাবে "hybrid" সহ "cross-platform" প্রমাণীকরণকারীদের পছন্দ করে।

const credential = await navigator.credentials.create({
  publicKey: {
    challenge: *****,
    residentKey: true,
    hints: ['hybrid']
    authenticatorSelection: {
      authenticatorAttachment: 'cross-platform'
    }
  }
});
একটি ইঙ্গিত হিসাবে 'হাইব্রিড' নির্দিষ্ট করে, ব্রাউজার একটি ক্রস-ডিভাইস লগইন ফোকাসড ডায়ালগ দেখায়।
একটি ইঙ্গিত হিসাবে 'হাইব্রিড' নির্দিষ্ট করে, ব্রাউজার একটি ক্রস-ডিভাইস লগইন ফোকাসড ডায়ালগ দেখায়।

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

সমস্ত WebAuthn অনুরোধে অবশ্যই একটি নির্ভরশীল পার্টি আইডি (RP ID) উল্লেখ করতে হবে এবং সমস্ত পাসকি একটি একক RP আইডির সাথে যুক্ত থাকে। ঐতিহ্যগতভাবে, একটি অরিজিন শুধুমাত্র তার ডোমেনের উপর ভিত্তি করে একটি RP আইডি নির্দিষ্ট করতে পারে, তাই এই ক্ষেত্রে www.example.co.uk example.co.uk এর একটি RP আইডি নির্দিষ্ট করতে পারে, কিন্তু example.com নয়। রিলেটেড অরিজিন রিকোয়েস্টের সাথে, টার্গেট ডোমেন থেকে /.well-known/webauthn এ অবস্থিত একটি সুপরিচিত JSON ফাইল এনে একটি দাবিকৃত RP ID যাচাই করা যেতে পারে। সুতরাং example.co.uk (এবং example.in , example.de , ইত্যাদি) সবাই example.com এর একটি RP আইডি ব্যবহার করতে পারে যদি example.com সেগুলিকে নিম্নলিখিত বিন্যাসে নির্দিষ্ট করে:

URL: https://example.com/.well-known/webauthn

{
  "origins": [
    "https://example.co.uk",
    "https://example.de",
    "https://example.sg",
    "https://example.net",
    "https://exampledelivery.com",
    "https://exampledelivery.co.uk",
    "https://exampledelivery.de",
    "https://exampledelivery.sg",
    "https://myexamplerewards.com",
    "https://examplecars.com"
  ]
}

সম্পর্কিত অরিজিন অনুরোধের সাথে আপনার সাইট জুড়ে পাসকি পুনরায় ব্যবহারের অনুমতি দিন সম্পর্কিত উত্সের অনুরোধগুলি কীভাবে সেট আপ করবেন তা শিখুন৷

JSON সিরিয়ালাইজেশন

WebAuthn অনুরোধ এবং প্রতিক্রিয়া অবজেক্টের একাধিক ক্ষেত্র রয়েছে যাতে একটি ArrayBuffer-এ কাঁচা বাইনারি ডেটা থাকে, যেমন শংসাপত্র আইডি, ব্যবহারকারী আইডি বা চ্যালেঞ্জ। যদি কোনো ওয়েবসাইট তার সার্ভারের সাথে এই ডেটা আদান-প্রদানের জন্য JSON ব্যবহার করতে চায়, বাইনারি ডেটা প্রথমে এনকোড করতে হবে, উদাহরণস্বরূপ Base64URL-এর সাথে। এটি ডেভেলপারদের জন্য অপ্রয়োজনীয় জটিলতা যোগ করে যারা তাদের ওয়েবসাইটে পাসকি ব্যবহার শুরু করতে চায়।

WebAuthn এখন APIs অফার করে PublicKeyCredentialCreationOptions এবং PublicKeyCredentialRequestOptions WebAuthn সরাসরি JSON থেকে বস্তুর অনুরোধ করতে এবং সরাসরি JSON-এ PublicKeyCredential প্রতিক্রিয়া সিরিয়ালাইজ করে। সমস্ত ArrayBuffer-মূল্যবান ক্ষেত্রগুলি যেগুলি কাঁচা বাইনারি ডেটা বহন করে স্বয়ংক্রিয়ভাবে তাদের Base64URL-এনকোড করা মানগুলি থেকে বা এতে রূপান্তরিত হয়৷ এই API গুলি Chrome 129 থেকে উপলব্ধ৷

একটি পাসকি তৈরি করার আগে, সার্ভার থেকে একটি JSON এনকোড করা PublicKeyCredentialCreationOptions অবজেক্ট আনুন এবং PublicKeyCredential.parseCreationOptionsFromJSON() ব্যবহার করে এটি ডিকোড করুন।

ব্রাউজার সমর্থন

  • ক্রোম: 129।
  • প্রান্ত: 129।
  • ফায়ারফক্স: 119।
  • সাফারি: সমর্থিত নয়।

উৎস 

export async function registerCredential() {

  // Fetch encoded `PublicKeyCredentialCreationOptions`
  // and JSON decode it.
  const options = await fetch('/auth/registerRequest').json();

  // Decode `PublicKeyCredentialCreationOptions` JSON object
  const decodedOptions = PublicKeyCredential.parseCreationOptionsFromJSON(options);  

  // Invoke the WebAuthn create() function.
  const cred = await navigator.credentials.create({
    publicKey: decodedOptions,
  });
  ...

একটি পাসকি তৈরি করার পরে, toJSON() ব্যবহার করে ফলাফল শংসাপত্রটি এনকোড করুন যাতে এটি সার্ভারে পাঠানো যায়।

ব্রাউজার সমর্থন

  • ক্রোম: 129।
  • প্রান্ত: 129।
  • ফায়ারফক্স: 119।
  • সাফারি: সমর্থিত নয়।

উৎস 

  ...
  const cred = await navigator.credentials.create({
    publicKey: options,
  });

  // Encode the credential to JSON and stringify
  const credential = JSON.stringify(cred.toJSON());

  // Send the encoded credential to the server
  await fetch('/auth/registerResponse', credential);
  ...

একটি পাসকি দিয়ে প্রমাণীকরণ করার আগে, সার্ভার থেকে একটি JSON এনকোড করা PublicKeyRequestCreationOptions আনুন এবং PublicKeyCredential.parseRequestOptionsFromJSON() ব্যবহার করে এটি ডিকোড করুন।

ব্রাউজার সমর্থন

  • ক্রোম: 129।
  • প্রান্ত: 129।
  • ফায়ারফক্স: 119।
  • সাফারি: সমর্থিত নয়।

উৎস 

export async function authenticate() {

  // Fetch encoded `PublicKeyCredentialRequestOptions`
  // and JSON decode it.
  const options = await fetch('/auth/signinRequest').json();

  // Decode `PublicKeyCredentialRequestOptions` JSON object
  const decodedOptions = PublicKeyCredential.parseRequestOptionsFromJSON(options);

  // Invoke the WebAuthn get() function.
  const cred = await navigator.credentials.get({
    publicKey: options
  });
  ...

একটি পাসকি দিয়ে প্রমাণীকরণের পরে, toJSON() পদ্ধতি ব্যবহার করে ফলাফল শংসাপত্রটি এনকোড করুন যাতে এটি সার্ভারে পাঠানো যায়।

ব্রাউজার সমর্থন

  • ক্রোম: 129।
  • প্রান্ত: 129।
  • ফায়ারফক্স: 119।
  • সাফারি: সমর্থিত নয়।

উৎস 

  ...
  const cred = await navigator.credentials.get({
    publicKey: options
  });

  // Encode the credential to JSON and stringify
  const credential = JSON.stringify(cred.toJSON());

  // Send the encoded credential to the server
  await fetch(`/auth/signinResponse`, credential);
  ...

আরও জানুন

WebAuthn এবং পাসকি সম্পর্কে আরও জানতে, নিম্নলিখিত সংস্থানগুলি দেখুন: