Route এর মধ্যে Redirects এবং Abort ট্রানজিশন

Ember.js Routes এর মধ্যে Transitions - এমবারজেএস (EmberJS) - Web Development

318

Ember.js একটি শক্তিশালী router সিস্টেম সরবরাহ করে, যা URL রাউটিং এবং অ্যাপ্লিকেশনের ট্রানজিশন হ্যান্ডল করতে ব্যবহৃত হয়। মাঝে মাঝে, আপনি রাউট ট্রানজিশন নিয়ন্ত্রণ করতে চাইবেন, যেমন এক রাউট থেকে অন্য রাউটে রিডিরেক্ট করা বা ট্রানজিশন অ্যাবোর্ট (বাতিল) করা। Redirects এবং Aborting Transitions এর মাধ্যমে আপনি রাউট ট্রানজিশন কাস্টমাইজ এবং নিয়ন্ত্রণ করতে পারবেন।

এই লেখায় Redirects এবং Abort ট্রানজিশন হ্যান্ডলিং নিয়ে বিস্তারিত আলোচনা করা হবে।


1. Redirects

Redirects একটি প্রক্রিয়া যা রাউট ট্রানজিশন সম্পূর্ণ হওয়ার আগে, ব্যবহৃত রাউটকে অন্য রাউটে পুনঃনির্দেশ (redirect) করতে সহায়ক। Ember.js এর redirect হ্যান্ডলার এটি সুনির্দিষ্টভাবে পরিচালনা করে।

Redirects কিভাবে কাজ করে:

  • redirect সাধারণত beforeModel(), model(), বা afterModel() হুকগুলিতে ব্যবহৃত হয়, যা রাউট লোড হওয়ার আগে বা পরে ট্রানজিশন পরিবর্তন করতে সক্ষম।
  • এটি বিশেষভাবে তখন ব্যবহৃত হয় যখন আপনি কিছু শর্ত পূর্ণ হলে ইউজারকে অন্য রাউটে পুনঃনির্দেশ করতে চান (যেমন, অথেন্টিকেশন চেক বা অ্যাক্সেস কন্ট্রোল)।

Redirects উদাহরণ

এখানে একটি রাউটে রিডিরেক্ট করার উদাহরণ:

// app/routes/dashboard.js
import Route from '@ember/routing/route';

export default class DashboardRoute extends Route {
  beforeModel(transition) {
    // যদি ইউজার লগইন না করে থাকে, তাকে লগইন পেজে রিডিরেক্ট করা হবে
    if (!this.session.isAuthenticated) {
      this.transitionTo('login');
    }
  }
}

এখানে, beforeModel() হুকটি ব্যবহার করা হয়েছে, যা রাউটটি লোড হওয়ার আগে ইউজারের লগইন স্টেট পরীক্ষা করে। যদি ইউজার অথেন্টিকেটেড না থাকে, তাকে login রাউটে রিডিরেক্ট করা হবে।

Note: transitionTo() মেথডটি ব্যবহৃত হয় রাউট পরিবর্তন বা রিডিরেক্ট করার জন্য। আপনি এখানে যে রাউটটি রিডিরেক্ট করতে চান সেটি নির্দিষ্ট করেন।

২. Redirects with Model

রাউটের মডেল ডেটার উপর ভিত্তি করে রিডিরেক্ট করাও সম্ভব:

// app/routes/post.js
import Route from '@ember/routing/route';

export default class PostRoute extends Route {
  async model(params) {
    const post = await this.store.findRecord('post', params.post_id);
    if (!post.isPublished) {
      this.transitionTo('not-found');  // যদি পোস্ট প্রকাশিত না হয়, তাহলে "not-found" রাউটে রিডিরেক্ট করা হবে
    }
    return post;
  }
}

এখানে, model() মেথডে প্রথমে পোস্টের তথ্য ফেচ করা হয় এবং পোস্টের স্টেট চেক করা হয়। যদি পোস্টটি প্রকাশিত না থাকে, তবে ইউজারকে not-found রাউটে রিডিরেক্ট করা হয়।


2. Abort Transitions

এখন, ধরুন আপনি কোনো রাউটে পৌঁছানোর আগে ট্রানজিশন বাতিল করতে চান। Abort transitions এমন একটি পরিস্থিতি যেখানে আপনি রাউট পরিবর্তন বন্ধ বা বাতিল করতে চান, যেমন কোনো শর্ত না পূর্ণ হলে বা ইউজার ইন্টারঅ্যাকশনের কারণে।

