প্রকাশিত: এপ্রিল 30, 2025
উদযাপন: এই ওয়েব বৈশিষ্ট্যটি এখন তিনটি প্রধান ব্রাউজার ইঞ্জিনেই উপলব্ধ, এবং 30 মার্চ, 2025 থেকে নতুনভাবে উপলব্ধ বেসলাইনে পরিণত হয়েছে৷
Async ক্লিপবোর্ড API ক্লিপবোর্ডের সাথে কাজ করাকে অতীতের তুলনায় অনেক সহজ করে তুলেছে। ক্লিপবোর্ড পরিচালনার পূর্ববর্তী পদ্ধতির পরিবর্তে, আপনি এখন প্লেইন টেক্সট কন্টেন্টের জন্য navigator.clipboard.writeText() বা "প্রায়" সবকিছুর জন্য navigator.clipboard.write() কল করতে পারেন যেমন ছবি, পাঠ্য বিষয়বস্তু বা HTML।
এখন পর্যন্ত একটি অনুপস্থিত অংশ, যদিও, "প্রায়" পরিমাপ করছিল। উদাহরণস্বরূপ, আপনি চেষ্টা না করা পর্যন্ত API SVG সমর্থিত কিনা তা আপনি জানতে পারেননি, এবং তারপরে, সমর্থন না করার ক্ষেত্রে, নিক্ষেপ করা ব্যতিক্রমটি ধরা পড়ে। এটি সমর্থন নির্ধারণ করার জন্য একটি খুব ergonomic উপায় ছিল না, যে কারণে স্ট্যাটিক ClipboardItem.supports() ফাংশন নির্দিষ্ট করা হয়েছিল।
ফাংশনটি এখন বেসলাইনে পৌঁছেছে নতুনভাবে উপলব্ধ স্থিতি, যার অর্থ ক্লিপবোর্ডের সাথে কাজ করা আরও ভাল হয়ে উঠেছে। একটি ব্রাউজার একটি প্রদত্ত বিন্যাস সমর্থন করে কিনা তা জানতে, ফাংশনে আপনি আগ্রহী এমন বিন্যাসের MIME প্রকারটি পাস করুন৷
const format = 'image/svg+xml';
const supportsFormat = ClipboardItem.supports(format);
console.log(`This browser does${supportsFormat ? '' : ' not'} support ${format}.`);
// "This browser does support image/svg+xml."
আগে, আমি "প্রায়" অন্য সব কিছু লিখেছিলাম, এবং এখানেই এটি সত্যিই আকর্ষণীয় হয়ে ওঠে। ওয়েব কাস্টম ফর্ম্যাটগুলি আপনাকে ব্রাউজারটি স্থানীয়ভাবে সমর্থন করে না এমন ফর্ম্যাটের সাথে কাজ করতে দেয়৷ উদাহরণস্বরূপ, ডিফল্টরূপে, ব্রাউজারটি AVIF ছবি সমর্থন করে না।
const format = 'image/avif';
const supportsFormat = ClipboardItem.supports(format);
console.log(`This browser does${supportsFormat ? '' : ' not'} support ${format}.`);
// "This browser does not support image/avif."
কিন্তু ওয়েব কাস্টম ফরম্যাট ব্যবহার করে, আপনি AVIF ইমেজগুলির সাথে কাজ করতে পারেন এবং সেগুলিকে অবাধে কপি এবং পেস্ট করতে পারেন, যতক্ষণ না গ্রহীতা পক্ষও জানে কিভাবে ওয়েব কাস্টম ফর্ম্যাটের সাথে মোকাবিলা করতে হয়৷
const format = 'web image/avif';
const supportsFormat = ClipboardItem.supports(format);
console.log(`This browser does${supportsFormat ? '' : ' not'} support ${format}.`);
// "This browser does support web image/avif."
ClipboardItem.supports() ফাংশনের জন্য ধন্যবাদ, আপনি এখন ওয়েব কাস্টম ফরম্যাটের জন্য ক্লিপবোর্ড সমর্থন পরিস্থিতি সঠিকভাবে সনাক্ত করতে পারেন এবং নিশ্চিত হন যে এটি কাজ করে।
if (ClipboardItem.supports('web image/avif')) {
// Fetch remote AVIF image and obtain its blob representation.
const blob = await fetch('image.avif').then((response) => response.blob());
try {
// Write the image data to the clipboard, prepending the blob's actual
// type (`"image/avif"` with the string `"web "`, so it becomes
// `"web image/avif"`.
const clipboardItem = new ClipboardItem({
'web image/avif': blob,
});
await navigator.clipboard.write([clipboardItem]);
} catch (err) {
console.error(err.name, err.message);
}
}
ClipboardItem.supports() ফাংশন এখন বেসলাইন নতুনভাবে উপলব্ধ, ওয়েব ডেভেলপাররা নির্ভরযোগ্যভাবে ওয়েব কাস্টম ফর্ম্যাট সহ বিভিন্ন MIME প্রকারের জন্য ক্লিপবোর্ড সমর্থন সনাক্ত করতে পারে। এই বর্ধিতকরণটি ক্লিপবোর্ডের সাথে কাজকে আরও শক্তিশালী এবং অনুমানযোগ্য করে তোলে, সমস্ত ব্রাউজার জুড়ে ব্যবহারকারীর অভিজ্ঞতাকে উন্নত করে৷