آموزش حساب ها در Meteor

4 سال پیش

امتیاز دهید post

آموزش حساب ها در Meteor

در این درس از مجموعه آموزش برنامه نویسی سایت سورس باران، به آموزش حساب ها در Meteor خواهیم پرداخت.

این بسته قابلیت احراز هویت کامل کاربر را فراهم می کند. با اجرای کد زیر در پنجره خط فرمان می توانید آن را اضافه کنید.

C:\Users\username\Desktop\meteorApp&gt;meteor add accounts-password

1	C:\Users\username\Desktop\meteorApp>meteor add accounts-password

مثال احراز هویت

این مثال احراز هویت اولیه را نشان می دهد. ما الگوهای ثبت نام ، ورود به سیستم و خانه ایجاد خواهیم کرد. اگر یک کاربر فعلی وجود داشته باشد (اگر کاربر با موفقیت ثبت نام کرده یا وارد سیستم شده باشد) ، الگوی صفحه اصلی نشان داده می شود. اگر هیچ currentUser وجود نداشته باشد، الگوهای ثبت نام و ورود به سیستم قابل مشاهده است.

meteorApp.html

&lt;head&gt;
   &lt;title&gt;meteorApp&lt;/title&gt;
&lt;/head&gt;
 
&lt;body&gt;
   {{#if currentUser}}
      {{&gt; home}}
      {{else}}
      {{&gt; register}}
      {{&gt; login}}
   {{/if}}
&lt;/body&gt;

&lt;template name = "register"&gt;
   &lt;h2&gt;REGISTER:&lt;/h2&gt;
   &lt;form&gt;
      &lt;input type = "email" name = "registerEmail"&gt;&lt;br&gt;
      &lt;input type = "password" name = "registerPassword"&gt;&lt;br&gt;
      &lt;input type = "submit" value = "Register"&gt;&lt;br&gt;
   &lt;/form&gt;
&lt;/template&gt;

&lt;template name = "login"&gt;
   &lt;h2&gt;LOGIN:&lt;/h2&gt;
   &lt;form&gt;
      &lt;input type = "email" name = "loginEmail"&gt;&lt;br&gt;
      &lt;input type = "password" name="loginPassword"&gt;&lt;br&gt;
      &lt;input type = "submit" value = "Login"&gt;&lt;br&gt;
   &lt;/form&gt;
&lt;/template&gt;

&lt;template name = "home"&gt;
   &lt;p&gt;You're logged in.&lt;/p&gt;
   &lt;button class = "logout"&gt;Logout&lt;/button&gt;
&lt;/template&gt;

<head>

<title>meteorApp</title>

</head>

<body>

</body>

<h2>REGISTER:</h2>

<form>

</form>

</template>

<h2>LOGIN:</h2>

<form>

</form>

</template>

<p>You're logged in.</p>

<button class = "logout">Logout</button>

</template>

ابتدا باید یک رویداد ثبت نام کنیم. این عملکرد ورودی های ثبت شده را خوانده ، یک کاربر جدید ایجاد می کند و آن را در پایگاه داده ذخیره می کند.

رویداد دوم ورود به سیستم است. این بار این تابع ورودی های الگوی ورود را می خواند ، اگر ایمیل و رمز عبور معتبر هستند ، وارد سیستم شوید یا اگر اینگونه نیست خطایی را برمی گرداند.

و سرانجام پس از کلیک بر روی دکمه ، از رویداد خروج برای خروج از کاربر استفاده خواهد شد.

meteorApp.js

if (Meteor.isClient) {

   Template.register.events({
      'submit form': function(event) {
         event.preventDefault();

         var registerData = {
            email: event.target.registerEmail.value,
            password: event.target.registerPassword.value
         }

         Accounts.createUser(registerData, function(error) {
         
            if (Meteor.user()) {
               console.log(Meteor.userId());
            } else {
               console.log("ERROR: " + error.reason);
            }
         });
      }
   });

   Template.login.events({
   
      'submit form': function(event) {
         event.preventDefault();
         var myEmail = event.target.loginEmail.value;
         var myPassword = event.target.loginPassword.value;
            
         Meteor.loginWithPassword(myEmail, myPassword, function(error) {

            if (Meteor.user()) {
               console.log(Meteor.userId());
            } else {
               console.log("ERROR: " + error.reason);
            }
         });
      }
   });

   Template.home.events({

      'click .logout': function(event) {
         event.preventDefault();
            
         Meteor.logout(function(error) {

            if(error) {
               console.log("ERROR: " + error.reason);
            }
         });
      }
   });
}

if (Meteor.isClient) {

Template.register.events({

'submit form': function(event) {

event.preventDefault();

var registerData = {

email: event.target.registerEmail.value,

password: event.target.registerPassword.value

}

Accounts.createUser(registerData, function(error) {

if (Meteor.user()) {

console.log(Meteor.userId());

} else {

console.log("ERROR: " + error.reason);

}

});

}

});

Template.login.events({

'submit form': function(event) {

event.preventDefault();

var myEmail = event.target.loginEmail.value;

var myPassword = event.target.loginPassword.value;

Meteor.loginWithPassword(myEmail, myPassword, function(error) {

if (Meteor.user()) {

console.log(Meteor.userId());

} else {

console.log("ERROR: " + error.reason);

}

});

}

});

Template.home.events({

'click .logout': function(event) {

event.preventDefault();

Meteor.logout(function(error) {

if(error) {

console.log("ERROR: " + error.reason);

}

});

}

});

}

پس از شروع برنامه، صفحه زیر را دریافت خواهیم کرد.

Meteor Accounts Start

با وارد کردن ایمیل و رمز عبور در فرم ثبت نام ، می توانیم کاربر جدید را ثبت نام و وارد سیستم کنیم. خواهیم دید که این کنسول شناسه کاربران را ثبت می کند و الگوی خانه ارائه می شود.

Meteor Accounts Register

در صورت صحیح بودن ایمیل و گذرواژه ، رویداد ورود به سیستم پایگاه داده را بررسی کرده و وارد کاربر خواهد شد. در غیر این صورت ، کنسول خطایی را ثبت می کند.

Meteor Accounts Login Error

اگر کاربر روی دکمه LOGOUT کلیک کند ، برنامه کاربر را از سیستم خارج کرده و الگوهای ثبت نام و ورود را نشان می دهد.

منبع.

لیست جلسات قبل آموزش Meteor

امتیاز دهید post

برچسب ها : آموزش Meteor آموزش برنامه نویسی موبایل

نویسنده مطلب saber

آموزش حساب ها در Meteor

آموزش حساب ها در Meteor

مثال احراز هویت

meteorApp.html

لیست جلسات قبل آموزش Meteor

دیدگاه شما

بدون دیدگاه

آموزش حساب ها در Meteor

مثال احراز هویت

meteorApp.html

لیست جلسات قبل آموزش Meteor

دیدگاه شما

برای صرف‌نظر کردن از پاسخ‌گویی اینجا را کلیک نمایید.

بدون دیدگاه