সিকিউরিটির কারণে ব্রাউজার ইনপুটের মাধ্যমে সিলেক্ট করা ইমেজ ফাইলের পাথ এক্সেস করার অনুমতি দেয় না, অর্থাৎ ব্রাউজারের জাভাস্ক্রিপ্টের ফাইল সিস্টেমে এক্সেস নেই। তাই আমাদের কাজ হলো ইনপুটের মাধ্যমে সিলেক্ট করা ইমেজ ফাইলটি সার্ভারে পাঠানোর আগে প্রিভিউ করা।
পদ্ধতি ১: URL ক্লাস ব্যবহার করে:
URL ক্লাসের createObjectURL() ফাংশন ব্যবহার করে ইনপুট দিয়ে সিলেক্ট করা ইমেজের একটি URL তৈরি করা যায় এবং সেটি img ট্যাগের src অ্যাট্রিবিউটে দিয়ে প্রিভিউ দেখানো যায়।
উদাহরণ
কোডটি নিচে দেওয়া হলো —
পদ্ধতি ২: FileReader ক্লাস ব্যবহার করে:
এই পদ্ধতিতে দিয়ে নেওয়া ফাইলটি পার্স করে একটি বেস৬৪ (base64) রিপ্রেজেন্টেশন স্ট্রিং তৈরি করা হয়।
উদাহরণ
কোডটি নিচে দেওয়া হলো —
আউটপুট
দুই পদ্ধতিই নিচের মতো আউটপুট দেবে —
