# ওয়েব মেসেজ ইনবক্স সেট আপ করুন

#### পূর্বশর্ত

নিশ্চিত করুন যে আপনি আপনার ওয়েবসাইটে Pushwoosh Web SDK প্রয়োগ করেছেন। এটি করতে, অনুগ্রহ করে আমাদের [গাইড](/bn/developer/pushwoosh-sdk/web-push-notifications/web-push-sdk-30/) অনুসরণ করুন।


**ওয়েবসাইটের জন্য মেসেজ ইনবক্স** আপনাকে ওয়েব পুশ নোটিফিকেশন সংরক্ষণ করার অনুমতি দেয় যাতে ব্যবহারকারীরা পরে সেগুলি আবার দেখতে পারে, এটি নিশ্চিত করে যে গুরুত্বপূর্ণ বার্তাগুলি দেখা হয়েছে।

## এটি কিভাবে কাজ করে

এখানে InboxMessages-এর একটি সাধারণ কর্মপ্রবাহ দেওয়া হলো:

| ধাপ                                                                 | মেথড                                                                                                                                      |
| -------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------- |
| পেজ লোড                                                            |                                                                                                                                             |
| সার্ভারের সাথে মেসেজ সিঙ্ক্রোনাইজ করা                               | <p><code>InboxMessagesModel.updateMessages</code><br/>SDK ইনিশিয়ালাইজ করার সময় সম্পাদিত হয়</p>                                              |
| পুরানো মেসেজ মুছে ফেলা                                           | <p><code>InboxMessagesModel.updateMessages</code><br/>SDK ইনিশিয়ালাইজ করার সময় সম্পাদিত হয়</p>                                              |
| একটি ব্যাজ আপডেট করার জন্য অপঠিত মেসেজের সংখ্যা গ্রহণ করা            | <p><code>Pushwoosh.pwinbox.unreadMessagesCount</code><br/>ম্যানুয়ালি সম্পাদিত হয় (<code>onUpdateInboxMessages</code>ইভেন্ট ট্রিগার হওয়ার পরে)</p> |
| ইনবক্সে প্রদর্শনের জন্য মেসেজ লোড করা                            | <p><code>Pushwoosh.pwinbox.loadMessages</code><br/>ম্যানুয়ালি সম্পাদিত হয় (<code>onUpdateInboxMessages</code>ইভেন্ট ট্রিগার হওয়ার পরে)</p>        |
| ভিউ-পোর্টে আসা মেসেজগুলিকে পঠিত হিসাবে চিহ্নিত করা                         | <p><code>Pushwoosh.pwinbox.readMessagesWithCodes</code><br/>ম্যানুয়ালি সম্পাদিত হয়</p>                                                            |
| খোলা মেসেজের জন্য নির্ধারিত একটি অ্যাকশন সম্পাদন করা                  | <p><code>Pushwoosh.pwinbox.performActionForMessageWithCode</code><br/>ম্যানুয়ালি সম্পাদিত হয়</p>                                                  |
| একটি ডিলিট আইকনে ক্লিক করে বা একটি মেসেজ ডানদিকে সোয়াইপ করে মেসেজ মুছে ফেলা | <p><code>Pushwoosh.pwinbox.performActionForMessageWithCode</code><br/>ম্যানুয়ালি সম্পাদিত হয়</p>                                                  |

## ইভেন্ট লিসেনার

```javascript title="onUpdateInboxMessages"
// Executed after the Inbox is updated automatically while the page is loading. 
Pushwoosh.push(['onUpdateInboxMessages', function(api, pwinbox) {
  pwinbox.loadMessages().then(function(messages) {
    console.log('EVENT: onUpdateInboxMessages', messages);
  });
}]);
```

```javascript title="onPutNewMessageToInboxStore"
// Executed by ServiceWorker after the Inbox Message is received and saved to indexedDB. 
Pushwoosh.push(['onPutNewMessageToInboxStore', function(api, message) {
  console.log('EVENT: onPutNewMessageToInboxStore', message);
}]);
```

## পাবলিক মডিউল

**WebSDK InboxMessagesPublic module** ওয়েব ইনবক্স প্রয়োগ করার জন্য একটি পাবলিক ইন্টারফেস উপস্থাপন করে।

