Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
My Chrome Plugin
Search
Syo Igarashi
July 17, 2017
Technology
0
140
My Chrome Plugin
Syo Igarashi
July 17, 2017
Tweet
Share
More Decks by Syo Igarashi
See All by Syo Igarashi
2020冬開発合宿
igara
0
210
2019冬開発合宿
igara
0
92
2018夏開発合宿
igara
0
150
2018冬開発合宿
igara
0
1.2k
2017夏開発合宿
igara
0
200
Bariiiii
igara
0
110
2017冬合宿
igara
0
150
Other Decks in Technology
See All in Technology
サイボウズ 開発本部採用ピッチ / Cybozu Engineer Recruit
cybozuinsideout
PRO
10
73k
今日から始めるAmazon Bedrock AgentCore
har1101
4
400
コスト削減から「セキュリティと利便性」を担うプラットフォームへ
sansantech
PRO
3
1.3k
Bill One 開発エンジニア 紹介資料
sansan33
PRO
4
17k
SREじゃなかった僕らがenablingを通じて「SRE実践者」になるまでのリアル / SRE Kaigi 2026
aeonpeople
6
2.1k
フルカイテン株式会社 エンジニア向け採用資料
fullkaiten
0
10k
Introduction to Sansan for Engineers / エンジニア向け会社紹介
sansan33
PRO
6
68k
Embedded SREの終わりを設計する 「なんとなく」から計画的な自立支援へ
sansantech
PRO
3
2.2k
AWS Network Firewall Proxyを触ってみた
nagisa53
0
130
プロポーザルに込める段取り八分
shoheimitani
1
170
顧客との商談議事録をみんなで読んで顧客解像度を上げよう
shibayu36
0
170
マーケットプレイス版Oracle WebCenter Content For OCI
oracle4engineer
PRO
5
1.5k
Featured
See All Featured
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
141
34k
[RailsConf 2023] Rails as a piece of cake
palkan
59
6.3k
GraphQLの誤解/rethinking-graphql
sonatard
74
11k
Exploring the relationship between traditional SERPs and Gen AI search
raygrieselhuber
PRO
2
3.6k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
55
3.2k
The Curious Case for Waylosing
cassininazir
0
230
The Director’s Chair: Orchestrating AI for Truly Effective Learning
tmiket
1
96
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
52
5.8k
From Legacy to Launchpad: Building Startup-Ready Communities
dugsong
0
140
The Limits of Empathy - UXLibs8
cassininazir
1
210
A designer walks into a library…
pauljervisheath
210
24k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
31
2.7k
Transcript
僕のChrome拡張 五十嵐 翔
アジェンダ ・自己紹介 ・作成意欲 ・Chrome Extension ・作成のひとくふう ・Extensionの術 ・まとめなど
自己紹介 ・五十嵐 翔(いがらし しょう) ・お仕事 Web作成〜PHP、JavaScript ・趣味のプログラミング システムプログラミング学習〜Rust VR〜Unity、Mono C#
作成意欲 ・みんなブラウザ使っているならば ブラウザ内で使えるツールで楽になること あるのでは? ブラウザの操作を楽にできるツールとか 需要ありそう
Chrome Extension ・Chromeが提供しているAPIを使用して ブラウザの拡張を行う 拡張例)左クリック時に表示される メニューの追加とか manifestに記載できるpermission参照 https://developer.chrome.com/extensions/declare_permissions
作成のひとくふう ・IntelliSense強化 ・ただのJavaScriptでも TypeScriptの型定義ファイル使用して 補完強化 ライブラリのグローバル変数の補完など jQueryの「$」 Chrome Extensionなら「chrome」
None
作成のひとくふう ・IntelliSense強化 ・JSDocちゃんと書こ? コメントによる入力補完 functionのreturn、paramに型情報が あることで補完の恩恵受けることできる
None
Extensionの術 ・Element Jack 指定した箇所のElementを取得し、 DOMの変更など行わせる igara/XPathToolForChromeでは XPath(Elementの絶対位置)を取得し Select一覧変更ができるようになっている https://github.com/igara/XPathToolForChrome
Extensionの術 ・Basic Admin Passing Basic認証に失敗した時に 右クリックのメニューから 半強制的に認証成功させに行く ※igara/XPathToolForChromeにない機能 で紹介程度に記載
None
まとめなど ・background.jsとcontent_script.jsの イベントのはしごリレーが厄介 ブラウザで表示中のElementいじれるのは content_script.jsだけなのでどうしても sendMessage→content_scriptで受け取る やりとりが多発する
まとめなど ・自分のPC内のファイル操作に弱い Native Messaging使いこなせば 可能性ある? Native Messaging Chrome Extensionから 実行ファイルを呼び出すことができるAPI
https://developer.chrome.com/extensions/nativeMessaging
お し ま い