タグ

ブラウザに関するwate_wateのブックマーク (24)

  • GitHub - dhamaniasad/HeadlessBrowsers: A list of (almost) all headless web browsers in existence

    You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert

    GitHub - dhamaniasad/HeadlessBrowsers: A list of (almost) all headless web browsers in existence
  • SPAでのセッション管理とセキュリティ - Qiita

    普通にcookie使えばいいと思います。 loginリクエストもajaxで投げればcookie返ってくるので、何も考えることないかなと。 Cookie 動作イメージは以下の形です。 == サーバ → UA == Set-Cookie: SID=31d4d96e407aad42; Path=/; Domain=example.com == UA → サーバ == Cookie: SID=31d4d96e407aad42 (from https://triple-underscore.github.io/RFC6265-ja.html) ブラウザの状態管理のためのもの。 もちろん主要ブラウザはどこも付いてます。 railsでもplayでもとりあえずこれでセッション管理されています。 secure属性があると、httpsのときだけやりとりされます。 HttpOnly属性があると、jsから読

    SPAでのセッション管理とセキュリティ - Qiita
  • 私のURLはあなたのURLとは違う : curl作者の語る、URLの仕様にまつわる苦言 | POSTD

    1996年にcurlプロジェクトの先駆けとなるhttpgetを始めたとき、私は初めてURLパーサを書きました。当時はまだ、ユニバーサルアドレスは URL : Uniform Resource Locators と呼ばれていました。その仕様は1994年にIETFによって発行されたものでした。この”URL”という用語からインスピレーションを得てツールとプロジェクトに命名したのが curl でした。 URLという用語は後に事実上、 URI : Uniform Resource Identifiers (2005年発行)に変わりましたが、「オンラインでリソースを指定する文字列のための構文と、そのリソースを得るためのプロトコル」という、基的な点は変わりませんでした。curlでは、この構文仕様RFC 3986の定義に従う”URL”を許容するとうたっていますが、それは厳密には正しくありません。その理由

    私のURLはあなたのURLとは違う : curl作者の語る、URLの仕様にまつわる苦言 | POSTD
  • HTTPキャッシュ。なぜ嫌われるのか。 - それマグで!

    忌み嫌われるキャッシュたち。 キャッシュはどうやら、世間では嫌われ者のようです。 ScrenCaptured_2016-03-05_0.54.33 どうして、そんなにキャッシュされるのがイヤなんだろうか。 そもそもキャッシュってなんだっけ? キャッシュとは、更新されていないコンテンツ(画像、CSS、JS、HTMLDNS結果など)を何度も何度も取得行かずに済むように、クライアントPC側で保存し再利用する仕組み。 つまり、転送量の節約。無駄な転送を控える。非常にエコな仕組みであります。 HTTPのエコ。HTTPはエコなプロトコルだったはず。 3つのR です。 Reduce Reuse Remix 。複数のファイルをそれぞれ、別途管理して1つのページとして構成(Remix)する仕組みです。 ブラウザのキャッシュを利用するメリット 通信料の節約、画面表示の高速化、戻るボタン対応など。 ブラウザは

    HTTPキャッシュ。なぜ嫌われるのか。 - それマグで!
  • リアルな DOM はなぜ遅いのか - steps to phantasien

    これは VirtualDOM Advent Calendar 2014 に勝手に参加する記事です。 あたたかい春の昼下がりのこと、あるブラウザベンダの社内を不穏な噂が駆け巡った。 「React.js なるライブラリ、どうも仮想 DOM というやつのせいで速いらしいぞ」 もうリアルな DOM はお役御免、ブラウザも商売上がったりか・・・。雇用に不安を覚える人(私)がいる一方、 そのアイデアをとりこんでブラウザの DOM を速く出来ないかと考える人たちもいた。 仮想 DOM はなぜ速いのか。誰かのつてを辿って React.js チームにおいでいただき、速さの秘密をテックトークしてもらう。 イミュータブルなデータ構造による単純化、非同期適用による処理のバッチ化、差分アルゴリズムによる副作用の最小化… いくつかのアイデアはブラウザからはどうにもならないが、たとえば非同期化なんかは形は違えどブラウザ

  • pageres - 指定幅でのスクリーンショットをまとめて取得

    MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました コマンドで実行できるから自動化も楽々ですね! レスポンシブWebデザインはブラウザ幅によって表示が変わるので確認が大変です。一つのURLごとに複数の表示を確認しなければなりません。 そんな手間を軽減してくれるツールがpageresです。コマンド一つで複数のブラウザ幅におけるスクリーンショットを取得してくれます。 pageresのインストール インストールはnpmコマンドでできます。 $ npm install -g pageres pageresの使い方 完了したらヘルプを出してみましょう。 $ pageres --help Get screenshots of websites in different resolutions. Usage pageres <url> [</ur

    pageres - 指定幅でのスクリーンショットをまとめて取得
  • SkyWay ― WebRTCを簡単&柔軟に使えるプラットフォーム

    WebRTCは、ブラウザや専用アプリ同士でリアルタイムに映像、音声、データを送受信できる画期的な新技術です。SkyWayを使えば、サーバを準備することなく簡単に、WebRTCを使ったアプリが開発できます。

    SkyWay ― WebRTCを簡単&柔軟に使えるプラットフォーム
  • 安全なインターネットライフのために:プライバシー保護におすすめのブラウザ拡張機能 | ライフハッカー・ジャパン

    プライバシーを保護するブラウザ拡張機能はたくさんありますが、いったいどれが「ベスト」なのでしょうか? 自分に必要なツールはどれ? 今回はおすすめのブラウザ拡張機能を紹介します。 プライバシーを守るツールは大きく3つのグループに分類できます。第三者からのトラッキングを回避するアドオン、広告やスクリプトをブロックするアドオン、その他、オンラインの安全性を高めるセキュリティツールです。 スクリプト、ポップアップをブロックする『AdBlock Plus』 AdBlock Plusなどのブロック系ツールは、第三者のスクリプトがユーザーデータを勝手にどこかに送信するのを防ぎます。ただし、使い方を誤るとサイトのレンダリングが崩れることもあるので注意が必要です。 AdBlock Plus(Firefox/Chrome)は、悪意あるサイトへのアクセスを止めたり、第三者の追跡クッキーやスクリプトを無効にしたり

  • 開発者のための WebKit (“WebKit for Developers” 日本語訳)

    このノートは、Paul Irishによる記事 “WebKit for Developers” の日語訳です。 僕ら開発者の多くにとって、WebKit はブラックボックスだ。HTML, CSS, JS, その他のアセットを投げると、WebKit は魔法でもかけたかのように、綺麗な Web ページを返してくれる。しかし、僕の同僚 Ilya Grigorik は当の WebKit はこうだと言っている。 WebKit はブラックボックスではない。ホワイトボックスなんだ。さらにそれだけではなく、オープンなホワイトボックスなんだ。 じゃあ、これから次のことについて理解していこう。 WebKit ってなに? なにが WebKit じゃないの? WebKit ベースのブラウザで WebKit はどう使われているの? なんですべての WebKit が同じじゃないの? さて、世の中に数多くの WebKi

  • CORS(Cross-Origin Resource Sharing)について整理してみた | DevelopersIO

    ブラウザからAmazon S3に直接ファイルをアップロードしたい 先日、Amazon S3にファイルをアップロードするWebアプリを作ろうとして色々調べていたところ、S3にCORSという仕様のクロスドメインアクセスの設定をすることによって、ブラウザから直接S3にアップロードをする方法にたどり着きました。ただ、この方法を使うにあたってはCORSというクロスドメインアクセスの仕様をきちんと理解しておいた方が良さそうでしたので、まずはCORSについて自分なりに整理してみました。 なお、弊社の横田がCORSとS3についての記事を以前書いていますので、S3のCORSサポートに関する概要を知りたい方はそちらをご覧下さい。 CORS(Cross-Origin Resource Sharing)によるクロスドメイン通信の傾向と対策 CORS ブラウザでAjax通信を行う際には、同一生成元ポリシー(Same

  • オリジン間リソース共有 (CORS) - HTTP | MDN

    HTTP ガイド リソースと URI ウェブ上のリソースの識別 データ URL MIME タイプ入門 よくある MIME タイプ www 付きと www なしの URL の選択 HTTP ガイド HTTP の基 HTTP の概要 HTTP の進化 HTTP メッセージ 典型的な HTTP セッション HTTP/1.x のコネクション管理 プロトコルのアップグレードの仕組み HTTP セキュリティ Content Security Policy (CSP) HTTP Strict Transport Security (HSTS) X-Content-Type-Options X-Frame-Options X-XSS-Protection サイトの安全化 HTTP Observatory HTTP アクセス制御 (CORS) HTTP 認証 HTTP キャッシュ HTTP の圧縮 HTT

    オリジン間リソース共有 (CORS) - HTTP | MDN
  • Webシステムのフロントエンド高速化で最初にやるべきこと - かみやんの技術者ブログ

    前回のエントリーで、Dartの次は、TypeScriptを検証する。と書いたけど、なぜか自分のPCでは、VisualStudio for WebにTypeScriptのプラグインがインストールできなかったので、TypeScriptを使うことを諦めました。コマンドラインでコンパイルはできたけど、それでは型付け言語のメリットであるIDEによる補完や参照検索やリネームリファクタリングが効かないので。ちなみにプログラマのPCではあっさりインストールできたとのこと。がっくり。 というわけで、Dartを実戦投入することを決定してDartで開発をしています。 フロントエンド高速化のExpiresヘッダ さて、今日の題。Webシステムのフロントエンド高速化のお話です。Webシステムの速度の大きなボトルネックとしてDB負荷がありますが、ブラウザ側のレンダリングを高速化する話としてフロントエンド高速化があり

    Webシステムのフロントエンド高速化で最初にやるべきこと - かみやんの技術者ブログ
  • 【クリスマスだし】Internet Explorerとうまく付き合う方法【IE対応まとめ】【25日目の6】 | DevelopersIO

    IE6はタヒぬDeath! こんばんは、クラスメソッドWebマスターの野中です。 今日はクリスマスですね、社内には独り身の負のオーラが満ちてます(既婚者が多いので残っている人は少ない)。 ところで、最近はCSS3もすこしずつ使えるようになってきていて、IE6からIE8の対応を蔑ろにしてしまっている自分がいます。 Web制作に携わってから6年、常に付きまとう古いIEは腐れ縁というか、ある意味青春ですね。 とっても今さら感たっぷりなお題目ですが、ここでIE対応のポイントを自分のために総浚いして青春に決着をつけたいと思います。 過去の経験と情報収集をもとにまとめているので実際にテストしたものではありません。 解決のきっかけ程度になれば良いと思いまとめています。 IEの現状 一般的なブラウザと先進的なブラウザに対する手法と考え方 ドキュメントタイプ:文書型定義 IE向け条件付きコメントで分岐処理

    【クリスマスだし】Internet Explorerとうまく付き合う方法【IE対応まとめ】【25日目の6】 | DevelopersIO
  • CORS(Cross-Origin Resource Sharing)によるクロスドメイン通信の傾向と対策 | DevelopersIO

    CORS(Cross-Origin Resource Sharing)って何? CORS(Cross-Origin Resource Sharing)は、その名の通り、ブラウザがオリジン(HTMLを読み込んだサーバのこと)以外のサーバからデータを取得する仕組みです。各社のブラウザには、クロスドメイン通信を拒否する仕組みが実装されています。これは、クロスサイトスクリプティングを防止するためです。Aというサイトに訪問したのに、Bというサイトに向けて個人情報を送っていたというのは困りますよね。例えば、オリジンから読み込んだHTML内のJavaScriptでJSONデータを読み込むとしましょう。JSONデータが同じサーバにあれば普通に読み込めますが、別のサーバにある場合は読み込めません。まぁ実際のところはJSONPという仕組みを使ってできちゃったりしますが、抜け道的なやり方で使われていました。CO

  • jQueryでRetinaディスプレイを判別して処理を変える方法|BLACKFLAG

    iPhoneなどApple製品に使われているRetinaディスプレイ。 従来のディスプレイよりも高解像度(1ピクセルの幅が78ミクロン)であることから Retinaディスプレイで画像を綺麗に表示するには、表示する倍のサイズで作成する必要があったり 特別な対処をする必要がでてきたりします。 そんなRetinaディスプレイに対して、jQuery(JavaScript)を使って判別し 個別に処理させる方法があったので紹介してみます。 ※webkitブラウザのみの対応です。 Retinaディスプレイかどうかを判別するプロパティは デバイス上で画像の1pxの単位を何pxとしてレンダリングしているかを見てくれる ————————————– window.devicePixelRatio ————————————– によって判別します。 Retinaディスプレイはここで取得する値が「2」になります。 こ

    jQueryでRetinaディスプレイを判別して処理を変える方法|BLACKFLAG
  • レスポンシブなデザインにするなら知っておきたい。各ブラウザの小数点以下のピクセル値の扱い

    デザイン要素を固定しないリキッドレイアウトは、未知の端末にも対応するというコンセプトのもとに実装するレスポンシブウェブデザインには必須だと考えています。そのリキッドレイアウトを実装する際に理解しておきたいのが、パーセント値で幅や高さを指定した際に小数点以下になるピクセル値(10.5pxとか9.2pxなど)に対するブラウザの挙動です。 たとえばグリッドシステムを構築する際、計算上はあっているのにブラウザでは思った通りに表示されないといったことが起こります。これは、各ブラウザのサブピクセル(小数点以下のピクセル値)の扱いの挙動差により生まれます。 まずはパーセント指定の基から まずは前提となるパーセント指定の際の計算の基のおさらいから。。。 CSSでパーセント値を使って幅や高さ指定をすると、指定した要素を含む親要素をベースにピクセル値が計算されます。 たとえば100pxの親要素の中にある子

    レスポンシブなデザインにするなら知っておきたい。各ブラウザの小数点以下のピクセル値の扱い
  • ブラウザのしくみ: 最新ウェブブラウザの内部構造 - HTML5 Rocks

    How browsers work Stay organized with collections Save and categorize content based on your preferences. Preface This comprehensive primer on the internal operations of WebKit and Gecko is the result of much research done by Israeli developer Tali Garsiel. Over a few years, she reviewed all the published data about browser internals and spent a lot of time reading web browser source code. She wrot

    ブラウザのしくみ: 最新ウェブブラウザの内部構造 - HTML5 Rocks
  • 個人利用なら SSL 証明書が無料で利用できるらしい: ある SE のつぶやき

    「体系的に学ぶ 安全なWebアプリケーションの作り方」を読んでいたら、とっても気になる記述が。 サーバー証明書のうちドメイン認証証明書は比較的価格が安く、購入のハードルが低いものですが、ドメイン認証証明書には無料のものがあります。イスラエルのStartComという企業は、無料のサーバー証明書を発行しています。IE、Firefox、Google Chrome、Safari、Operaの最新版で証明書エラーなく使用できます。IE6でもアップデートが当たっていれば使用できます。 日の携帯電話には対応していないようです。しかし、今までラピッド SSL が年間2,100円で最強だと思っていたけど無料のものがあるとは。気になったので、ちょっと調べてみました。 以下の画面が StartCom のサイトです。画面の赤枠のリンクをクリックすると次の画面が表示されます。 そうすると、SSL 証明書の製品紹介

    wate_wate
    wate_wate 2012/03/18
    ∑( ̄Д ̄;)なぬぅっ!!、もう一回、体系的に学ぶ 安全なWebアプリケーションの作り方読み直してみよう・・・
  • Microsoft Learn: Build skills that open doors in your career

    Microsoft Learn. Spark possibility. Build skills that open doors. See all you can do with documentation, hands-on training, and certifications to help you get the most from Microsoft products. Learn by doing Gain the skills you can apply to everyday situations through hands-on training personalized to your needs, at your own pace or with our global network of learning partners. Take training Find

    Microsoft Learn: Build skills that open doors in your career
    wate_wate
    wate_wate 2012/03/09
    資料的な意味ではてブ
  • Hostsファイルを編集、反映するFirefoxアドオン·Change Hosts MOONGIFT

    Change HostsはFirefox上でHostsファイルを編集し、即時反映できるアドオンです。 開発時にローカルのサーバをリモート風に見立てる際に行うのがhostsファイルの修正です。大抵Webブラウザで利用すると思うので、Webブラウザ自体から修正するChange Hostsは便利かも知れません。 配布サイトです。インストールします。 確認ダイアログです。 インストールしました。 アドオン一覧から呼び出す設定画面です。 Hostsの内容は複数記録しておけます。 編集画面です。 Change Hostsは保存時にDNSのフラッシュをしてくれるので、設定内容が即時に反映されます。開発時には便利なアドオンです。予め設定を用意しておけば、ステータスバーからの切り替えもできるようです。 Change HostsはFirefox用、Mozilla Public Licenseのオープンソース・