DeepL APIを用いたChrome拡張機能「DeepLopener」を公開しました - TeahatDeepLopener はDeepL翻訳のAPIを利用したGoogle chrome の拡張機能です。 ページ翻訳やドキュメント翻訳、PDF上に翻訳結果を表示することができます。 下の記事に移行しました． t3ahat.hateblo.jp 【2022/2/14追記】 Android版をリリースしました！ まだ機能は少なめですが、よかったらお試しください． play.google.com
Chromeの操作を記録してPuppeteerやPlaywrightのコードに置き換えてくれる「Headless Recorder」レビュー
ウェブサイトのテスト自動化やスクレイピングに利用されるPuppeteerやPlaywrightといったライブラリを使うと、ChromeやFirefoxなどのGUIを備えるブラウザなしにウェブサイトの情報を取得することができます。そんなPuppeteerやPlaywrightのコードを「ブラウザの操作」から逆に取得できるのが、Chrome拡張機能の「Headless Recorder」です。 Headless Recorder - Chrome ウェブストア https://chrome.google.com/webstore/detail/headless-recorder/djeegiggegleadkkbgopoonhjimgehda Headless RecorderはChromeウェブストアで配信されているので、上記のURLにChromeでアクセスして「Chromeに追加」をクリッ
Web 技術の調査方法 | blog.jxck.io
Intro 「新しい API などを、どうやって調べているのか」「仕様などを調べる際に、どこから手をつければ良いのか」などといった質問をもらうことがある。 確かにどこかに明文化されていると言うよりは、普段からやっていて、ある程度慣れてきているだけなものであり、自分としても明文化していなかったため、これを機に解説してみる。 やり方は一つではない上に日々変わっていくだろうが、頻繁にこの記事を更新するつもりはない。また、筆者は実務で必要になるというよりは、ほとんどを趣味でやっているため、このやり方が合わない場面は多々有るだろう。 スコープとしては、ライブラリ、ツール、フレームワークなどではなく、 Web プラットフォーム関連の標準やブラウザの実装状況などに限定している。 Scope 従来からあり、広く認知された API については、情報も多く調査の敷居はそこまで高くないため、今回は議論が始まって
Google に入社して 10 年が経った
Developer Advocate という技術啓蒙の担当者として Google に入社して今日でちょうど 10 年が経った。技術以外のことについてはめったにブログを書くことはないのだけど、良い節目なのでこの機会に記録を残しておきたい。 Google 入社のきっかけ # 「インターネットにアイデンティティのレイヤーを作り、インターネット全体をオープンなソーシャルネットワークの基盤にしたい」これが僕が前職で持っていた野望だった。その一歩として、その会社で運営していたポータルサイト全体をソーシャルプラットフォーム化するというアイディアが採用され進める中で、OpenSocial という Google が中心として進めていた技術に取り組んでいた。日本語の情報が少ない分野だったためブログを書いたり、コミュニティ運営や技術講演をしていたら、当時 (今もだけど) 仲良くしてもらっていた田中洋一郎さんに
電子情報学特論：Chromiumのアーキテクチャを解き明かす
電子情報学特論： Chromium のアーキテクチャを解き明かす 〜 EEIC の授業が生きるプロダクトの世界〜 Kentaro Hara 2020 April (๑>ᴗ<๑) * * * *
How Zoom's web client avoids using WebRTC - webrtcHacks
How Zoom’s web client avoids using WebRTC (DataChannel Update) Editor’s Note: This post was originally published on October 23, 2018. Zoom recently started using WebRTC’s DataChannels so we have added some new details at the end in the DataChannels section. Rube Goldberg’s Professor Butts and the Self-Operating Napkin (1931) Zoom has a web client that allows a participant to join meetings without
Chrome拡張の高速な英語辞書ツールをつくりました(Mouse Dictionary) - Qiita
経緯 もともとMouseoverDictionaryという素晴らしいFirefox用辞書があったのですが、Quantumの登場とXULの廃止とともに使えなくなってしまったため、自分用にChrome拡張をつくった次第です。 ソースコード 実装に関わる技術寄りの用語: React, esbuild, chrome.storage.local, chrome.storage.sync, Cross-extension messaging, Hogan, debounce, resizable/draggable, intl.v8BreakIterator, deinja, クロスブラウザ, など。 ※詳細は「Mouse Dictionaryの技術的な話」をご参照ください https://qiita.com/wtetsu/items/2a5568cb0b5a38c003fb 使い方 インストール
Chrome デベロッパーツールの Console を使いこなす - Qiita
技術書典5 で本記事をさらにパワーアップさせた本を書いたのでよかったらどうぞ Chromeデベロッパーツールを使いこなそう Console編 Chrome デベロッパーツールの Console には Web 画面を解析するための便利な機能が備わっています。 この便利機能を覚えておくと Web 画面からの情報抽出 や、 Chrome Extension 開発 がとても捗ります。 ※ 筆者はこの機能を利用して、 ウェブスクレイピング時のDOMセレクタを調べたり、 Q Accelerator などの Chrome 拡張機能を開発しています。 本記事では、次の３つを解説します。 1. Console の便利機能 2. 実際に Qiita の画面を解析する手順 3. リアルタイムで評価結果を返す Eager Evaluation （Google IO 2018 で発表されました） 便利機能（コマンド
Google Chrome の Developer Tool でイベントがデバッグしやすくなった - Qiita
はじめに 結論からいうと、 jQueryで設定されたクリックイベントなどを定義している場所を調べる方法 に記載されているようなことが Google Chrome の Developer Tool で簡単にできるようになった おそらく、Google Chrome 47.0.2526.80 で増えた機能。 とりあえず、最新バージョンを導入すれば機能追加されてるはず。 実際にデバッグしてみる 検証サイト 要素の検証 これクリックしたら、どんなことが起きるんだろうか…？ という場合はまず、右クリックとかショートカット使って要素を検証しましょう 今回は例として Create new user というボタンをクリックした時の処理をみてみます。 要素を検証したら、右の方に Event Listeners というタブがあるので選択します。 Ancestors とか Framework listeners
Google、ウザい広告はChromeで表示しなくなることを決定。広告に関する問題のレポートをSearch Consoleで公開
[レベル: 初・中・上級] ユーザー体験を損ねる広告を掲載しているサイトに対して、Chrome ブラウザでは広告を一切表示しなくなるようにすることを Google は発表しました。 これにあわせて、サイトに掲載している広告に問題があるかどうかを調べるツールの提供を始めました。 背景 Google が、こうした決定を今回下した背景の1つに、ユーザー体験を損ねる広告の増加が挙げられます。 いきなり大きな音楽で再生が始まる広告や記事を見る前に強制的に見せつけられる広告のような不愉快な広告は誰しもが体験したことがあるはずです。 広告そのものは悪いものではなく、健全な経済活動です。 広告閲覧者と広告発行者の双方にとってより良いオンライン広告を提供するために Coalition for Better Ads という団体が組織されています。 Coalition for Better Ads は消費者に受
Web制作者は使わないと損！Chrome 59でアップデートされたデベロッパーツールの便利な新機能
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
GitHub の Markdown (GFM) でPlantUMLを表示するChrome拡張 | DevelopersIO
よく訓練されたアップル信者、都元です。大変ご無沙汰しておりますが、相変わらず生魚が好きです。 さて最近は、GitHub上でもろもろとソフトウェア開発をしていることが多いのですが、gitで管理するmdファイルはもちろん、issueやPR内でもMarkdown記法を使って様々な記述できるのはご存知の通りかと思います。 PlantUML さて、仕様のディスカッションやドキュメントの記述をしていると、ちょっとしたシーケンス図やクラス図、状態遷移図、UMLという図の記法を使ってコミュニケーションを取りたい場面が出てきます。 以前、当ブログでも「Atom と PlantUML で快適シーケンス図駆動開発ライフ」というエントリーにて、テキストの文法でUMLを記述して画像生成、それをGitHubに貼り付ける、というテクニックをご紹介しました。 PlantUMLは非常に強力な仕組みです。Atomによる編集も
これは流行る！google chrome拡張機能・無料のHD画質の動画キャプチャーツール『loom』 | CriativeTips
デスクトップやアプリケーション、ブラウザの画面を友人や知人に見せたり、共有したりする事って結構ありますよね。また、ブログとかを書いている方でも、結構頻繁に画面キャプチャをしていると思います。 静止画の画像キャプチャなんかだと、私は『Nimbusスクリーンショット』というアプリを使っています。 静止画のキャプチャツールは探せば色々とあるんですが、動画のキャプチャが欲しい時にツールを探しても中々いいのが見つからなかったんです。（PCにインストールして使うものや、キャプチャ動画にクレジット表記が入ってしまうものなど） そんな中、久々に動画キャプチャーツールを探したら、手軽に使え、ロゴの表記も無し、画質もいい『loom』というキャプチャーツールを見つけたのでご紹介します。 『loom』の特徴 動画キャプチャはブラウザ以外にも起動しているアプリケーションも選択できるので、ゲーム画面のキャプチャをした
HTTP Headers という 5万人が使っている Chrome 拡張のマルウェア疑惑。セッション盗まれて BTC も盗まれそうになった話。 - clock-up-blog
疑惑どころか 99.99% くらい黒な話。 （後記：セッション盗まれたと思ってたけど、よくよく考え直してみると生パスワードごと盗まれてる可能性もあるしやばい） 追記：続報 11月3日 今回指摘した HTTP Headers 以外にも、「Tab Manager」「Give Me CRX」「Live HTTP Headers」等で同様（？）の問題が報告されています。第三者が元の作者からソフトウェア権利を買い取って悪用する、というケースが割とある模様（？）。皆さま情報ありがとうございます。 11月4日 Zaif については、「不正な Chrome 拡張」と「スクリプトから保護されていなかったクッキー」のコンボによりセッションが盗まれていた可能性あり。 Zaif のセッション情報が盗まれた原因のひとつについて。JavaScript からクッキー値を取得させない方法。 - clock-up-blog
Google グループ
Google グループでは、オンライン フォーラムやメール ベースのグループを作成したり、こうしたフォーラムやグループに参加したりすることで、大勢のユーザーと情報の共有やディスカッションを行うことができます。
VP9 is now available in WebRTC | Blog | Chrome for Developers
Two years ago Chrome enabled support for the VP9 codec. From Chrome 48 on desktop and Android, VP9 will be an optional video codec for video calls using WebRTC. While VP9 uses the same basic blueprint as previous codecs, the WebM team has packed improvements into VP9 to get more quality out of each byte of video. For instance, the encoder prioritizes the sharpest image features, and the codec now
Google グループ
Google グループでは、オンライン フォーラムやメール ベースのグループを作成したり、こうしたフォーラムやグループに参加したりすることで、大勢のユーザーと情報の共有やディスカッションを行うことができます。
Chrome 47 WebRTC: Media Recording, Secure Origins and Proxy Handling | Blog | Chrome for Developers
Chrome 47 includes several significant WebRTC enhancements and updates. Record video from your web apps The MediaStreamRecorder API has long been the top chromium.org request, with over 2500 stars. Media recording has now been added to Chrome behind the experimental Web Platform features flag — though it's desktop only for the moment. This allows you to record and play back or download video. Ther
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ブラウザにおけるWebRTCのロードマップ - Qiita
Here's a Workaround for Testing .Y4M Files in Chrome