Mercurial > hg > isophonics-drupal-site

comparison vendor/zendframework/zend-escaper/doc/book/escaping-css.md @ 0:4c8ae668cc8c

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Initial import (non-working)
author Chris Cannam
date Wed, 29 Nov 2017 16:09:58 +0000
parents
children
comparison
equal deleted inserted replaced
-1:000000000000 0:4c8ae668cc8c
1 # Escaping Cascading Style Sheets
2
3 CSS is similar to [escaping Javascript](escaping-javascript.md). CSS escaping
4 excludes only basic alphanumeric characters and escapes all other characters
5 into valid CSS hexadecimal escapes.
6
7 ## Example of Bad CSS Escaping
8
9 In most cases developers forget to escape CSS completely:
10
11 ```php
12 <?php header('Content-Type: application/xhtml+xml; charset=UTF-8'); ?>
13 <!DOCTYPE html>
14 <?php
15 $input = <<<INPUT
16 body {
17 background-image: url('http://example.com/foo.jpg?</style><script>alert(1)</script>');
18 }
19 INPUT;
20 ?>
21 <html xmlns="http://www.w3.org/1999/xhtml">
22 <head>
23 <title>Unescaped CSS</title>
24 <meta charset="UTF-8"/>
25 <style>
26 <?= $input ?>
27 </style>
28 </head>
29 <body>
30 <p>User controlled CSS needs to be properly escaped!</p>
31 </body>
32 </html>
33 ```
34
35 In the above example, by failing to escape the user provided CSS, an attacker
36 can execute an XSS attack fairly easily.
37
38 ## Example of Good CSS Escaping
39
40 By using `escapeCss()` method in the CSS context, such attacks can be prevented:
41
42 ```php
43 <?php header('Content-Type: application/xhtml+xml; charset=UTF-8'); ?>
44 <!DOCTYPE html>
45 <?php
46 $input = <<<INPUT
47 body {
48 background-image: url('http://example.com/foo.jpg?</style><script>alert(1)</script>');
49 }
50 INPUT;
51
52 $escaper = new Zend\Escaper\Escaper('utf-8');
53 $output = $escaper->escapeCss($input);
54 ?>
55 <html xmlns="http://www.w3.org/1999/xhtml">
56 <head>
57 <title>Escaped CSS</title>
58 <meta charset="UTF-8"/>
59 <style>
60 <?php
61 // output will look something like
62 // body\20 \7B \A \20 \20 \20 \20 background\2D image\3A \20 url\28 ...
63 echo $output;
64 ?>
65 </style>
66 </head>
67 <body>
68 <p>User controlled CSS needs to be properly escaped!</p>
69 </body>
70 </html>
71 ```
72
73 By properly escaping user controlled CSS, we can prevent XSS attacks in our web
74 applications.