Checking Login Functionality

import React from 'react';
import './login.scss';
import {Redirect} from 'react-router-dom';

import tool from '../tool.js';
import utility from '../header/headerjs';

class Login extends React.Component{
  constructor(props){
    super(props);
    this.state = {
      message: '',
      email: '',
      password: '',
      siteTitle: 'Dashboard',
      redirect: false
    };
    this.checkLogin();
  }

  checkLogin = async () => {
    const result = await tool.checkLogin();
    if(result){
      clearTimeout(utility.t);
      this.setState({
        redirect: '/admin'
      })
    }
  }

  onChangeHandler = (event) => {
    let nam = event.target.name;
    let val = event.target.value;
    this.setState({[nam]: val});
  }

  onSubmitHandler = async (event) => {
    event.preventDefault();
    const option = {
      email: this.state.email,
      password: this.state.password
    }
    const result = await tool.fetchPostAPI('/admin/login', option);
    if(result.success){
      clearTimeout(utility.t);
      this.setState({
        message: result.message,
        siteTitle: result.siteTitle,
        redirect: '/admin'
      });
    }else{
      this.setState({
        message: result.message
      });
    }
  }

  render(){
    if(this.state.redirect) {
      return 
    }
    return(
      
Email: Password:
{this.state.message}
); } } export default Login;
class Tool {

  async fetchAPI(uri){
    try{
      let res = await fetch(uri);
      return await res.json();
    }catch(error){
      console.log(error);
    }
  }

  async fetchPostAPI(uri, data){
    const option = {
      method: "POST", 
      body: JSON.stringify(data),
      headers: {'Content-type': 'application/json; charset=UTF-8'}
    }

    try{
      let res = await fetch(uri, option);
      return await res.json();
    }catch(error){
      console.log(error);
    }
  }

  async checkLogin(){
    const result = await tool.fetchAPI('/admin/logged');
    return result.logged;
  }
  
}// class ending 

const tool = new Tool();

export default tool;
// routes/admin.js
var express = require('express');
var router = express.Router();

router.post('/login', function(req, res, next){
  const login = require('../controllers/login');
  login.postLogin(req, res);
});

router.get('/logged', function(req, res, next){
  const login = require('../controllers/login');
  login.checkLogin(req, res);
});

module.exports = router;
// controllers/login.js
class Login{
  constructor(){
    this.deepcopy = require('deepcopy');
    this.vdict = require('../config');
    this.usersdb = require('../models/usersdb');
    this.bcrypt = require('bcryptjs');
  }

  postLogin(req, res){
    const self = this;
    const data = this.deepcopy(this.vdict);
    delete data.databaseAccess;

    this.usersdb.checkUser(req, function(user){
      if(user){
        if(self.bcrypt.compareSync(req.body.password, user.password)){
          req.session.user = user;
          data.success = true;
          res.json(data);
        }else{
          data.message = 'The password is wrong.';
          data.success = false;
          res.json(data);
        }
      }else{
        data.message = 'The email is wrong.';
        data.success = false;
        res.json(data);
      }
    });
  }

  checkLogin(req, res){
    const data = this.deepcopy(this.vdict);
    delete data.databaseAccess;
    if(req.session.user){
      res.json({logged: true});
    }else{
      res.json({logged: false});
    }
  }

}//end class

module.exports = new Login();

GitHub: "https://github.com/Sokhavuth/emultimedia
Heroku: https://khmerweb-emultimedia.herokuapp.com/

Comments

Popular posts from this blog