ヽ(´・肉・`)ノログ

How do we fighting without fighting?

cookieのsecure属性とhttponly属性について試した

cookie には securehttponly という属性があるのだけど, 設定すると具体的にどうなるのかわからなかったので下に貼ったソースコードのような簡単な sinatra アプリを作ってheroku に上げてみた

フォームに値を入力すると,サーバーが受け取った cookie と JavaScript が知っている cookie を表示することができる.

http アクセスで試すと

result:
params: aa, cookies: {"none"=>"none", "http-only"=>"http-only"}

local cookie:
none=none

という感じになる.

https アクセスで試すと

result:
params: abc, cookies: {"none"=>"none", "http-only"=>"http-only", "secure"=>"secure", "both"=>"both"}

local cookie:
none=none; secure=secure

と secure 属性のものが読めるようになる.

何も設定していない項目は読めるのは当然だけど, http-onlydocument.cookie からは読めないのに, なぜかサーバーには渡ってきている.なぜだ!

ブラウザが勝手に付与してくれるんだろうか. ここらへんの仕組みについて詳しい人がいればぜひ教えていただきたい.

herokuに上げたコード

cookie_attributes.rb

require 'sinatra'

get '/' do
  response.set_cookie('none',      value: 'none')
  response.set_cookie('http-only', value: 'http-only', httponly: true)
  response.set_cookie('secure',    value: 'secure',                    secure: true)
  response.set_cookie('both',      value: 'both',      httponly: true, secure: true)
  erb :index
end

post '/new' do
  "params: #{params[:in]}, cookies: #{request.cookies}"
end

__END__

@@index
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
  <title>Cookie attributes</title>
</head>
<body>
  <title>Cookie attributes</title>
  <input type="text" id="input">
  <p>result:</p><span id="result"></span>
  <p>local cookie:</p><span id="local-cookie"</span>
  <script src="//code.jquery.com/jquery-2.0.3.min.js"></script>
  <script>
$(function() {
  $('#input').keyup(function() {
    $.post('/new',
           {
               in: $('#input').val()
           },
           function(ret) {
             $('#result').text(ret);
             $('#local-cookie').text(document.cookie)
           });
  });
});
  </script>
</body>