JavaScript を書いたことがある人ならば一度は使うであろう console.log ですが、この関数は思ったよりも厄介な性質を持っています。その性質を知らずに console.log を使うと、デバッグ時に大ハマリしてしまうことがあります。この記事では console.log の落とし穴についてお話します。 今回は Chrome に特化して解説しますが、Firefox や Safari でも同じ落とし穴があります。 console.log とは まずはさらっと基本をおさらいしましょう。 大前提なのですが、console.log は JavaScript の言語仕様(ECMAScript)で定義されていません。ブラウザ向けには whatwg の仕様がありますが、あくまでもそれはブラウザ向けの仕様であり、Node.js を含むほぼ全ての JavaScript 環境で使えるのは cons
ブラウザから直接TCP・UDPで送受信する「Direct Sockets API」という仕組みが議論されています。 実験段階ですが、Chromeでは起動時にオプションを付けることでこの機能を有効にできます。今回はTCPの方で簡単に動作を見てみます。 Direct Sockets API Direct Sockets APIは、TCP・UDPで直接送受信可能にするAPIです。既存のアプリケーションプロトコル(SSHやIRC)、P2Pのような機能を実現可能になります。 もちろんセキュリティ上の問題もあるので、Chromeでは現状デフォルトでは有効になっていない機能です。 セキュリティ面についてはだいぶGithubリポジトリで議論されておりますので目を通すと良いでしょう。ローカルネットワークへの通信やSame-Origin-Policy(CORS)回避の話が上がっていますが、今回は細かくは紹介し
Googleは現在開発中のChrome 81ベータ版に、Web NFCの機能を試験的に組み込んだことを明らかにしました。 Web NFCは、WebアプリケーションからNFC(Near Field Communication:近距離無線通信規格)タグの読み書きを行うための仕様および機能です。NFCに対応したICタグとデバイスを数センチの距離に近づけると非接触で通信ができます。 スマートフォンの多くにはすでにNFCリーダー/ライターの機能が備わっているため、Web NFCの機能を組み込んだWebブラウザを利用することでアプリケーションからスマートフォンのNFC機能を利用可能です。 ただし現時点でのWeb NFCの対応範囲はNDEF(NFC Data Exchange Format)と呼ばれる軽量なメッセージ交換までで、ISO-DEP、NFC-A/B、NFC-F、HCEなどへの対応はスコープ外と
2020/2/18追記 サポートに問い合わせたところ、ALBの不具合はロールバック済みで、cookie名を縮める対応は不要、とのことでした。試してみたところ、たしかにcookie名の指定をやめても問題なく認証できました。 AWSのApplication Load Balancerの認証機能を使って、スタッフからのアクセスのみ許可する社内向けウェブサービスを運用しているのだけど、昨日くらいからGoogle Chromeで認証が通らなないという声を聞くようになった。 現象としてはリダイレクトループが発生していて、コンソールを見るとSet-Cookie headerが長すぎるというエラーが出ていた。 Set-Cookie header is ignored in response from url: https://****/oauth2/idpresponse?code=e51b4cf0-8b
Chrome 79以下や他ブラウザのデフォルト値。 Chrome 80からこの値を設定する場合、Secure属性も必須となる。 Aサイトに対し、Bサイトからどのようなリクエストがあっても、発行したサイトでCookieヘッダーに含める (Cookieを使用する) 図にすると以下のようになります。 Strict 外部サイトからのアクセスではCookieを送らない。 Lax 外部サイトからのアクセスはGETリクエストのときだけCookieを送る。 None 従来通りの動き。 【追記】なおChrome 80以降でSecure属性を付けずSameSite=Noneを指定した場合、set-cookie自体が無効になります。 セキュリティ上の効果 CSRF対策になります。 CSRF (クロスサイト・リクエスト・フォージェリ) とは、 WEBサイトがユーザー本人の意図した動作であることを検証していないため
Google Chrome 78へのアップデート後にクラッシュして何も見れない現象が発生しているようです(2019/10/23 朝~)。エンジン自体が起動していないためか、設定画面含めてほぼすべて開けなくなります。また、再インストールしても最新バージョンがインストールされるため解消されません。 ※現象がハッキリしてきたので対応方法を更新しました(19/10/24 19:00) 検証環境 Windows 10 Pro Chrome 78.0.3904.70 Endpoint Protection 12.1 RU6 MP7 ※PCMaticでも不具合報告有 対応方法 バグでは無く互換性の問題のようなので下記のいずれかが正しい対処のようです。 Symantec Endpoint Protectionをアンインストールもしくは、v14.2以降にバージョンアップする PcMaticをアンインストール
1. Chrome でEV証明書の組織名表示がなくなる ついにGoogleからChromeのURLバーからEV表示を削除する正式なアナウンスが出ました。 Upcoming Change to Chrome's Identity Indicators EV UI Moving to Page Info 現在(2019年8月) StableのChrome76では、以下の様にURLバー左側にEV証明書を利用していることを示す「組織名+国名」表示が付いています。 Chrome76のEV表示 2019年9月10日Stableリリース予定のChrome77からはEV表示がURLバーから削除され、鍵アイコンをクリックして表示されるPage Infoに「組織名+国名」が表示されるようになります。 Googleのアナウンスでは、 "on certain websites" と書いてあることから一気にではなく
Portalsとは japan.zdnet.com とのことで、iframeタグとよく似たportalタグができるらしい。 portalタグと<iframe>タグの違いは何かと言えば、Googleの新たなPortalsテクノロジーが<iframe>タグの制約を取り去ったものだというところにある。 Portalsを使用することでユーザーは、埋め込んだコンテンツへのナビゲーションが可能になるとGoogleは述べている。<iframe>タグではセキュリティ上の理由からこういったことが許されていない。 さらに、Portalsではアドレスバー上のURLを上書きすることもできるため、<iframe>タグが今日担っているコンテンツの埋め込みという枠を超え、ナビゲーションシステムとしても利用できる。 ふむふむ。 例えばエンジニアらは、ユーザーがニュースサイトを閲覧しており、記事の末尾に達した際に、<por
Exploit検出のサービスを公開しているEdgeSpotはChromeのPDFビューワーに情報漏えいの脆弱性が確認されたとして不具合に係る情報を公開しました。ここでは関連する情報をまとめます。 脆弱性の概要 EdgeSpotがChrome PDFビューワーの情報漏えいの脆弱性を次の記事にまとめている。 blog.edgespot.io 概要は以下の通り。 影響 ユーザーが意図せずHTTPリクエストを送出し、情報漏えいする恐れ 影響を受ける対象 Google Chrome (72.0.3626.119で発生を確認) 脆弱性の名称 無し CVE 確認できず PoC インターネット上で脆弱性の利用が既に確認されている。 対策 2019/3/1時点で未修正。 修正されるまでAdobe製のPDFリーダーの利用を推奨。 2019年4月下旬ころ修正の予定と発見者は報告。 Edge、Adobe Acro
5日にリリースされたChrome 59で、ブラウザと共にアップデートされたデベロッパーツールの新機能を紹介します。 What's New In DevTools (Chrome 59) Chrome 59 - What's New in DevTools -YouTube ページの軽量化: 未使用のCSSとJavaScriptを見つける フルサイズのスクリーンショットをキャプチャ リソースのロードをブロック 非同期コードの検証 コマンドメニューの統一 ページの軽量化: 未使用のCSSとJavaScriptを見つける 新機能の一つ目は「Coverage tab」。ページで使用されていないCSSとJavaScriptを見つけることができます。 command + shift + P で、「Show Coverage」を入力して選択。 ※「cov」まで入力すれば、上位に表示されます。 Show
[2018/07/07 追記] 本記事ではChrome拡張について説明していますが、Firefox1やEdgeの拡張機能もほぼ同じ仕組みで動いています。 [2023/11/06 追記] #参考 ページを追加しました。 Chrome拡張。便利な機能を簡単に追加できるので使っている人も多いと思います。 ただ、インストール時の権限の注意書きが分かり難いので無条件に承認(追加)していることもあるのではないかと思われます。 そこで、本記事ではChrome拡張の権限の種類・確認方法の他、拡張がどこまで(悪いことを)できるのかとその対策を3段階の権限(危険性)レベルごとに紹介していきたいと思います。 便利だが危険性もあるChrome拡張 Chrome拡張をインストールすると、Webページを読むというブラウザ本来の機能だけでなく様々なことができるようになります。 例えば、Webメールの新着通知や記事などの
最近、普段以上にChromeの開発者ツールを使うことに時間をかける機会がありました。その過程で、自分が今まで気づいていなかった機能をいくつか見つけました(少なくとも今までその機能を探す必要に迫られていなかった、とも言えるのですが。例えばブラックボックス化や非同期のスタックトレースなど)。そのため、開発者ツールでとても気に入っているいくつかの機能についてまとめてみたくなったのです。 小さな虫眼鏡ののアイコンは、特定の要素やCSSプロパティに対して、「どのCSSファイルに書かれているどのセレクタ/クラスが最終的なスタイルを決めているか」を示してくれます。例えば、どれかDOM要素に対して「要素を検証」を選び、右側の「Computed」というタブを選びます。確認したいCSSプロパティを見つけてその虫眼鏡アイコンをクリックすることで、すぐさま右側に正しいCSSファイル内のクラス/セレクタを表示してく
蒼月 @aomixer Chromeの右上(閉じるボタン付近)に自分の名前が表示されるようになった・・改悪としか思えん。非表示にしたいのに設定もない。ごみすぎる。。。 2015-01-14 10:01:21
インターネットしてる人ならかなりの人が取得しているであろうGoogleアカウント。Androidスマホだとほぼ必須と言えるので、このブログを読んでくださってる人ならまず持っていることでしょう。 そしてGoogleアカウントとこの上なく相性がいいブラウザがChromeブラウザです。昔はそのシンプルさと圧倒的なレンダリング速度が目玉でしたが、最近は他のブラウザも進化し、レンダリング速度で大きな優位性はなくなってきました。 それでも、Googleアカウントとの親和性の高さで私は今も使い続けています。PCとスマホでブックマークや閲覧したページを共有(同期)できたり、新規PCにインストールしてもすぐにブックマークを復元できたりとか、やはり便利です。 ChromeでGoogleアカウントを複数使いわけたいとき、どのようにしていますか?まさか一度ログアウトして再度アカウントとパスワード入力したりとかして
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く