উপলব্ধ কীওয়ার্ড: ডকটাইপ:ব্লগ, বিভাগ:বেসলাইন2025, ভাষা:জাভাস্ক্রিপ্ট
প্রকাশিত: জুন 18, 2025
আপনি যদি জাভাস্ক্রিপ্ট মডিউলে একটি JSON ফাইল ইম্পোর্ট করতে চান, তাহলে আপনাকে আগে জাভাস্ক্রিপ্টে JSON এম্বেড করার মতো হুপসের মধ্য দিয়ে যেতে হয়েছিল যাতে আপনি একটি নিয়মিত import বিবৃতি ব্যবহার করতে পারেন, অথবা fetch() দিয়ে একটি ফাইল ডাউনলোড করতে পারেন এবং তারপরে Response.json() কল করতে পারেন। এটি একটি সমস্যা যা এখন JSON মডিউল স্ক্রিপ্ট এবং আমদানি বৈশিষ্ট্যগুলির জন্য সমস্ত আধুনিক ব্রাউজারে সমাধান করা হয়েছে৷
নিম্নলিখিত নমুনা দেখায় কিভাবে একটি JSON মডিউল স্ক্রিপ্ট একটি JavaScript মডিউল স্ক্রিপ্টের ভিতর থেকে আমদানি করা যেতে পারে:
import astronomyPictureOfTheDay from "./apod.json" with { type: "json" };
const {explanation, title, url} = astronomyPictureOfTheDay;
document.querySelector('h2').textContent = title;
document.querySelector('figcaption').textContent = explanation;
Object.assign(document.querySelector('img'), { src: url, alt: title });
কোন JSON.parse() প্রয়োজন নেই, JSON পার্স করা হয়েছে এবং import ঠিক পরে যেতে প্রস্তুত। এটি কাজ করে কারণ ব্রাউজার আগে থেকেই জানে যে এটি JSON এর সাথে কাজ করছে, যা আপনি with { type: "json" } আমদানি বৈশিষ্ট্যের সাথে ঘোষণা করেন।
JSON মডিউল আমদানির এই লাইভ ডেমোটি দেখুন যা পূর্ববর্তী তালিকা থেকে কোড ব্যবহার করে।
মডিউল স্ক্রিপ্টের জন্য MIME প্রকার পরীক্ষা করা কঠোর। JSON মডিউল স্ক্রিপ্টটি সফল করার জন্য, HTTP প্রতিক্রিয়ার অবশ্যই একটি JSON MIME প্রকার থাকতে হবে, উদাহরণস্বরূপ Content-Type: text/json ।
যদি বিবৃতির with { type: "json" } অংশটি বাদ দেওয়া হয়, তাহলে ব্রাউজারটি অনুমান করে যে উদ্দেশ্যটি একটি JavaScript মডিউল স্ক্রিপ্ট আমদানি করা, এবং যদি HTTP প্রতিক্রিয়ার একটি MIME প্রকার থাকে যা জাভাস্ক্রিপ্ট MIME প্রকার নয়।
আপনি HTML স্পেসিকে JSON মডিউল স্ক্রিপ্ট প্রক্রিয়াকরণ সম্পর্কে আরও পড়তে পারেন।