javascript - Angular - 如何防止 RxJs fromEvent 中的 XSS 攻击?

标签 javascript angular security rxjs xss

我经常使用 RxJS 的 fromEvent 方法。老实说,我期待 Angular 能带来一些魔力,但显然没有。如何在使用 fromEvent 时防止 XSS 攻击?

代码示例:

<input #myInput />

fromEvent(this.muInput.nativeElement, 'input').pipe(
  tap(inputEvent => this.saveToDatabase(inputEvent.data)
)

最佳答案

对于你的问题,使用 fromEvent 你会得到与 react 形式的 valueChanges 相同的输出,就安全措施而言,它几乎相同。

<input formcontrol="myInput"/>
myInput.valueChanges.subscribe(console.log) 

对比

<input #myInput />
fromEvent(this.muInput.nativeElement, 'input').subscribe(console.log)

如果你在你的 View 中将它们包装在表达式大括号中,Angular 将清理输出

{{ .. }} 

但它不会清理表单输入,所以这仍然是一个有效的表单输入,清理仍然需要在服务器端进行。

<script>alert('kdfkf')</script>

我不建议使用 fromEvent 来处理更改,因为在大多数情况下,如果该元素通过 *ngIf 从 DOM 中删除,您只绑定(bind)一次到某个元素(假设在 ngOnInit 中) ,除非您有代码来处理重新绑定(bind),否则您的事件已经消失。

这个答案也可能有帮助 Need to insert Script tag in angular 2

还有这个 https://angular.io/guide/security

关于javascript - Angular - 如何防止 RxJs fromEvent 中的 XSS 攻击?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58593382/

相关文章:

javascript - Angular 2 : provide current route to parent component

google-chrome - 由于 HSTS,本地虚拟主机在 Chrome 上显示隐私错误

javascript - Owl Carousel 破坏了 Bootstraps 模态

angular - 类型 'nome' 上不存在属性 'FormGroup'

javascript - 无法读取未定义的属性 'status' - 函数实际运行之前出错?

sql-server - 基于SQL的加密性能

security - 为什么我不应该在 OAuth 2.0 的移动应用程序中保留 client_secret (授权代码授予流程)

javascript - 如何对 angularjs 表单进行单元测试?

javascript - Vuetify.js:<v-text-field> 圆 Angular

JavaScript 范围和为 foreach 索引选择名称