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
130
My Chrome Plugin
Syo Igarashi
July 17, 2017
Tweet
Share
More Decks by Syo Igarashi
See All by Syo Igarashi
2020冬開発合宿
igara
0
190
2019冬開発合宿
igara
0
84
2018夏開発合宿
igara
0
130
2018冬開発合宿
igara
0
1.1k
2017夏開発合宿
igara
0
180
Bariiiii
igara
0
110
2017冬合宿
igara
0
140
Other Decks in Technology
See All in Technology
オブザーバビリティ文化を組織に浸透させるには / install observability culture
mackerelio
0
150
Amazon Q Developerを活用したアーキテクチャのリファクタリング
k1nakayama
2
220
AWS DDoS攻撃防御の最前線
ryutakondo
1
170
家族の思い出を形にする 〜 1秒動画の生成を支えるインフラアーキテクチャ
ojima_h
3
1.3k
Amazon Qで2Dゲームを作成してみた
siromi
0
160
[kickflow]20250319_少人数チームでのAutify活用
otouhujej
0
140
生成AI活用のROI、どう測る? DMM.com 開発責任者から学ぶ「AI効果検証のノウハウ」 / ROI of AI
i35_267
3
110
形式手法特論:位相空間としての並行プログラミング #kernelvm / Kernel VM Study Tokyo 18th
ytaka23
3
1.5k
生成AIによるデータサイエンスの変革
taka_aki
0
3k
ZOZOTOWNの大規模マーケティングメール配信を支えるアーキテクチャ
zozotech
PRO
0
580
Serverless Meetup #21
yoshidashingo
1
130
20250807 Applied Engineer Open House
sakana_ai
PRO
2
540
Featured
See All Featured
A better future with KSS
kneath
239
17k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
358
30k
Writing Fast Ruby
sferik
628
62k
How STYLIGHT went responsive
nonsquared
100
5.7k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
667
120k
Bootstrapping a Software Product
garrettdimon
PRO
307
110k
Balancing Empowerment & Direction
lara
2
570
The Pragmatic Product Professional
lauravandoore
36
6.8k
Faster Mobile Websites
deanohume
309
31k
Typedesign – Prime Four
hannesfritz
42
2.8k
Six Lessons from altMBA
skipperchong
28
4k
The Cost Of JavaScript in 2023
addyosmani
53
8.8k
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
お し ま い