index.html

<script src="./js/jquery.min.js"></script>
<script type="text/javascript" src="./js/angular.min.js"></script>
<link href="./css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css" />
<script src="./js/bootstrap.min.js"></script>
<link href="index.css" rel="stylesheet" id="inline-css" />
<!------ Include the above in your HEAD tag ---------->

<div class="sidenav">
  <div class="login-main-text">
    <h2>
      Damn Vulnerable Web Services<br />
      Login Page
    </h2>
    <p>Login or register for Access</p>
  </div>
</div>
<div class="main">
  <div class="col-md-6 col-sm-12">
    <div class="login-form">
      <div ng-app="app" ng-controller="MyController">
        <p>
          Username:
          <input
            type="text"
            class="form-control"
            name="UserName"
            ng-model="username"
            required
          />
        </p>
        <p>
          Password:
          <input
            type="text"
            class="form-control"
            name="Password"
            ng-model="password"
            required
          />
        </p>
        <button class="btn btn-black" ng-click="SendData()">Login</button>
        <button class="btn btn-secondary" ng-click="SendData2()">
          Register
        </button>
        <hr />
        <div ng-bind-html="DataResponse"></div>
      </div>
    </div>
  </div>
</div>

<script type="text/javascript">
  var app = angular.module("app", []).config(function ($sceProvider) {
    $sceProvider.enabled(false);
  });
  app.controller("MyController", function ($scope, $http, $window) {
    $scope.SendData = function () {
      var post = $http({
        method: "POST",
        url: "/api/v2/login",
        dataType: "json",
        data:
          "username=" + $scope.username + "&" + "password=" + $scope.password,
        headers: { "Content-Type": "application/x-www-form-urlencoded" },
      });

      post.success(function (data, status) {
        if (data.status == 200) {
          $window.localStorage.setItem("JWTSessionID", data.token);
          window.location = "home.html#" + data.result.username;
          $scope.DataResponse = data.result.username;
        }
      });

      post.error(function (data, status) {
        $scope.DataResponse = data.error;
      });
    };

    $scope.SendData2 = function () {
      var post = $http({
        method: "POST",
        url: "/api/v2/users",
        dataType: "json",
        data:
          "username=" + $scope.username + "&" + "password=" + $scope.password,
        headers: { "Content-Type": "application/x-www-form-urlencoded" },
      });

      post.success(function (data, status) {
        if (data.status == 201) {
          $scope.DataResponse = data.user + " created successfully!";
        } else if (data.status == 409) {
          $scope.DataResponse = data;
        }
      });

      post.error(function (data, status) {
        $scope.DataResponse = data;
      });
    };
  });
</script>