ElementRef安全风险角2

Question

为什么ElementRef是不安全的使用，如果是，我们可以使用什么呢？

我一直在使用这个ElementRef来查看或查看特定的html标记，然后在初始化之后作为特定的宽度发送，但是如果这打开了安全风险，我将不会使用它，老实说，我不明白为什么Range2团队允许他们的框架中存在这种安全漏洞。

什么是安全和最好的技术使用？下面是我的测试组件：

        import { Component, OnInit } from '@angular/core';

        @Component({
          selector: 'app-standard',
          template: ` <button type="button" #buttonW></button>`,

        })
        export class standardComponent implements OnInit {

          name: string = 'app-standard';
          viewWidthButton: any;

          @ViewChild( 'buttonW' ) elButtonW: ElementRef; 


          constructor() { 

            this.viewWidthButton = this.elButtonW.nativeElement.offsetWidth;
            console.log ('button width: ' + this.viewWidthButton);
          }

          ngOnInit() {
          }

        }

角2页参考资料：

https://angular.io/docs/ts/latest/api/core/index/ElementRef-class.html

Answer 1

使用ElementRef并不会直接降低站点的安全性。天使队只是在说“嘿，你可以用这个，小心点”。

如果您只使用ElementRef来获取信息，比如在您的示例中有一定的宽度，则根本不涉及安全风险。当您使用ElementRef修改DOM时，情况就不同了。在那里，可能会出现潜在的威胁。这样的例子可以是：

@ViewChild('myIdentifier')
myIdentifier: ElementRef

ngAfterViewInit() {
  this.myIdentifier.nativeElement.onclick = someFunctionDefinedBySomeUser;
}

这方面的问题是，它直接插入到DOM中，跳过角消毒机制。什么是消毒机制？通常情况下，如果DOM中的某物是通过角度变化的，则角可以确保它没有危险。但是，当使用ElementRef向DOM中插入某些内容时，角不能保证这一点。因此，在使用ElementRef时，没有任何不好的东西进入DOM就成了您的责任。这里的一个重要关键字是XSS (跨站点脚本)。

总结一下:如果您在DOM中轮询信息，那么您是安全的。如果使用ElementRef修改DOM，请确保这些修改不可能包含恶意代码。