বিবরণ
ব্যবহারকারীর ডেটাতে পরিবর্তনগুলি সংরক্ষণ, পুনরুদ্ধার এবং ট্র্যাক করতে chrome.storage API ব্যবহার করুন।
অনুমতিসমূহ
storage স্টোরেজ API ব্যবহার করতে, এক্সটেনশন ম্যানিফেস্টে "storage" অনুমতি ঘোষণা করুন। উদাহরণস্বরূপ:
{
"name": "My extension",
...
"permissions": [
"storage"
],
...
}
উদাহরণ
নিম্নলিখিত নমুনাগুলি local , sync , এবং session স্টোরেজ এলাকাগুলি প্রদর্শন করে:
উদাহরণ (স্থানীয়)
chrome.storage.local.set({ key: value }).then(() => {
console.log("Value is set");
});
chrome.storage.local.get(["key"]).then((result) => {
console.log("Value is " + result.key);
});
উদাহরণ (সিঙ্ক)
chrome.storage.sync.set({ key: value }).then(() => {
console.log("Value is set");
});
chrome.storage.sync.get(["key"]).then((result) => {
console.log("Value is " + result.key);
});
উদাহরণ (সেশন)
chrome.storage.session.set({ key: value }).then(() => {
console.log("Value is set");
});
chrome.storage.session.get(["key"]).then((result) => {
console.log("Value is " + result.key);
});
স্টোরেজ API-এর অন্যান্য ডেমো দেখতে, নিম্নলিখিত নমুনাগুলির যেকোনো একটি অন্বেষণ করুন:
ধারণা এবং ব্যবহার
স্টোরেজ API ব্যবহারকারীর ডেটা এবং অবস্থা ধরে রাখার জন্য একটি এক্সটেনশন-নির্দিষ্ট উপায় প্রদান করে। এটি ওয়েব প্ল্যাটফর্মের স্টোরেজ API গুলির ( IndexedDB , এবং Storage ) অনুরূপ, তবে এক্সটেনশনের স্টোরেজ চাহিদা পূরণের জন্য ডিজাইন করা হয়েছে। নিম্নলিখিত কয়েকটি মূল বৈশিষ্ট্য রয়েছে:
- এক্সটেনশন পরিষেবা কর্মী এবং কন্টেন্ট স্ক্রিপ্ট সহ সমস্ত এক্সটেনশন প্রসঙ্গ স্টোরেজ API-তে অ্যাক্সেস পায়।
- JSON সিরিয়ালাইজেবল মানগুলি অবজেক্ট প্রোপার্টি হিসেবে সংরক্ষণ করা হয়।
- স্টোরেজ API বাল্ক রিড এবং রাইট অপারেশনের সাথে অ্যাসিঙ্ক্রোনাস।
- ব্যবহারকারী ক্যাশে এবং ব্রাউজিং ইতিহাস সাফ করলেও, ডেটা টিকে থাকে।
- স্প্লিট ইনকগনিটো ব্যবহার করার সময়ও সঞ্চিত সেটিংস টিকে থাকে।
- এন্টারপ্রাইজ নীতিগুলির জন্য একটি এক্সক্লুসিভ পঠনযোগ্য পরিচালিত স্টোরেজ এরিয়া অন্তর্ভুক্ত।
এক্সটেনশন কি ওয়েব স্টোরেজ API ব্যবহার করতে পারে?
যদিও এক্সটেনশনগুলি কিছু প্রসঙ্গে (পপআপ এবং অন্যান্য HTML পৃষ্ঠাগুলিতে) Storage ইন্টারফেস ( window.localStorage থেকে অ্যাক্সেসযোগ্য) ব্যবহার করতে পারে, আমরা নিম্নলিখিত কারণে এটি সুপারিশ করি না:
- এক্সটেনশন পরিষেবা কর্মীরা ওয়েব স্টোরেজ API ব্যবহার করতে পারবেন না।
- কন্টেন্ট স্ক্রিপ্টগুলি হোস্ট পৃষ্ঠার সাথে স্টোরেজ শেয়ার করে।
- ব্যবহারকারী যখন তাদের ব্রাউজিং ইতিহাস সাফ করেন তখন ওয়েব স্টোরেজ API ব্যবহার করে সংরক্ষিত ডেটা হারিয়ে যায়।
কোনও পরিষেবা কর্মীর ওয়েব স্টোরেজ API থেকে এক্সটেনশন স্টোরেজ API-তে ডেটা স্থানান্তর করতে:
- একটি অফস্ক্রিন ডকুমেন্ট html পৃষ্ঠা এবং স্ক্রিপ্ট ফাইল প্রস্তুত করুন। স্ক্রিপ্ট ফাইলটিতে একটি রূপান্তর রুটিন এবং একটি
onMessageহ্যান্ডলার থাকা উচিত। - এক্সটেনশন সার্ভিস ওয়ার্কারে, আপনার ডেটার জন্য
chrome.storageপরীক্ষা করুন। - যদি আপনার ডেটা খুঁজে না পাওয়া যায়, তাহলে
createDocument()এ কল করুন। - ফেরত দেওয়া প্রতিশ্রুতি সমাধানের পর, রূপান্তর রুটিন শুরু করতে
sendMessage()কল করুন। - অফস্ক্রিন ডকুমেন্টের
onMessageহ্যান্ডলারের ভিতরে, রূপান্তর রুটিনটি কল করুন।
এক্সটেনশনে ওয়েব স্টোরেজ API কীভাবে কাজ করে তার কিছু সূক্ষ্মতাও রয়েছে। স্টোরেজ এবং কুকিজ নিবন্ধে আরও জানুন।
স্টোরেজ এবং থ্রোটলিং সীমা
স্টোরেজ API-এর ব্যবহারের সীমাবদ্ধতা রয়েছে:
- ডেটা সংরক্ষণের জন্য কর্মক্ষমতা খরচ আছে, এবং API-তে স্টোরেজ কোটা অন্তর্ভুক্ত থাকে। আপনি যে ডেটা সংরক্ষণ করতে চান তা পরিকল্পনা করুন, যাতে আপনার স্টোরেজ স্পেস বজায় থাকে।
- স্টোরেজ সম্পূর্ণ হতে সময় লাগতে পারে। সেই সময়ের জন্য আপনার কোড গঠন করুন।
স্টোরেজ এরিয়ার সীমাবদ্ধতা এবং সেগুলি অতিক্রম করলে কী ঘটে সে সম্পর্কে বিস্তারিত জানতে, sync , local , এবং session এর কোটা তথ্য দেখুন।
স্টোরেজ এরিয়া
স্টোরেজ API নিম্নলিখিত স্টোরেজ এলাকায় বিভক্ত:
স্থানীয়
এক্সটেনশনটি সরানো হলে ডেটা স্থানীয়ভাবে সংরক্ষণ করা হয় এবং সাফ করা হয়। স্টোরেজ সীমা হল 10 MB (Chrome 113 এবং তার আগের সংস্করণগুলিতে 5 MB), তবে "unlimitedStorage" অনুমতির অনুরোধ করে এটি বাড়ানো যেতে পারে। আমরা আরও বেশি পরিমাণে ডেটা সঞ্চয় করার জন্য storage.local ব্যবহার করার পরামর্শ দিই। ডিফল্টরূপে, এটি কন্টেন্ট স্ক্রিপ্টের সংস্পর্শে আসে, তবে chrome.storage.local.setAccessLevel() কল করে এই আচরণ পরিবর্তন করা যেতে পারে।
পরিচালিত
নীতি-ইনস্টল করা এক্সটেনশনের জন্য পরিচালিত স্টোরেজ কেবল পঠনযোগ্য। এটি সিস্টেম প্রশাসকদের দ্বারা পরিচালিত হয়, একটি বিকাশকারী-সংজ্ঞায়িত স্কিমা এবং এন্টারপ্রাইজ নীতি ব্যবহার করে। নীতিগুলি বিকল্পগুলির মতো কিন্তু ব্যবহারকারীর পরিবর্তে একটি সিস্টেম প্রশাসক দ্বারা কনফিগার করা হয়। এটি একটি প্রতিষ্ঠানের সমস্ত ব্যবহারকারীর জন্য এক্সটেনশনটিকে পূর্ব-কনফিগার করার অনুমতি দেয়।
ডিফল্টরূপে, storage.managed কন্টেন্ট স্ক্রিপ্টের সংস্পর্শে আসে, কিন্তু chrome.storage.managed.setAccessLevel() কল করে এই আচরণ পরিবর্তন করা যেতে পারে। নীতি সম্পর্কে তথ্যের জন্য, প্রশাসকদের জন্য ডকুমেন্টেশন দেখুন। managed স্টোরেজ এরিয়া সম্পর্কে আরও জানতে, স্টোরেজ এরিয়াগুলির জন্য ম্যানিফেস্ট দেখুন।
অধিবেশন
এক্সটেনশন লোড হওয়ার সময় সেশন স্টোরেজ মেমোরিতে ডেটা ধরে রাখে। এক্সটেনশনটি অক্ষম করা, পুনরায় লোড করা, আপডেট করা এবং ব্রাউজার পুনরায় চালু হলে স্টোরেজটি সাফ করা হয়। ডিফল্টরূপে, এটি কন্টেন্ট স্ক্রিপ্টের সংস্পর্শে আসে না, তবে chrome.storage.session.setAccessLevel() কল করে এই আচরণ পরিবর্তন করা যেতে পারে। স্টোরেজ সীমা হল 10 MB (Chrome 111 এবং তার আগের সংস্করণে 1 MB)।
storage.session ইন্টারফেসটি পরিষেবা কর্মীদের জন্য আমরা যে কয়েকটি সুপারিশ করি তার মধ্যে একটি।
সিঙ্ক
যদি ব্যবহারকারী সিঙ্কিং সক্ষম করে, তাহলে ডেটা ব্যবহারকারী লগ ইন করা প্রতিটি Chrome ব্রাউজারে সিঙ্ক হবে। যদি অক্ষম করা হয়, তাহলে এটি storage.local এর মতো আচরণ করবে। ব্রাউজার অফলাইনে থাকলে Chrome স্থানীয়ভাবে ডেটা সঞ্চয় করে এবং যখন এটি আবার অনলাইনে আসে তখন সিঙ্কিং পুনরায় শুরু করে। কোটার সীমা প্রায় 100 KB, প্রতি আইটেম 8 KB।
সিঙ্ক করা ব্রাউজারগুলিতে ব্যবহারকারীর সেটিংস সংরক্ষণ করতে আমরা storage.sync ব্যবহার করার পরামর্শ দিচ্ছি। আপনি যদি সংবেদনশীল ব্যবহারকারীর ডেটা নিয়ে কাজ করেন, তাহলে storage.session ব্যবহার করুন। ডিফল্টরূপে, storage.sync কন্টেন্ট স্ক্রিপ্টের সংস্পর্শে আসে, তবে chrome.storage.sync.setAccessLevel() কল করে এই আচরণ পরিবর্তন করা যেতে পারে।
পদ্ধতি এবং ঘটনাবলী
সমস্ত স্টোরেজ এরিয়া StorageArea ইন্টারফেস বাস্তবায়ন করে।
() পান
get() পদ্ধতি আপনাকে StorageArea থেকে এক বা একাধিক কী পড়তে দেয়।
গেটবাইটসইনইউজ()
getBytesInUse() পদ্ধতি আপনাকে StorageArea দ্বারা ব্যবহৃত কোটা দেখতে দেয়।
গেটকিজ()
getKeys() পদ্ধতি আপনাকে StorageArea এ সংরক্ষিত সমস্ত কী পেতে দেয়।
অপসারণ ()
remove() পদ্ধতি আপনাকে StorageArea থেকে একটি আইটেম সরাতে দেয়।
সেট()
set() পদ্ধতি আপনাকে StorageArea এ একটি আইটেম সেট করতে দেয়।
সেটঅ্যাক্সেসলেভেল()
setAccessLevel() পদ্ধতি আপনাকে StorageArea এর অ্যাক্সেস নিয়ন্ত্রণ করতে দেয়।
পরিষ্কার ()
clear() পদ্ধতি আপনাকে StorageArea থেকে সমস্ত ডেটা সাফ করতে দেয়।
পরিবর্তন করা হয়েছে
onChanged ইভেন্ট আপনাকে StorageArea এর পরিবর্তনগুলি পর্যবেক্ষণ করতে দেয়।
ব্যবহারের ক্ষেত্রে
নিম্নলিখিত বিভাগগুলি স্টোরেজ API-এর সাধারণ ব্যবহারের উদাহরণ প্রদর্শন করে।
স্টোরেজ আপডেটের প্রতিক্রিয়া জানান
স্টোরেজে করা পরিবর্তনগুলি ট্র্যাক করতে, এর onChanged ইভেন্টে একটি শ্রোতা যোগ করুন। যখন স্টোরেজে কিছু পরিবর্তন হয়, তখন সেই ইভেন্টটি সক্রিয় হয়। নমুনা কোড এই পরিবর্তনগুলি শোনে:
ব্যাকগ্রাউন্ড.জেএস:
chrome.storage.onChanged.addListener((changes, namespace) => {
for (let [key, { oldValue, newValue }] of Object.entries(changes)) {
console.log(
`Storage key "${key}" in namespace "${namespace}" changed.`,
`Old value was "${oldValue}", new value is "${newValue}".`
);
}
});
আমরা এই ধারণাটিকে আরও এগিয়ে নিয়ে যেতে পারি। এই উদাহরণে, আমাদের কাছে একটি বিকল্প পৃষ্ঠা রয়েছে যা ব্যবহারকারীকে "ডিবাগ মোড" টগল করতে দেয় (বাস্তবায়ন এখানে দেখানো হয়নি)। বিকল্প পৃষ্ঠাটি তাৎক্ষণিকভাবে নতুন সেটিংস storage.sync এ সংরক্ষণ করে এবং পরিষেবা কর্মী যত তাড়াতাড়ি সম্ভব সেটিংস প্রয়োগ করার জন্য storage.onChanged ব্যবহার করে।
অপশন.এইচটিএমএল:
<!-- type="module" allows you to use top level await -->
<script defer src="options.js" type="module"></script>
<form id="optionsForm">
<label for="debug">
<input type="checkbox" name="debug" id="debug">
Enable debug mode
</label>
</form>
অপশন.জেএস:
// In-page cache of the user's options
const options = {};
const optionsForm = document.getElementById("optionsForm");
// Immediately persist options changes
optionsForm.debug.addEventListener("change", (event) => {
options.debug = event.target.checked;
chrome.storage.sync.set({ options });
});
// Initialize the form with the user's option settings
const data = await chrome.storage.sync.get("options");
Object.assign(options, data.options);
optionsForm.debug.checked = Boolean(options.debug);
ব্যাকগ্রাউন্ড.জেএস:
function setDebugMode() { /* ... */ }
// Watch for changes to the user's options & apply them
chrome.storage.onChanged.addListener((changes, area) => {
if (area === 'sync' && changes.options?.newValue) {
const debugMode = Boolean(changes.options.newValue.debug);
console.log('enable debug mode?', debugMode);
setDebugMode(debugMode);
}
});
স্টোরেজ থেকে অ্যাসিঙ্ক্রোনাস প্রিলোড
যেহেতু সার্ভিস ওয়ার্কাররা সবসময় কাজ করে না, তাই ম্যানিফেস্ট V3 এক্সটেনশনগুলিকে কখনও কখনও তাদের ইভেন্ট হ্যান্ডলারগুলি কার্যকর করার আগে স্টোরেজ থেকে অ্যাসিঙ্ক্রোনাসভাবে ডেটা লোড করতে হয়। এটি করার জন্য, নিম্নলিখিত স্নিপেটটি একটি অ্যাসিঙ্ক action.onClicked ইভেন্ট হ্যান্ডলার ব্যবহার করে যা লজিক কার্যকর করার আগে storageCache গ্লোবাল পূরণের জন্য অপেক্ষা করে।
ব্যাকগ্রাউন্ড.জেএস:
// Where we will expose all the data we retrieve from storage.sync.
const storageCache = { count: 0 };
// Asynchronously retrieve data from storage.sync, then cache it.
const initStorageCache = chrome.storage.sync.get().then((items) => {
// Copy the data retrieved from storage into storageCache.
Object.assign(storageCache, items);
});
chrome.action.onClicked.addListener(async (tab) => {
try {
await initStorageCache;
} catch (e) {
// Handle error that occurred during storage initialization.
}
// Normal action handler logic.
storageCache.count++;
storageCache.lastTabId = tab.id;
chrome.storage.sync.set(storageCache);
});
DevTools সম্পর্কে
আপনি DevTools-এ API ব্যবহার করে সংরক্ষিত ডেটা দেখতে এবং সম্পাদনা করতে পারেন। আরও জানতে, DevTools ডকুমেন্টেশনে এক্সটেনশন স্টোরেজ দেখুন এবং সম্পাদনা করুন পৃষ্ঠাটি দেখুন।
প্রকারভেদ
AccessLevel
স্টোরেজ এরিয়ার অ্যাক্সেস লেভেল।
এনাম
"বিশ্বস্ত_প্রসঙ্গ" "বিশ্বস্ত_এবং_অবিশ্বস্ত_বিষয়বস্তু"
এক্সটেনশন থেকেই উদ্ভূত প্রসঙ্গ নির্দিষ্ট করে।
এক্সটেনশনের বাইরে থেকে উদ্ভূত প্রসঙ্গ নির্দিষ্ট করে।
StorageChange
বৈশিষ্ট্য
- নতুন মূল্য
যেকোনো ঐচ্ছিক
যদি নতুন মান থাকে, তাহলে আইটেমটির নতুন মান।
- পুরাতন মূল্য
যেকোনো ঐচ্ছিক
যদি জিনিসটির পুরনো মূল্য থাকে, তাহলে তার পুরনো মূল্য।
বৈশিষ্ট্য
local
local স্টোরেজ এলাকার জিনিসপত্র প্রতিটি মেশিনের জন্য স্থানীয়।
আদর্শ
স্টোরেজএলাকা এবং বস্তু
বৈশিষ্ট্য
- কোটা_বাইটস
১০৪৮৫৭৬০
স্থানীয় স্টোরেজে সর্বাধিক কত ডেটা (বাইটে) সংরক্ষণ করা যেতে পারে, যা প্রতিটি মান এবং প্রতিটি কী-এর দৈর্ঘ্যের JSON স্ট্রিংফিকেশন দ্বারা পরিমাপ করা হয়। এক্সটেনশনের
unlimitedStorageঅনুমতি থাকলে এই মানটি উপেক্ষা করা হবে। যেসব আপডেটের কারণে এই সীমা অতিক্রম করা হবে তা অবিলম্বে ব্যর্থ হয় এবং কলব্যাক ব্যবহার করার সময়runtime.lastErrorসেট করে, অথবা async/await ব্যবহার করার সময় প্রত্যাখ্যাত প্রতিশ্রুতি সেট করে।
managed
managed স্টোরেজ এরিয়ার আইটেমগুলি ডোমেন অ্যাডমিনিস্ট্রেটর দ্বারা কনফিগার করা একটি এন্টারপ্রাইজ নীতি দ্বারা সেট করা হয় এবং এক্সটেনশনের জন্য কেবল পঠনযোগ্য; এই নেমস্পেসটি পরিবর্তন করার চেষ্টা করলে একটি ত্রুটি দেখা দেয়। একটি নীতি কনফিগার করার তথ্যের জন্য, স্টোরেজ এরিয়ার জন্য ম্যানিফেস্ট দেখুন।
আদর্শ
session
session স্টোরেজ এরিয়ার আইটেমগুলি মেমোরিতে সংরক্ষণ করা হয় এবং ডিস্কে সংরক্ষণ করা হবে না।
আদর্শ
স্টোরেজএলাকা এবং বস্তু
বৈশিষ্ট্য
- কোটা_বাইটস
১০৪৮৫৭৬০
প্রতিটি মান এবং কী-এর গতিশীলভাবে বরাদ্দকৃত মেমরি ব্যবহারের অনুমান করে পরিমাপ করা সর্বোচ্চ পরিমাণ (বাইটে) মেমরিতে সংরক্ষণ করা যেতে পারে। যেসব আপডেটের কারণে এই সীমা অতিক্রম করা হবে তা অবিলম্বে ব্যর্থ হয় এবং কলব্যাক ব্যবহার করার সময় অথবা যখন কোনও প্রতিশ্রুতি প্রত্যাখ্যান করা হয় তখন
runtime.lastErrorসেট করে।
sync
sync স্টোরেজ এরিয়ার আইটেমগুলি Chrome সিঙ্ক ব্যবহার করে সিঙ্ক করা হয়।
আদর্শ
স্টোরেজএলাকা এবং বস্তু
বৈশিষ্ট্য
- সর্বোচ্চ_আইটেম
৫১২
সিঙ্ক স্টোরেজে সর্বাধিক কতগুলি আইটেম সংরক্ষণ করা যেতে পারে। যেসব আপডেট এই সীমা অতিক্রম করবে তা অবিলম্বে ব্যর্থ হবে এবং কলব্যাক ব্যবহার করার সময় অথবা কোনও প্রতিশ্রুতি প্রত্যাখ্যান করার সময়
runtime.lastErrorসেট করবে। - সর্বোচ্চ_টেকসই_লেখা_অপারেশন_প্রতি_মিনিট
১০০০০০০০
অবচিতstorage.sync API-তে আর কোনও স্থায়ী লেখার অপারেশন কোটা নেই।
- প্রতি ঘন্টায় সর্বোচ্চ_লেখা_কার্যক্রম
১৮০০
প্রতি ঘন্টায় সর্বাধিক কতগুলি
set,removeবাclearঅপারেশন করা যেতে পারে। এটি প্রতি ২ সেকেন্ডে ১, যা স্বল্পমেয়াদী উচ্চতর লেখা-প্রতি-মিনিট সীমার চেয়ে কম।যেসব আপডেটের কারণে এই সীমা অতিক্রম করা হবে, সেগুলো তাৎক্ষণিকভাবে ব্যর্থ হয় এবং কলব্যাক ব্যবহার করার সময় অথবা প্রতিশ্রুতি প্রত্যাখ্যান করার সময়
runtime.lastErrorসেট করে। - সর্বোচ্চ_লেখা_অপারেশন_প্রতি_মিনিট
১২০
প্রতি মিনিটে সর্বাধিক কতগুলি
set,removeবাclearঅপারেশন করা যেতে পারে। এটি প্রতি সেকেন্ডে 2, যা স্বল্প সময়ের মধ্যে প্রতি ঘন্টায় লেখার চেয়ে বেশি থ্রুপুট প্রদান করে।যেসব আপডেটের কারণে এই সীমা অতিক্রম করা হবে, সেগুলো তাৎক্ষণিকভাবে ব্যর্থ হয় এবং কলব্যাক ব্যবহার করার সময় অথবা প্রতিশ্রুতি প্রত্যাখ্যান করার সময়
runtime.lastErrorসেট করে। - কোটা_বাইটস
১০২৪০০
সিঙ্ক স্টোরেজে সর্বাধিক মোট কত ডেটা সংরক্ষণ করা যেতে পারে, যা প্রতিটি মান এবং প্রতিটি কী-এর দৈর্ঘ্যের JSON স্ট্রিংফিকেশন দ্বারা পরিমাপ করা হয়। যেসব আপডেটের কারণে এই সীমা অতিক্রম করা হবে তা অবিলম্বে ব্যর্থ হয় এবং কলব্যাক ব্যবহার করার সময় অথবা যখন কোনও প্রতিশ্রুতি প্রত্যাখ্যান করা হয় তখন
runtime.lastErrorসেট করে। - কোটা_বাইটেস_পার_আইটেম
৮১৯২
সিঙ্ক স্টোরেজে প্রতিটি আইটেমের সর্বোচ্চ আকার (বাইটে), যা JSON স্ট্রিংফিকেশনের মাধ্যমে পরিমাপ করা হয় এবং এর মান এবং এর কী দৈর্ঘ্যের পরিমাপ করা হয়। এই সীমার চেয়ে বড় আইটেম ধারণকারী আপডেটগুলি অবিলম্বে ব্যর্থ হবে এবং কলব্যাক ব্যবহার করার সময় অথবা কোনও প্রতিশ্রুতি প্রত্যাখ্যান করার সময়
runtime.lastErrorসেট করবে।
ইভেন্টগুলি
onChanged
chrome.storage.onChanged.addListener(
callback: function,
)
এক বা একাধিক আইটেম পরিবর্তন হলে বরখাস্ত করা হয়।
পরামিতি
- কলব্যাক
ফাংশন
callbackপ্যারামিটারটি দেখতে এরকম:(changes: object, areaName: string) => void
- পরিবর্তন
বস্তু
- এলাকার নাম
স্ট্রিং