讓你的web應用更安全

• X-Frame-Options
• Cookie of secure and httpOnly

設定X-Frame-Options

https://developer.mozilla.org/en-US/docs/Web/HTTP/X-Frame-Options

X-Frame-Options 主要是為了防止點擊劫持(clickjacking)點擊劫持（clickjacking）是一種在網頁中將惡意代碼等隱藏在看似無害的內容（如按鈕）之下，並誘使使用者點擊的手段。X-Frame-Options HTTP 頭部欄位用來指示傳輸的資源是否可以被包含在 或 中，服務端可以聲明這個策略來確保自己的網頁內容不會被嵌入到其他的頁面中．<strong>X-Frame-Options</strong>　具有３個具體的值：</p> <ul> <li><p><strong>DENY</strong>表明網頁內容不可以被嵌入到任何frame中</p></li> <li><p><strong>SAMEORIGIN</strong>同源策略，聲明網頁內容可以被同一域下面的frame嵌入，但不能被不在同一域下面的frame嵌入．<strong>同源</strong>： 協議，網域名稱和連接埠全部相同，即使是ip與網域名稱對應，也認為是不同域下，下面說明了具體的情況，與： http://www.example.com/dir/page.html對比：</p></li> </ul> <table> <tr> <th style="text-align:center">Compared URL</th> <th style="text-align:center">Outcome</th> <th style="text-align:center">Reason</th> </tr> <tr> <td style="text-align:center">http://www.example.com/dir/page2.html</td> <td style="text-align:center">同源</td> <td style="text-align:center">協議主機連接埠相同</td> </tr> <tr> <td style="text-align:center">http://www.example.com/dir2/other.html</td> <td style="text-align:center">同源</td> <td style="text-align:center">協議主機連接埠相同</td> </tr> <tr> <td style="text-align:center">http://username:password@www.example.com/dir2/other.html</td> <td style="text-align:center">同源</td> <td style="text-align:center">協議主機連接埠相同</td> </tr> <tr> <td style="text-align:center">http://www.example.com:81/dir/other.html</td> <td style="text-align:center">不同源</td> <td style="text-align:center">連接埠不同</td> </tr> <tr> <td style="text-align:center">https://www.example.com/dir/other.html</td> <td style="text-align:center">不同源</td> <td style="text-align:center">協議不同</td> </tr> <tr> <td style="text-align:center">http://en.example.com/dir/other.html</td> <td style="text-align:center">不同源</td> <td style="text-align:center">主機名稱不同</td> </tr> <tr> <td style="text-align:center">http://example.com/dir/other.html</td> <td style="text-align:center">不同源</td> <td style="text-align:center">主機不同，必須完全符合</td> </tr> <tr> <td style="text-align:center">http://v2.www.example.com/dir/other.html</td> <td style="text-align:center">不同源</td> <td style="text-align:center">主機不同，必須完全符合</td> </tr> <tr> <td style="text-align:center">http://www.example.com:80/dir/other.html</td> <td style="text-align:center">Depends</td> <td style="text-align:center">Port explicit. Depends on implementation in browser</td> </tr> </table> <ul> <li><strong>ALLOW-FROM</strong>指定具體的來源</li> </ul> <h2>伺服器配置</h2> <h3>Apache</h3> <p>添加網站配置：</p> <pre class="sycode" name="code">Header always append X-Frame-Options SAMEORIGIN</pre> <h3>Nginx</h3> <p>添加 http , server 或者　location 配置</p> <pre class="sycode" name="code">add_header X-Frame-Options SAMEORIGIN;</pre> <h3>IIS</h3> <p>添加到網站的 Web.config</p> <pre class="sycode" name="code"><system.webServer> ... <httpProtocol> <customHeaders> </customHeaders> </httpProtocol> ...</system.webServer></pre> <h3>HAProxy</h3> <p>添加到 frontend, listen, 或者 backend 配置中:</p> <pre class="sycode" name="code">rspadd X-Frame-Options:\ SAMEORIGIN</pre> <h2>更安全的Cookie</h2> <p>Cookie 是瀏覽器儲存在用戶端的小的文字檔，用於用戶端與伺服器之間互傳．Web伺服器通過指定 http header 的 Set-Cookie, 其結構如下：</p> <pre class="sycode" name="code">Set-Cookie: name=value[; expires=date][; domain=domain][; path=path][; secure][; httpOnly]</pre> <p>可以看到，Cookie主要包含一下幾個欄位：</p> <ul> <li><strong>name</strong></li> <li><strong>value</strong></li> <li><strong>expire</strong></li> <li><strong>domain</strong></li> <li><strong>path</strong></li> <li><strong>secure</strong></li> <li><strong>httpOnly</strong></li> </ul> <p>這裡主要講secure 和 httpOnly</p> <h3>httpOnly標識</h3> <p>用來告訴瀏覽器不能通過JavaScript的 document.cookie 來訪問 cookie, 目的是避免 <strong>跨站指令碼攻擊 (XSS)</strong></p> <h3>secure標識</h3> <p>強制應用通過Https來傳輸 Cookie</p> <h2>PHP Yii2中設定Cookie的 httpOnly 和 secure</h2> <h3>設定 _csrf</h3> <p>Yii2中的 Cookie yii\web\Cookie預設是 httpOnly的, </p> <pre class="sycode" name="code">class Cookie extends \yii\base\Object{ public $name; public $value = ''; public $domain = ''; public $expire = 0; public $path = '/'; public $secure = false; public $httpOnly = true;}</pre> <p>使用 <?= Html::csrfMetaTags() ?> 就會產生一個 name=_csrf 的 Cookie, 預設是 httpOnly, 通過注入request來改變:</p> <p>在 config/main.php 中</p> <pre class="sycode" name="code"> ... 'components' => [ 'request' => [ 'csrfCookie' => [ 'httpOnly' => true, 'secure' => SECURE_COOKIE, ], ], ... ] ...</pre> <p>注入 csrfCookie 的 httpOnly 和 secure 屬性值</p> <h3>產生secure的 Cookie</h3> <pre class="sycode" name="code">$cookies = Yii::$app->response->cookies;$cookies->add(new Cookie([ 'name' => 'accesstoken', 'value' => $accessToken, 'expire' => time() + Token::EXPIRE_TIME, 'secure' => SECURE_COOKIE ]));</pre> <p>注意更新 Cookie 的時候也需要更新 secure 屬性</p> <pre class="sycode" name="code">$cookies = Yii::$app->request->cookies;if (($cookie = $cookies->get('accesstoken')) !== null) { $cookie->secure = SECURE_COOKIE; // 這裡很重要, 不然就會丟失 $cookie->expire = time() + Token::EXPIRE_TIME; Yii::$app->response->cookies->add($cookie);}</pre><li ><i class="layui-icon">&#xe63a;