angularjs 应用程序中的 XSS 问题

Question

这是关于在其中一个输入及其描述字段中注入脚本标签（如下所示）。值保存良好并显示在网格中。

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

表单域：-

您可以在下面的屏幕截图中看到描述字段中的警报脚本是运行。

模态实现（点击列表中的文档类型link执行）：-

  $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');
                };
            }
        });
    }
});

如果输入参数有脚本标签，有一些操作，它不会在UI中原样显示，而是脚本在模态之前运行。

这里的预期行为是当我单击列表中的锚点时，它应该在弹出窗口中显示其描述。这里发生的事情是，在显示描述之前，由于脚本标记注入，我收到了警报 window。

如何避免在弹出窗口之前执行警报脚本。

下面附上所有截图。

列表页：-

警报Window:-

弹出窗口说明：-

提前致谢。

Answer 1

你能试试下面的代码吗

$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;
      }
    }
  });
}

angularjs 应用程序中的 XSS 问题

XSS issue in the angularjs application

xss

angularjs