```txt title="Model"
type TInboxMessageTypePlain = 0;
type TInboxMessageTypeRichmedia = 1;
type TInboxMessageTypeURL = 2;
type TInboxMessageTypeDeeplink = 3;
type TInboxMessageType = TInboxMessageTypePlain  // depends on action_params
  | TInboxMessageTypeRichmedia
  | TInboxMessageTypeURL
  | TInboxMessageTypeDeeplink;

type TInboxLayout = 'classic' | 'banner' | 'captioned' | 'carousel';

interface IInboxMessageSlide {
  imageUrl: string;
  caption: string;  // caption overlaid on the slide; empty when the slide has none
  link: string;  // where a tap on the slide goes; empty when the slide has none, and the message's own action applies instead
}

interface IInboxMessagePublic {
  code: string;  // inbox_id
  title: string;  // title
  message: string; // body
  imageUrl: string;  // image
  sendDate: string;  // send_date, ISO 8601 in UTC
  type: TInboxMessageType;  // depends on action_params
  isRead: boolean;  // true if status is "read" or "open"
  link: string; // Deeplink | URL | "/"
  isActionPerformed: boolean;  // true if status is "open"
  layout: TInboxLayout;  // cell layout to draw, already degraded to one this message can render
  iconUrl: string;  // small round avatar; same value as imageUrl, under the name the layouts use
  heroUrl: string;  // hero image; falls back to iconUrl when the message has no banner, so it's set for classic messages too
  carousel: Array<IInboxMessageSlide>;  // slides of the carousel layout; empty for every other layout
  customData: Record<string, unknown>;  // the campaign's own custom data, as sent from the control panel
}
```

<Aside type="caution" title="sendDate এখন একটি আসল UTC মুহূর্ত (v3.75.0+)">
  `sendDate` আগে `Z` লেবেলযুক্ত স্থানীয় ওয়াল-ক্লক সময় বহন করত। যে কোডটি একটি টাইমজোন অফসেট প্রয়োগ করে পুরানো মানের জন্য ক্ষতিপূরণ দিত, তা এখন সেই একই অফসেটের কারণে ভুল হবে — ক্ষতিপূরণটি বাদ দিন। বিল্ট-ইন উইজেট এতে প্রভাবিত হয় না।
</Aside>

**সেল লেআউট।** একটি মেসেজ চারটি লেআউটের মধ্যে একটি হিসাবে রেন্ডার হয় — `classic`, `banner`, `captioned`, বা `carousel` — কন্ট্রোল প্যানেলে ক্যাম্পেইন প্রিভিউতে দেখানো একই লেআউট। একটি লেআউট যা মেসেজের বিষয়বস্তু দিয়ে রেন্ডার করতে পারে না তা `classic`-এ অবনমিত হয়: `banner`-এর জন্য একটি হিরো ইমেজ প্রয়োজন, `captioned`-এর জন্য একটি হিরো ইমেজ এবং একটি টাইটেল ও বডি উভয়ই প্রয়োজন, এবং `carousel`-এর জন্য কমপক্ষে একটি স্লাইড এবং একটি টাইটেল ও বডি উভয়ই প্রয়োজন। পাবলিক মেসেজে `layout` সর্বদা সেই লেআউটটি হয় যা আসলে আঁকা হয়েছে, যা ইতিমধ্যেই অবনমিত।

`layout` পরীক্ষা করাই একটি মেসেজ কী রেন্ডার করবে তা জানার একমাত্র নির্ভরযোগ্য উপায় — `heroUrl` `classic` মেসেজের জন্যও সেট করা থাকে (উপরের ফিল্ড নোট দেখুন), তাই একটি ইন্টিগ্রেশনকে হিরো আঁকতে হবে কিনা তা নির্ধারণ করার জন্য এর উপস্থিতি ব্যবহার করা উচিত নয়।

## পাবলিক মেথড

[Web Push SDK 3.0](/bn/developer/pushwoosh-sdk/web-push-notifications/web-push-sdk-30/) গাইডে পাবলিক মেথডগুলির বিবরণ দেখুন।

`Pushwoosh.pwinbox.syncMessages()` সার্ভার থেকে বর্তমান ইনবক্স নিয়ে আসে; বিল্ট-ইন উইজেটের নিজস্ব পোলিংয়ের বাইরে একটি রিফ্রেশ জোর করে করতে এটি কল করুন।