Sarun UK
Sarun UK

Reputation: 6736

XSS issue in the angularjs application

This is regarding injecting the script tag (given below) in one of the input and it's description field. Values are saving fine and showing in the grid.

Go to this <script>window.alert('abc')</script> and fill out the FAFSA.

Form fields:-

enter image description here

You can see in the below screenshot that the alert script is running from the description field.

Modal implementation (execute on click of the document type link in the listing):-

  $rootScope.showNormalModal = function (message) {
        var modalHtml = "<div class='modal-header'><button type='button' ng-click='cancel()' class='close' data-dismiss='modal' aria-label='Close'>" +
            "<span aria-hidden='true'>×</span></button> " +
            "<h4 class='modal-title' id='myModalLabel'><div>" +
            "</div>" + message + "</h4></div>";

        var modalInstance = $modal.open({
            template: modalHtml,
            controller: function ($scope, $modalInstance) {
                $scope.cancel = function () {
                    $modalInstance.dismiss('cancel');
                };
            }
        });
    }
});

If the input parameter has script tag with some operation, it is not showing in the UI as it is, instead the script is running before the modal.

Expected behavior here is when I clicked on the anchor in the listing, it should show its description in the popup. what is happening here is, before showing the description, I am getting a alert window because of the script tag injection.

How will I avoid the alert script getting executed before the popup.

Attached all the screenshots below.

Listing Page :-

Listing Page

Alert Window :-

Alert Window

Description Popup :-

Description

Thanks in advance.

Upvotes: 0

Views: 1073

Answers (1)

Ashish
Ashish

Reputation: 1121

Can you please try below code

$rootScope.showNormalModal = function (message) {
  var modalHtml = "<div class='modal-header'><button type='button' ng-click='cancel()' class='close' data-dismiss='modal' aria-label='Close'>" +
    "<span aria-hidden='true'>×</span></button> " +
    "<h4 class='modal-title' id='myModalLabel'><div>" +
    "</div><div ng-bind=\"message\"></div></h4></div>";

  var modalInstance = $modal.open({
    template: modalHtml,
    controller: function ($scope, $modalInstance, message) {
      $scope.cancel = function () {
        $modalInstance.dismiss('cancel');
      };
      $scope.message = message;
    },
    resolve: {
      message: function () {
        return message;
      }
    }
  });
}

Upvotes: 1

Related Questions