Chromeで特定サイトのみプロキシ経由でアクセスする拡張機能Proxy SwitchyOmega - Qiita
Chromeで特定サイトのみプロキシ経由でアクセスする拡張機能Proxy SwitchyOmega この拡張機能を使用すると、特定のルールにマッチしたサイト・ページのみ、プロキシ経由でアクセスできます。 管理者用の画面のみIPアドレスによるアクセス制限をしているWEBアプリケーションでは、プロキシサーバとこの拡張機能を使用すれば、どこからでもアクセスできます。 ルールを作成せずに手動でプロキシ経由に切替えることもできます。 複数のプロキシサーバを使い分けることも簡単にできます。 使用するプロキシサーバは自分で用意してください。 Proxy SwitchyOmegaの導入方法 以下のリンクをChromeで開いて拡張機能を追加 Proxy SwitchyOmega Proxy SwitchyOmegaの使い方 拡張機能を追加するとChromeの右上にアイコンが表示されます。青丸で囲ったアイコン
Dockerで手軽にスクレイピング環境を手に入れる - Qiita
この記事は Docker Advent Calendar 2017 の1日目の記事です。 こんにちは。Emotion Techの子安です。すっかり冬ですね。今日は夜の銀座からお送りします。 なんでもDockerで Dockerに触れるようになって約2年ほど経ちました。最近は技術検証はもちろん、何かをちょっと試したいときなども、新しい環境が必要になるとまずはDockerで構築してみることが当たり前に（自分的には）なってきています。 で、今回はWebからちょこっと何か取ってきたいとき、いわゆるスクレイピングをしたいとき、Dockerがあれば簡単に環境が作れるぞという話をします。 ※なお、スクレイピングは用法・用量を守って正しく行いましょう。あくまで自己責任でお願いしますね。 要件 とあるサイトから情報を抜き出したい ブラウザを操作してサイトを巡回する Docker上に構築する プログラミング言
Headless ChromeをDocker上で動かして、E2Eのテスト - Qiita
この記事はGunosy Advent Calendar 2017の14日目の記事です。 昨日は@harahenikuさんのGoを遅くしないための地味な話でした。 広告技術部の@hoshitocatです。 主な業務はRailsで広告の入稿やレポートのための管理画面の開発をしております。たまにGoで配信側のAPIを触ることがあります。 今回は管理画面でChromeのHeadlessモードを使ったE2Eのテストを導入した話をします。 PhantomJSからChromeへ 私たちはこれまでE2EのテストをPhantomJSを使っていました。 しかし、Javascriptの動作も含めたテストを書いている際に、includes()がPhantomJSだと動作しないことがわかりました。 プロダクトコードをテストコードに合わせて書き直すことも考えましたが、それでは新しく使えるようになった便利な機能をいつま
UnityからSFSafariViewController/Chrome Custom Tabsを開く - Qiita
#■概要 iOS/Androidアプリ開発においてUIWebViewが事実上非推奨になり、iPhoneの場合は「SFSafariViewController」、Androidの場合は「Chrome Custom Tabs」の利用が推奨されています。しかし僕が調べた範囲では、それらをUnityから利用する方法がまとまった情報として存在していなかったため、以下にまとめました。 SFSafariViewController自体の情報は、iOS9からの機能ということもありとても充実していますが、サンプルコードのほとんどがSwiftで書かれており、UnityのC#からはSwiftコードを直接呼び出せないためそのままでは参考にならなかったり、Chrome Custom Tabsもそれ自体の情報は沢山あるのですが、利用するためにはUnityのレガシーなビルドシステムからはアクセスできないbuild.gr
ヘッドレスChromeをもっとも簡単に操作できると思われるNightmareJS風ライブラリ - Qiita
Chrome59(2017/05/27現在はベータ)から--headlessオプションを使うことでChromeをヘッドレスブラウザとして使えます。これをNodeJSから操作するにはchrome-remote-interfaceというNPMパッケージを使うのですが、そのままですとなかなか面倒です。そこで、NightmareJS風にヘッドレスChromeを操作することができるライブラリをご紹介します。 GitHub: https://github.com/OnetapInc/chromy 基本的な使い方 このようにNightmareJS風のメソッドチェーンで操作することができます。visibleオプションを指定すればヘッドレスモードではなく通常モードでChromeを起動することもできます。 Chrome本体は標準的なインストールをしていれば自動的に最も新しいChromeを探してそれを起動します
AngularJSのチュートリアルで躓いたE2Eテストの対応 - Qiita
AngularJSのチュートリアルを進めていたのですが、途中E2Eテストのところでエラーになりました。 あまり日本語での対応話がなかったので書きました。 エラー内容 エラー内容は以下 npm verb pkgid angular-phonecat@0.0.0 npm verb cwd /Users/*/angular-phonecat npm ERR! Darwin 14.3.0 npm ERR! argv "/usr/local/bin/node" "/usr/local/bin/npm" "run" "protractor" npm ERR! node v0.12.6 npm ERR! npm v2.11.2 npm ERR! code ELIFECYCLE npm ERR! angular-phonecat@0.0.0 protractor: `protractor test/pro
2016年度版 僕が考えたChrome拡張機能を作るときのデザインパターン - Qiita
4年近く前の2012年に僕が考えたChrome拡張機能を作るときのデザインパターンというエントリを書きました。最近参加したイベントで「よういちろうさんの拡張機能の記事見て作ってみました〜」と声をかけてくれた人がいて嬉しかったのですが、2012年のそのエントリは、すでに内容が古くなってしまっています。最近の状況を踏まえて、内容を新しくした「2016年度版」を書いてみようと思います。 変更しようと思った点は、以下です。 prototype.jsは使わず、ECMAScript 2015で書く。 Background Page(常駐型)ではなく、Event Page(非常駐型)にする。 そもそも最初のコードセットは自分で書かない。 本文やコード的には、2012年度版をコピペしています。 （この投稿の内容は、自分のブログエントリと同じです。） 前にいくつかのChrome拡張機能を作っていて、すでに数
白い画面恐怖症患者のためのChrome系ウェブブラウザーの処方箋 - Qiita
導入 こんばんは、白い画面恐怖症患者です。 眩しい＞＜ こんなに眩い白い画面ではソフトウェア開発どころか趣味のお茶や盆栽の情報収集もままなりませんね＞＜ 癒やされますね、闇に。ﾌﾌﾌﾌﾌﾌ…ヽ(´ー｀)ノ ・・・ところが、最近 Facebook が投稿時に投稿フォームの外側を"暗転"させるエフェクトを導入しました。つまり、↑のように画面を闇モードにしている方は逆に"明転"させられてしまいます。 ぁぁっ・・まぶ・・し・・ぃ・・(｡ŏ﹏ŏ) と、いうわけで、こうした症状をお持ちの方への処方箋を比較的この手の患者さんが多いと思われる Qiita へ、プログラミング Tips というよりはウェブブラウザーというツールの Tips あるいは CSS ではありますが書いて置こうと思います。 闇のプログラマーの目と精神が光の眩しさから守られるお役に立てば幸いです。 概要 Chrome系ウェブブラウザーで
TypeScript での Chrome 拡張機能開発 Tips - Qiita
はじめまして、こんにちは、水音ぴねといいます。高知で大学生してます。 今回は、私が TypeScript を使って Google Chrome 拡張機能を作る上で見つけたことを書いていきたいと思います。 少々長くなりすぎた感があります。必要なところを、つまみ食いしてください。 前置き Google Chrome 拡張機能とは ? Google Chrome の機能を拡張するソフトウェアで、Web の技術 (JavaScript / HTML / CSS) 使って作ります。そして、一般的に Chrome 拡張機能と呼ばれるものには、大きく分けて以下の二種類があります。 拡張機能 アプリ (chrome://apps/ に表示されるもの) 「拡張機能」は、ブラウザの UI を拡張したり、ウェブページの内容を書き換えたりするものを指します。「アプリ」は、Chrome の API を使ったアプリケ
YeomanでChrome Extension開発環境を簡単作成 - Qiita
[?] What would you like to call this extension? my-first-extension [?] How would you like to describe this extension? My Chrome Extension [?] Would you like to use UI Action? No [?] Would you like to use the Options Page? No [?] Would you like to use the Omnibox? (Please input keyword) [?] Would you like to use the Content Scripts (Not Programmatic)? Yes [?] Would you like to use permissions? Yes
JavaScript Promiseの実行順序(Firefox31とChrome37で違うけどどっちが正しい？) - Qiita
JavaScript Promiseの実行順序(Firefox31とChrome37で違うけどどっちが正しい？)JavaScript var p = new Promise(function(fulfill, reject){ console.log("start"); fulfill(""); }); p.then(function(result){ console.log("1-1"); }).then(function(result){ console.log("1-2"); }).then(function(result){ console.log("1-3"); }); p.then(function(result){ console.log("2-1") }).then(function(result){ console.log("2-2"); }).then(function
Cross-OriginでWebフォントを使うとき注意すべきこと - Qiita
皆さん、Webフォント使ってますか？ Qiitaでも有名なアイコンフォントが使われてますね。FontAwesomeです。 今のところStableだとかBetaのChromeでQiitaを見ても何の問題も無いでしょう。(今回の辺りでは。) しかし、うちのChrome(38)ではこのようになってしまいます。 見事に豆腐です。 Why? ここでDevツールを開いてエラーログを見てみましょう。 そう。QiitaのFontAwesomeはcdn.qiita.comと言うCDNを経由して配信されていたんですね。でもChrome38以降のBlinkではフォントに対してもOriginチェックがあるらしい… ちなみに このことはChrome37までで既に予告されてたんですね。(手元にあったのがChromium37だったのでそれ以前のは確認できてませんが。) まとめ CDNとか経由してフォント配信する際はクロ
フロントエンドエンジニアになってから11ヶ月間で覚えたちょっと捗るChromeの使い方 - Qiita
はじめに 昨今のWebブラウザはどのような機能があるのか把握するのも大変なほど多機能で便利ですよね。 Webブラウザの機能を把握してうまく使いこなせること（とくに開発者ツール）が、フロントエンドエンジニアの前提スキルになってきてるのかなぁと感じる今日この頃です。 ということで自分のデフォルトの開発用ブラウザはChromeなのですが、これを覚えて捗ったなぁということをメモしていこうと思います。 思い浮かんだら追記していこうと思っているのでストックして頂けると幸いです。 基本系 キーボードショートカットを覚える Chromeのキーボードショートカットの一覧 キーボードで出来ることはなるべくキーボードでやるけれども、マウスやトラックパッドでやったほうが速い場合は臨機応変に切替えることを心がけています。 Chrome Canaryを使う Chromeの開発者向けプレビュー版 Chrome Cana
[最速] HTTP/2 で Hello World! するまでの手順 - Qiita
2014年6月にHTTP/2の13番目のドラフトが公開され、来年にはRFC化の見通しとのことでHTTP/2の機運が高まってきています。 HTTP/2の世界を体感すべく、HTTP/2プロトコルでHello World!を表示するまでの手順をまとめました。 最速と名をうちましたが実のところそこそこ長い道のりですので予めご了承ください。 方針 簡単と思われる方法を探した結果、以下の構成にしました。 クライアント 2014年7月現在、Google ChromeではHTTP/2を有効にすることはできませんが、Chromeの開発版であるChrome Canaryを使えばHTTP/2を有効できます。 Mac Book ProにChrome Canaryをインストールします。CanaryはChromeの開発版でMac用のdmgパッケージが提供されているのでインストールは簡単です。 なお、クライアントはng
![[最速] HTTP/2 で Hello World! するまでの手順 - Qiita](https://cdn-ak-scissors.b.st-hatena.com/image/square/ae5d7eda850f1b4aa7f24f7253e3b6e3010bbb90/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Farticle-ogp-background-412672c5f0600ab9a64263b751f1bc81.png%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk3MiZoPTM3OCZ0eHQ9JTVCJUU2JTlDJTgwJUU5JTgwJTlGJTVEJTIwSFRUUCUyRjIlMjAlRTMlODElQTclMjBIZWxsbyUyMFdvcmxkJTIxJTIwJUUzJTgxJTk5JUUzJTgyJThCJUUzJTgxJUJFJUUzJTgxJUE3JUUzJTgxJUFFJUU2JTg5JThCJUU5JUEwJTg2JnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnR4dC1jb2xvcj0lMjMyMTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9NTYmcz1mYzdlYTE4NGM3MjU5Yjg0YThjOTQ5NTU0OTQ2NzkyOQ%26mark-x%3D142%26mark-y%3D57%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZoPTc2Jnc9NzcwJnR4dD0lNDBuaWt1c2hpJnR4dC1jb2xvcj0lMjMyMTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9MzYmdHh0LWFsaWduPWxlZnQlMkN0b3Amcz01OTIxZGQ1N2ZiYjZhOWU2MmYxMTNlYzQyMGYzMDJiNQ%26blend-x%3D142%26blend-y%3D486%26blend-mode%3Dnormal%26s%3D1aa9f5d89fcd2eee5c32f47a4620da31)
GitHub を使いやすくする Chrome Extension 5 選 - Qiita
Pretty Pull Requests (Github) Chromeウェブストア - Pretty Pull Requests (Github) Pull Request を読むときに便利なエクステンション。 ファイルをアコーディオンで開閉したり、追加された行または削除された行のみを表示することができる。 長い PR を読むときに特に便利。 GitHub Wiki Search Chromeウェブストア - GitHub Wiki Search GitHub Wiki を検索するためのエクステンション。シンプルで使いやすい。 検索語をハイライトしてくれたり、検索中はプログレスバーがでたりと気が効いている。 これを使わずに検索しようとすると GitHub Wiki の git リポジトリをクローンして、 git grep するはめになる。 GitHub.Expandinizr Chrom
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Dockerを使ってHeadless Chromeを動かしてみる - Qiita