Redux-এ GET-request এর মাধ্যমে সার্ভার থেকে ডেটা প্রেরণ

সুতরাং আমাদের কাছে ডেটাবেসে ডেটা আছে। প্রথম যে কাজটি আমরা আমাদের Redux অ্যাপ্লিকেশন চালু করার সময় করব - তা হল সার্ভার থেকে পণ্যের ডেটা আহরণ করা। এর জন্য আমাদের প্রয়োজন আমাদের অ্যাপ্লিকেশন থেকে একটি GET-request পাঠানো। আসুন এটি সার্ভার সাইডে হ্যান্ডল করি।

আমাদের পণ্য সহ অ্যাপ্লিকেশনটি খুলুন, এবং এটির মধ্যে server.js ফাইলটি খুলুন। HTTP-request নিয়ে কাজ করার জন্য, আমাদের ফাইলে msw থেকে বেশ কয়েকটি টুল ইম্পোর্ট করতে হবে, আসুন এটি করি:

api/server.jsimport { http, HttpResponse, delay } from 'msw'

এছাড়াও অবিলম্বে বাস্তবতার জন্য সংশোধন করুন, অর্থাৎ নেটওয়ার্কে সম্ভাব্য বিলম্ব। ধরুন আমাদের কৃত্রিম বিলম্বের মান হবে 2 সেকেন্ড, যাতে আমরা দেখতে পাই কিভাবে ডেটা লোড হয়। এটিকে const PRODS_PER_SELLER = 2-এর পরে লিখুন:

api/server.jsconst ARTIFICIAL_DELAY_MS = 2000

এবং এখন ফাইলের শেষে worker এক্সপোর্ট করার আগে API-র জন্য একটি অ্যারে তৈরি করি request হ্যান্ডলার:

api/server.jsexport const handlers = []

এবং তারপর বর্গাকার বন্ধনীতে পণ্যের GET-request ইন্টারসেপ্ট করার জন্য প্রথম হ্যান্ডলারটি লিখব:

api/server.jsexport const handlers = [http.get()]

http.get-এর জন্য প্রথম প্যারামিটার হিসেবে আমরা পাস করব একটি নকল ঠিকানা, উদাহরণস্বরূপ '/fakeServer/products', এবং দ্বিতীয়টি একটি অ্যাসিঙ্ক্রোনাস callback:

api/server.jsexport const handlers = [http.get('/fakeServer/products', async () => {})]

এখন এই callback-এর জন্য কোড লিখি। এর সাহায্যে আমরা ডেটাবেস থেকে সমস্ত পণ্য বের করব। এখানে আমরা serializeProduct ফাংশনটিও ব্যবহার করব, যার কোড আমরা আগের পাঠে লিখেছিলাম। আসুন এটিকে map-এ পাস করি। তারপর একটি বিলম্ব তৈরি করি (যেন নেটওয়ার্ক ধীর) এবং response-এ JSON আকারে পণ্যের ডেটা সহ অবজেক্ট রিটার্ন করি:

api/server.jsexport const handlers = [
  http.get('/fakeServer/products', async () => {
    const products = db.product.getAll().map(serializeProduct)
    await delay(ARTIFICIAL_DELAY_MS)
    return HttpResponse.json(products)
  }),
]

এবং শেষ জিনিস। আমরা আমাদের worker-এর জন্য প্রথম handler লিখেছি, আসুন এই worker-কে handlers অ্যারেটি পাস করি। এর জন্য ফাইলের শেষ লাইনটি পরিবর্তন করুন:

api/server.jsexport const worker = setupWorker(...handlers)