Ember.jsabort() মেথড ব্যবহার করে ট্রানজিশন বাতিল করা যায়।

Abort Transitions উদাহরণ

ধরা যাক, ইউজার একটি ফর্ম পূর্ণ করার সময় রাউট পরিবর্তন করতে চাচ্ছে, কিন্তু ফর্মের ডেটা সেভ করা হয়নি। তাহলে, আপনি ট্রানজিশন বন্ধ (abort) করতে পারেন।

// app/routes/form.js
import Route from '@ember/routing/route';

export default class FormRoute extends Route {
  beforeModel(transition) {
    // যদি ফর্ম সেভ না হয়, তাহলে রাউট পরিবর্তন বন্ধ (abort) করা হবে
    if (!this.model.isSaved) {
      // ইউজারকে সতর্ক করা হবে এবং ট্রানজিশন বাতিল করা হবে
      if (!confirm('Your form is not saved. Are you sure you want to leave?')) {
        transition.abort(); // ট্রানজিশন বাতিল
      }
    }
  }
}

এখানে, beforeModel() হুকটি ব্যবহার করে ট্রানজিশন পরীক্ষা করা হয়। যদি ইউজার ফর্ম সেভ না করে থাকে এবং তিনি রাউট পরিবর্তন করার চেষ্টা করেন, তখন transition.abort() মেথডটি ব্যবহার করে ট্রানজিশন বন্ধ করা হয়।

Abort Transitions with Model

রাউটের model() মেথডে যদি কোনো শর্ত পূর্ণ না হয়, তবে ট্রানজিশন বাতিল করা যেতে পারে:

// app/routes/user.js
import Route from '@ember/routing/route';

export default class UserRoute extends Route {
  async model(params, transition) {
    const user = await this.store.findRecord('user', params.user_id);
    if (!user.isActive) {
      // যদি ব্যবহারকারী সক্রিয় না থাকে, ট্রানজিশন বাতিল করা হবে
      alert('This user is not active!');
      transition.abort();  // ট্রানজিশন বাতিল
    }
    return user;
  }
}

এখানে, model() মেথডে ইউজার স্টেট পরীক্ষা করা হচ্ছে। যদি ইউজার অ্যাক্টিভ না থাকে, তখন ট্রানজিশন abort() করে বাতিল করা হয়।


Ember.js এ Redirects এবং Abort Transitions এর সুবিধা

  1. নেভিগেশন নিয়ন্ত্রণ: Redirects ব্যবহার করে আপনি অ্যাপ্লিকেশনের এক রাউট থেকে অন্য রাউটে সঠিকভাবে নেভিগেট করতে পারেন, এবং প্রয়োজনে ইউজারকে অন্য পৃষ্ঠায় রিডিরেক্ট করতে পারেন।
  2. শর্তাধীন ট্রানজিশন: Abort transitions ব্যবহার করে আপনি নির্দিষ্ট শর্তের ভিত্তিতে ইউজারকে একটি রাউট পরিবর্তন করার থেকে বাধা দিতে পারেন।
  3. UX উন্নতি: ট্রানজিশনগুলি abort করে বা redirect করে ইউজারের অভিজ্ঞতা আরও মসৃণ এবং নিরাপদ করা যায়, যেমন ফর্ম ডেটা না সেভ করলে রাউট পরিবর্তন বন্ধ করা।

Ember.js-এ Redirects এবং Abort Transitions দুটি গুরুত্বপূর্ণ বৈশিষ্ট্য, যা অ্যাপ্লিকেশনের নেভিগেশন এবং ইউজারের অভিজ্ঞতাকে আরও নিয়ন্ত্রণযোগ্য এবং নিরাপদ করে তোলে। Redirects ব্যবহার করে আপনি শর্তের ভিত্তিতে ইউজারকে একটি রাউট থেকে অন্য রাউটে পাঠাতে পারেন, আর Abort transitions ব্যবহার করে আপনি ট্রানজিশন বাতিল করে শর্ত পূর্ণ না হলে রাউট পরিবর্তন বন্ধ করতে পারেন।

Content added By
Promotion

Are you sure to start over?

Loading...