Electron অ্যাপ্লিকেশনগুলিতে Local Storage এবং Session Storage সাধারণত ওয়েব অ্যাপ্লিকেশনগুলির মতোই ব্যবহৃত হয়। এই স্টোরেজগুলো ওয়েব ব্রাউজারে সংরক্ষিত ডেটা রাখতে সহায়তা করে, তবে Electron অ্যাপ্লিকেশনগুলোতে এগুলি ব্যবহার করার মাধ্যমে ডেটা ক্লায়েন্ট-সাইডে সংরক্ষণ করা সম্ভব হয়। এগুলোর মধ্যে পার্থক্য হলো, Local Storage ডেটা দীর্ঘমেয়াদীভাবে (persistently) সংরক্ষণ করে, যখন Session Storage শুধুমাত্র একটি সেশন চলাকালীন (temporary) ডেটা সংরক্ষণ করে।
১. Local Storage ব্যবহার করা
Local Storage হলো ওয়েব ব্রাউজারে ডেটা সংরক্ষণের একটি পদ্ধতি, যা ডেটা ব্রাউজার বন্ধ না হওয়া পর্যন্ত সংরক্ষণ করে। Electron অ্যাপ্লিকেশনে এটি ব্যবহার করা যায় যাতে অ্যাপ্লিকেশন বন্ধ হওয়ার পরেও ডেটা সংরক্ষিত থাকে।
উদাহরণ: Local Storage
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Local Storage Example</title>
</head>
<body>
<h1>Electron Local Storage Example</h1>
<input type="text" id="dataInput" placeholder="Enter some data">
<button id="saveBtn">Save to Local Storage</button>
<button id="loadBtn">Load from Local Storage</button>
<p id="storedData"></p>
<script>
document.getElementById('saveBtn').addEventListener('click', () => {
const data = document.getElementById('dataInput').value;
localStorage.setItem('userData', data); // Local Storage-এ ডেটা সংরক্ষণ করা
});
document.getElementById('loadBtn').addEventListener('click', () => {
const storedData = localStorage.getItem('userData'); // Local Storage থেকে ডেটা লোড করা
document.getElementById('storedData').textContent = storedData || 'No data found';
});
</script>
</body>
</html>
কীভাবে কাজ করে:
localStorage.setItem(): এই মেথড ব্যবহার করে আপনি ডেটা Local Storage-এ সংরক্ষণ করতে পারেন।localStorage.getItem(): এই মেথড ব্যবহার করে আপনি Local Storage থেকে ডেটা পুনরুদ্ধার করতে পারেন।
২. Session Storage ব্যবহার করা
Session Storage হলো একটি ওয়েব স্টোরেজ পদ্ধতি যা শুধুমাত্র একটি ব্রাউজার সেশন চলাকালীন ডেটা সংরক্ষণ করে। সেশন শেষ হওয়ার পর ডেটা মুছে ফেলা হয়। এটি Local Storage এর মতোই কাজ করে, তবে ডেটা একটি নির্দিষ্ট সেশনের মধ্যে সীমাবদ্ধ থাকে।
উদাহরণ: Session Storage
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Session Storage Example</title>
</head>
<body>
<h1>Electron Session Storage Example</h1>
<input type="text" id="sessionDataInput" placeholder="Enter some session data">
<button id="saveSessionBtn">Save to Session Storage</button>
<button id="loadSessionBtn">Load from Session Storage</button>
<p id="sessionStoredData"></p>
<script>
document.getElementById('saveSessionBtn').addEventListener('click', () => {
const data = document.getElementById('sessionDataInput').value;
sessionStorage.setItem('sessionData', data); // Session Storage-এ ডেটা সংরক্ষণ
});
document.getElementById('loadSessionBtn').addEventListener('click', () => {
const storedSessionData = sessionStorage.getItem('sessionData'); // Session Storage থেকে ডেটা লোড
document.getElementById('sessionStoredData').textContent = storedSessionData || 'No session data found';
});
</script>
</body>
</html>
কীভাবে কাজ করে:
sessionStorage.setItem(): এই মেথড ব্যবহার করে আপনি ডেটা Session Storage-এ সংরক্ষণ করতে পারেন।sessionStorage.getItem(): এই মেথড ব্যবহার করে আপনি Session Storage থেকে ডেটা পুনরুদ্ধার করতে পারেন।
৩. Local Storage এবং Session Storage এর মধ্যে পার্থক্য
| বৈশিষ্ট্য | Local Storage | Session Storage |
|---|---|---|
| ডেটা সংরক্ষণকাল | ডেটা ব্রাউজার বন্ধ না হওয়া পর্যন্ত সংরক্ষিত থাকে। | ডেটা শুধুমাত্র একটি সেশন চলাকালীন সংরক্ষিত থাকে। |
| ডেটা প্যাকেজিং | একটি key-value পেয়ার হিসেবে সংরক্ষিত থাকে। | একটি key-value পেয়ার হিসেবে সংরক্ষিত থাকে। |
| সাইজ | সাধারণত 5MB পর্যন্ত ডেটা সংরক্ষণ করা যায়। | সাধারণত 5MB পর্যন্ত ডেটা সংরক্ষণ করা যায়। |
| ব্যবহার | দীর্ঘমেয়াদী ডেটা সংরক্ষণে ব্যবহার করা হয়। | সেশন ভিত্তিক ডেটা সংরক্ষণের জন্য ব্যবহৃত হয়। |
৪. Electron এ Local Storage এবং Session Storage এর নিরাপত্তা
- XSS আক্রমণ (Cross-Site Scripting):
- Local Storage এবং Session Storage-এ সংরক্ষিত ডেটা স্ক্রিপ্টের মাধ্যমে অ্যাক্সেস করা যেতে পারে। তাই, যদি আপনার অ্যাপে Cross-Site Scripting (XSS) আক্রমণ ঘটে, তবে ডেটা চুরি হতে পারে।
- Solution: XSS আক্রমণ প্রতিরোধে, Content Security Policy (CSP) ব্যবহার করুন এবং ইনপুট ভ্যালিডেশন এবং এস্কেপিং সঠিকভাবে করুন।
- ডেটা এনক্রিপশন:
- Sensitive data যেমন পাসওয়ার্ড বা ক্রেডেনশিয়াল কখনোই Local Storage বা Session Storage-এ সরাসরি সংরক্ষণ করা উচিত নয়। এই ধরনের তথ্যের জন্য এনক্রিপশন ব্যবহার করা উচিত।
- Solution: ডেটা এনক্রিপ্ট করার জন্য crypto মডিউল ব্যবহার করুন বা অন্য কোন এনক্রিপশন লাইব্রেরি ব্যবহার করুন।
৫. ব্যবহারিক দৃষ্টিকোণ
- Local Storage ব্যবহার করে আপনি ব্যবহারকারীর সেটিংস বা প্রেফারেন্স সংরক্ষণ করতে পারেন যা দীর্ঘমেয়াদী ব্যবহারের জন্য প্রয়োজনীয়।
- Session Storage ব্যবহার করা যেতে পারে যখন আপনি শুধুমাত্র একটি সেশনের মধ্যে ডেটা রাখতে চান, যেমন একটি ফর্মের ডেটা অথবা একটি ব্যবহারকারীর ইন্টারঅ্যাকশন।
সারাংশ
- Local Storage এবং Session Storage হল ক্লায়েন্ট-সাইড স্টোরেজ পদ্ধতি যা ডেটা ওয়েব ব্রাউজারে সংরক্ষণ করে।
- Local Storage দীর্ঘমেয়াদী ডেটা সংরক্ষণের জন্য এবং Session Storage একটি সেশন ভিত্তিক ডেটা সংরক্ষণের জন্য ব্যবহৃত হয়।
- Electron অ্যাপ্লিকেশনে এই স্টোরেজগুলি ব্যবহার করার মাধ্যমে আপনি ব্যবহারকারীর ডেটা সহজে সংরক্ষণ করতে পারেন, তবে নিরাপত্তা নিয়ে সতর্ক থাকা উচিত, বিশেষ করে সেস্নিভ তথ্য সংরক্ষণের ক্ষেত্রে।
Read more