Cara Membuat Encrypt Kata Sandi Menggunakan Md5 AngularJs

Encrypt proses membuat kata sandi atau password dengan cara mengacak data untuk menyembunyikan nilai atau data yang sebenernya dari beberapa orang yang tidak di perbolehkan melihat data tersebut dan bersifat rahasia. Dan kali ini saya akan bahas pada artikel kali ini tentang Cara Membuat Encrypt Kata Sandi Menggunakan Md5 AngularJs.

Langkah pertama Cara Membuat Encrypt Kata Sandi Menggunakan Md5 AngularJs saya akan membuat struktur html yang berisi input text seperti di bawah ini.

<!doctype html>

<html lang="en">

  <head>

    <!-- Required meta tags -->

    <meta charset="utf-8">

    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- Bootstrap CSS -->

    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous">

    <title>Cara Membuat Encrypt Kata Sandi Menggunakan Md5 AngularJs</title>

  </head>

               <body ng-app="myApp" ng-controller="myCtrl">

               <div class="container">

                              <div class="row">

                                             <div class="col-12 text-center">

                                                            <img src="http://www.gravatar.com/avatar/{{ katasandi | gravatar }}.jpg?d=identicon">

                                                            <br>

                                                            <input type="text" ng-model="katasandi" placeholder="Kata Sandi" class="form-control mt-2">

                                                            <br> {{ encrypt }}

                                             </div>

                              </div>

               </div>

               </body>

</html>

Setelah itu teman-teman jangan lupa cantumkan 2 link angularjs seperti di bawah ini.

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.7.6/angular.min.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-md5/0.1.10/angular-md5.js"></script>

Dan langkah terakhir kita akan membuat controller untuk membuat encrypt kata sandi dengan menggunakan md5.createHash pada angularjs.

<script>

  var app = angular.module('myApp', [

    'angular-md5', // dapat menggunakan juga 'ngMd5' atau 'gdi2290.md5'

  ]).controller('myCtrl', function($scope, md5) {

    $scope.$watch('katasandi', function(val) {

      $scope.encrypt = 'Encrypt Kata Sandi: ' + md5.createHash($scope.katasandi || '');

    });

  });

</script>

 

Jika teman-teman lihat tampilan awalnya ketika input kosong maka akan seperti gambar di bawah ini.

Dan ketika input sudah kita isi maka akan seperti gambar di bawah ini.

Dimana gambar dan encrypt kata sandi akan selalu berubah sesuai nilai di dalam tag input.

Demikian artikel tentang Cara Membuat Encrypt Kata Sandi Menggunakan Md5 AngularJs. Semoga dapat bermanfaat dan selamat mencoba.

 

28 Januari 2019

Webinar Gratis 2024


Selanjutnya Pada Bulan Maret 2024

Sabtu, 09 Maret 2024


10 Bahasa Rekomendasi Untuk Dipelajari di 2024

Python Developer, Data Science, Web Application

Kursus Python Django Web Application 2024 di DUMET School Kursus Postgre SQL Database Developer Terbaik 2024 di Jakarta
chat