docs(security): hide TOC for Dart; other minor copyedits (#3017)
This commit is contained in:
parent
a74f8fb3b1
commit
0dfd37e5a9
@ -1,20 +1,17 @@
|
|||||||
<!--#docregion -->
|
<!--#docregion -->
|
||||||
<h3>Bypass Security Component</h3>
|
<h3>Bypass Security Component</h3>
|
||||||
|
|
||||||
<!--#docregion dangerous-url -->
|
<!--#docregion URL -->
|
||||||
<h4>An untrusted URL:</h4>
|
<h4>An untrusted URL:</h4>
|
||||||
<p><a class="e2e-dangerous-url" [href]="dangerousUrl">Click me</a></p>
|
<p><a class="e2e-dangerous-url" [href]="dangerousUrl">Click me</a></p>
|
||||||
<h4>A trusted URL:</h4>
|
<h4>A trusted URL:</h4>
|
||||||
<p><a class="e2e-trusted-url" [href]="trustedUrl">Click me</a></p>
|
<p><a class="e2e-trusted-url" [href]="trustedUrl">Click me</a></p>
|
||||||
<!--#enddocregion dangerous-url -->
|
<!--#enddocregion URL -->
|
||||||
|
|
||||||
<!--#docregion iframe-videoid -->
|
<!--#docregion iframe -->
|
||||||
<h4>Resource URL:</h4>
|
<h4>Resource URL:</h4>
|
||||||
<p><label>Showing: <input (input)="updateVideoUrl($event.target.value)"></label></p>
|
<p><label>Showing: <input (input)="updateVideoUrl($event.target.value)"></label></p>
|
||||||
<p>Trusted:</p>
|
<p>Trusted:</p>
|
||||||
<iframe class="e2e-iframe-trusted-src" width="640" height="390" [src]="videoUrl"></iframe>
|
<iframe class="e2e-iframe-trusted-src" width="640" height="390" [src]="videoUrl"></iframe>
|
||||||
<p>Untrusted:</p>
|
<p>Untrusted:</p>
|
||||||
<iframe class="e2e-iframe-untrusted-src" width="640" height="390" [src]="dangerousVideoUrl"></iframe>
|
<iframe class="e2e-iframe-untrusted-src" width="640" height="390" [src]="dangerousVideoUrl"></iframe>
|
||||||
<!--#enddocregion iframe-videoid -->
|
|
||||||
|
|
||||||
<!--#enddocregion -->
|
|
||||||
|
@ -6,7 +6,7 @@ import { Component } from '@angular/core';
|
|||||||
selector: 'inner-html-binding',
|
selector: 'inner-html-binding',
|
||||||
templateUrl: 'inner-html-binding.component.html',
|
templateUrl: 'inner-html-binding.component.html',
|
||||||
})
|
})
|
||||||
// #docregion inner-html-controller
|
// #docregion class
|
||||||
export class InnerHtmlBindingComponent {
|
export class InnerHtmlBindingComponent {
|
||||||
// For example, a user/attacker-controlled value from a URL.
|
// For example, a user/attacker-controlled value from a URL.
|
||||||
htmlSnippet = 'Template <script>alert("0wned")</script> <b>Syntax</b>';
|
htmlSnippet = 'Template <script>alert("0wned")</script> <b>Syntax</b>';
|
||||||
|
@ -8,6 +8,7 @@ block includes
|
|||||||
|
|
||||||
For more information about the attacks and mitigations described below, see [OWASP Guide Project](https://www.owasp.org/index.php/Category:OWASP_Guide_Project).
|
For more information about the attacks and mitigations described below, see [OWASP Guide Project](https://www.owasp.org/index.php/Category:OWASP_Guide_Project).
|
||||||
|
|
||||||
|
+ifDocsFor('ts')
|
||||||
.l-main-section
|
.l-main-section
|
||||||
:marked
|
:marked
|
||||||
# Contents:
|
# Contents:
|
||||||
@ -19,6 +20,7 @@ block includes
|
|||||||
* [HTTP-Level vulnerabilities](#http).
|
* [HTTP-Level vulnerabilities](#http).
|
||||||
* [Auditing Angular applications](#code-review).
|
* [Auditing Angular applications](#code-review).
|
||||||
|
|
||||||
|
:marked
|
||||||
Try the <live-example></live-example> of the code shown in this page.
|
Try the <live-example></live-example> of the code shown in this page.
|
||||||
|
|
||||||
.l-main-section
|
.l-main-section
|
||||||
@ -103,8 +105,9 @@ h2#xss Preventing cross-site scripting (XSS)
|
|||||||
a value that an attacker might control into `innerHTML` normally causes an XSS
|
a value that an attacker might control into `innerHTML` normally causes an XSS
|
||||||
vulnerability. For example, code contained in a `<script>` tag is executed:
|
vulnerability. For example, code contained in a `<script>` tag is executed:
|
||||||
|
|
||||||
+makeExcerpt('app/inner-html-binding.component.ts ()', 'inner-html-controller')
|
+makeExcerpt('app/inner-html-binding.component.ts', 'class')
|
||||||
|
|
||||||
|
block html-sanitization
|
||||||
:marked
|
:marked
|
||||||
Angular recognizes the value as unsafe and automatically sanitizes it, which removes the `<script>`
|
Angular recognizes the value as unsafe and automatically sanitizes it, which removes the `<script>`
|
||||||
tag but keeps safe content such as the text content of the `<script>` tag, or the `<b>` element.
|
tag but keeps safe content such as the text content of the `<script>` tag, or the `<b>` element.
|
||||||
@ -112,6 +115,7 @@ h2#xss Preventing cross-site scripting (XSS)
|
|||||||
figure.image-display
|
figure.image-display
|
||||||
img(src='/resources/images/devguide/security/binding-inner-html.png'
|
img(src='/resources/images/devguide/security/binding-inner-html.png'
|
||||||
alt='A screenshot showing interpolated and bound HTML values')
|
alt='A screenshot showing interpolated and bound HTML values')
|
||||||
|
|
||||||
:marked
|
:marked
|
||||||
### Avoid direct use of the DOM APIs
|
### Avoid direct use of the DOM APIs
|
||||||
|
|
||||||
@ -144,6 +148,7 @@ figure.image-display
|
|||||||
the server. Do not generate Angular templates on the server side using a templating language; doing this
|
the server. Do not generate Angular templates on the server side using a templating language; doing this
|
||||||
carries a high risk of introducing template-injection vulnerabilities.
|
carries a high risk of introducing template-injection vulnerabilities.
|
||||||
|
|
||||||
|
block bypass-security-apis
|
||||||
.l-main-section
|
.l-main-section
|
||||||
h2#bypass-security-apis Trusting safe values
|
h2#bypass-security-apis Trusting safe values
|
||||||
:marked
|
:marked
|
||||||
@ -167,7 +172,7 @@ h2#bypass-security-apis Trusting safe values
|
|||||||
your intended use of the value. Imagine that the following template needs to bind a URL to a
|
your intended use of the value. Imagine that the following template needs to bind a URL to a
|
||||||
`javascript:alert(...)` call:
|
`javascript:alert(...)` call:
|
||||||
|
|
||||||
+makeExcerpt('app/bypass-security.component.html ()', 'dangerous-url')
|
+makeExcerpt('app/bypass-security.component.html', 'URL')
|
||||||
|
|
||||||
:marked
|
:marked
|
||||||
Normally, Angular automatically sanitizes the URL, disables the dangerous code, and
|
Normally, Angular automatically sanitizes the URL, disables the dangerous code, and
|
||||||
@ -188,9 +193,10 @@ figure.image-display
|
|||||||
could execute. So call a method on the controller to construct a trusted video URL, that causes
|
could execute. So call a method on the controller to construct a trusted video URL, that causes
|
||||||
Angular to then allow binding into `<iframe src>`:
|
Angular to then allow binding into `<iframe src>`:
|
||||||
|
|
||||||
+makeExcerpt('app/bypass-security.component.html ()', 'iframe-videoid')
|
+makeExcerpt('app/bypass-security.component.html', 'iframe')
|
||||||
+makeExcerpt('app/bypass-security.component.ts ()', 'trust-video-url')
|
+makeExcerpt('app/bypass-security.component.ts ()', 'trust-video-url')
|
||||||
|
|
||||||
|
block http
|
||||||
.l-main-section
|
.l-main-section
|
||||||
h2#http HTTP-level vulnerabilities
|
h2#http HTTP-level vulnerabilities
|
||||||
:marked
|
:marked
|
||||||
|
Loading…
x
Reference in New Issue
Block a user