JavaScript এবং GWT এর মধ্যে Data আদান-প্রদান

GWT এবং JavaScript Integration (JSNI) - গুগল ওয়েব টুলকিট (Google Web Toolkit) - Web Development

252

গুগল ওয়েব টুলকিট (GWT) একটি শক্তিশালী ফ্রেমওয়ার্ক যা Java কোডকে JavaScript-এ রূপান্তরিত করে, এবং এর মাধ্যমে ডেভেলপাররা ব্রাউজার-ভিত্তিক অ্যাপ্লিকেশন তৈরি করতে পারেন। তবে, অনেক সময় JavaScript এবং GWT এর মধ্যে ডেটা আদান-প্রদান করতে হয়। এটি বিশেষভাবে প্রয়োজনীয় হতে পারে যখন আপনি GWT অ্যাপ্লিকেশন থেকে JavaScript কোডে কিছু ডেটা পাঠাতে চান অথবা JavaScript থেকে GWT কোডে ডেটা নিয়ে আসতে চান।

এখানে আমরা আলোচনা করব কিভাবে JavaScript এবং GWT এর মধ্যে ডেটা আদান-প্রদান করা যায়।


JavaScript এবং GWT এর মধ্যে ডেটা আদান-প্রদান কেন গুরুত্বপূর্ণ?

GWT-এ আপনার Java কোড JavaScript-এ রূপান্তরিত হয়, কিন্তু JavaScript-এর বিভিন্ন লাইব্রেরি এবং ফিচার ব্যবহার করার জন্য আপনাকে JavaScript কোডের সাথে যোগাযোগ করতে হতে পারে। উদাহরণস্বরূপ, JavaScript-এ কোনো ডোম (DOM) ম্যানিপুলেশন অথবা তৃতীয় পক্ষের লাইব্রেরি ব্যবহার করার প্রয়োজন হলে আপনি JavaScript কোডের সাথে ডেটা আদান-প্রদান করবেন।


JavaScript থেকে GWT-এ ডেটা পাঠানো

GWT-তে JavaScript থেকে ডেটা গ্রহণ করতে JSNI (JavaScript Native Interface) ব্যবহার করা হয়। এটি JavaScript কোডের সাথে সরাসরি ইন্টারঅ্যাক্ট করতে সাহায্য করে। নিচে একটি উদাহরণ দেওয়া হলো:

  1. JavaScript ফাংশন তৈরি করুন: প্রথমে, JavaScript ফাংশনটি তৈরি করুন যেটি GWT থেকে কল করা হবে।

    function sendDataToGWT(data) {
        alert("Data from GWT: " + data);
    }
    
  2. GWT থেকে JavaScript ফাংশন কল করা: এখন, GWT কোডে JSNI ব্যবহার করে JavaScript ফাংশনটি কল করুন।

    public class MyGWTApp {
        // JSNI মাধ্যমে JavaScript ফাংশন কল
        public static native void sendDataToJS(String data) /*-{
            $wnd.sendDataToGWT(data);
        }-*/;
    }
    

    এখানে, sendDataToJS ফাংশনটি JavaScript ফাংশন sendDataToGWT কে কল করছে এবং ডেটা পাঠাচ্ছে।


GWT থেকে JavaScript-এ ডেটা পাঠানো

এখন দেখব কিভাবে GWT থেকে JavaScript-এ ডেটা পাঠানো যায়। এই প্রক্রিয়াতে আপনি Window.alert() অথবা window অবজেক্টের অন্যান্য মেথড ব্যবহার করতে পারেন।

  1. GWT থেকে JavaScript ফাংশন কল করা: GWT কোড থেকে JavaScript ফাংশন কল করার জন্য আপনাকে JsInterop ব্যবহার করতে হবে। এটি GWT এবং JavaScript এর মধ্যে সোজা যোগাযোগ স্থাপন করতে সহায়তা করে।

    @JsFunction
    public static native void sendToJavaScript(String message) /*-{
        console.log(message);
    }-*/;
    

    এখানে, sendToJavaScript মেথডটি JavaScript-এ console.log ব্যবহার করে মেসেজ পাঠাচ্ছে।

  2. JavaScript থেকে GWT-এ ডেটা গ্রহণ: JavaScript থেকে GWT-এ ডেটা পাঠাতে JSNI ব্যবহার করা যেতে পারে, যেটি উপরের উদাহরণে দেখানো হয়েছে।

JavaScript এবং GWT-এর মধ্যে JSON ডেটা আদান-প্রদান

যেহেতু JSON (JavaScript Object Notation) একটি জনপ্রিয় ডেটা ফরম্যাট, তাই JavaScript এবং GWT এর মধ্যে JSON ডেটা আদান-প্রদান সাধারণভাবে ব্যবহৃত হয়। এটি অবজেক্টের মধ্যে ডেটা স্টোর করার একটি কার্যকর উপায়।

  1. JavaScript থেকে JSON পাঠানো:

    var data = {
        name: "John",
        age: 30
    };
    sendDataToGWT(JSON.stringify(data));
    
  2. GWT থেকে JSON গ্রহণ: GWT-তে JSON ডেটা গ্রহণ করতে GWT-এর JSONParser ব্যবহার করা হয়।

    public void receiveJsonData(String jsonData) {
        JSONObject jsonObject = JSONParser.parseStrict(jsonData).isObject();
        String name = jsonObject.get("name").isString().stringValue();
        int age = Integer.parseInt(jsonObject.get("age").isString().stringValue());
    }
    

    এখানে, JSONParser ব্যবহার করে JSON ডেটা পার্স করা হচ্ছে এবং তারপরে এর মান গ্রহণ করা হচ্ছে।


সারাংশ

GWT এবং JavaScript এর মধ্যে ডেটা আদান-প্রদান করার জন্য বিভিন্ন উপায় রয়েছে, যার মধ্যে JSNI, JsInterop, এবং JSON ডেটা ব্যবহার সবচেয়ে জনপ্রিয়। GWT-এ JavaScript কোডকে কল করে এবং JavaScript থেকে GWT-এ ডেটা পাঠানো সম্ভব। এই ধরণের ইন্টিগ্রেশন GWT অ্যাপ্লিকেশনকে আরো শক্তিশালী এবং আরও কার্যকরী করে তোলে।

Content added By
Promotion

Are you sure to start over?

Loading...