解決策をひとつ増やそう！ブラウザ拡張機能作成のススメ

2023/12/09
合同勉強会 in 大都会岡山 -2023 Winter-
https://gbdaitokai.connpass.com/event/299345/

Transcript

1. ղܾࡦΛͻͱͭ૿΍ͦ͏ʂ
   $ISPNF֦ுػೳ࡞੒ͷ
   εεϝ ߹ಉษڧձ
   JO
   େ౎ձԬࢁ
   
   8JOUFS લ઒ণ޾ɹ
2. ͸͡Ίʹ
3. ͜ͷ͓࿩ͷ໨త w ʮ֦ுػೳͰղܾͰ͖Δ΋ͷ͋Γͦ͏ʯ
   w ʮ֦ுػೳ࡞Εͦ͏ʯ
   w ʮ֦ுػೳ࡞ͬͯΈΔ͔ʯ
   w ʮ࡞֦ͬͨுػೳετΞʹެ։ͯ͠ΈΔ͔ʯʢ˞
   ͦ͏ͳΕ͹͍͍ͳʣ
4. ͓͠ͳ͕͖ w $ISPNF֦ுػೳͱ͸ʁ
   w ࣮ࡍʹ࡞ͬͨ΋ͷ঺հ
   w ΄΅࠷খߏ੒ͷ$ISPNF֦ுػೳ
   w ࡞੒࣌ͷ5JQTΛ͍͔ͭ͘
5. લ઒ণ޾ w ΢ΣϒΫϦΤΠλʔζχϡʔε؅ཧਓ
   w IUUQTXXXGBDFCPPLDPNHSPVQT
   w IUUQTUXJUUFSDPNXFCDSFJOGP
   w ઌ೔प೥ܴ͑·ͨ͠
   w $MBTTJגࣜձࣾ
   ιϑτ΢ΣΞΤϯδχΞ
   w ։ൃάϧʔϓ
   ϦʔμʔϓϩμΫτΦʔφʔ
6. $ISPNF֦ுػೳͱ͸ʁ
7. https://www.google.com/search?q=Chrome%E6%8B%A1%E5%BC%B5%E6%A9%9F%E8%83%BD%E3%81%A8%E3%81%AF%EF%BC%9F
8. https://chat.openai.com/share/98eb53e3-c9c0-4f32-8152-ba1ff4342d3a
9.     ࡞Γख໨ઢͩͱछྨ ˞
   େ෼ཚ๫ʹݴͬͯ·͢ ΢Σϒϖʔδͷ)5.-ʹ
   TDSJQUΛ௥Ճ͢Δ $ISPNFͷ"1*Λ࢖͏
   TDSJQUΛ૊ΈࠐΉ
10.   ࡞Γख໨ઢͩͱछྨ ˞
    େ෼ཚ๫ʹݴͬͯ·͢ ΢Σϒϖʔδͷ)5.-ʹ
    TDSJQUΛ௥Ճ͢Δ ͪ͜ΒͷΞϓϩʔνͩͱ
    ඇৗʹෑډ͕௿͍
11. ࣮ࡍʹ࡞ͬͨ΋ͷ঺հ
12. (PPHMF
    .FFU
    $IBU
    $MJQCPBSE w $MBTTJࣾ಺Ͱͷʮ.FFUͷνϟοτͷอଘ๨ΕͨʂʯΛड͚ͯ
    w ίϐʔϘλϯͷ௥Ճ
    w ୀग़ϘλϯԡԼ࣌ʹΫϦοϓϘʔυʹࣗಈͰอଘ
    w λϒΛด͡Δ࣌ʹμΠΞϩά
    w ʢࣾ಺Ͱ͸ʣര΢έ https://chromewebstore.google.com/detail/google-meet-chat-to-clipb/djoaekihkgkgcgckfjakaekoiplcpoec?hl=ja
13. ΢Σϒϖʔδͷ)5.-ʹTDSJQUΛ௥Ճ͢Δ  
14. ଞʹ΋ετΞެ։͠ͳ͍ۀ຿ิॿ֦ுػೳ w ϝʔϧ഑৴4BB4ͷʮબΜ͡Ό͍͚ͳ͍ϥδΦϘλϯʯແޮԽ
    w จॻ؅ཧ4BB4͔Β಺༰Λύʔεͯࣾ͠಺γεςϜ΁ͷϦϯΫੜ੒
    w ςεταΠτͱຊ൪αΠτΛಉҰύεͰӾཡ͢Δ
15. ΄΅࠷খߏ੒ͷ$ISPNF֦ுػೳ w IUUQTHJUIVCDPNNBFQPONJOFYUFOTJPO
    w )5.-΁ͷ4DSJQU௥Ճํࣜͷʢ΄΅ʣ࠷খߏ੒
16. DISPNFFYUFOTJPOT σϕϩούʔϞʔυʹνΣοΫΛೖΕΕ͹ɺ
    ϑΥϧμΛ֦ுػೳͱͯ͠ಡΈࠐΊ·͢ɻ
17. NBOJGFTUKTPO { "manifest_version": 3, "name": "࠷খݶͷChrome֦ுػೳ", "version": "1.0", “description": "ϖʔδ্ͷHTMLΛมߋ͢Δ࠷খݶͷChrome֦ுػೳ", "content_scripts": [ { "matches": ["<all_urls>"], "js": ["content.js"] } ] } ఆٛɾઃఆϑΝΠϧ
18. NBOJGFTUKTPO { "manifest_version": 3, "name": "࠷খݶͷChrome֦ுػೳ", "version": "1.0", “description": "ϖʔδ্ͷHTMLΛมߋ͢Δ࠷খݶͷChrome֦ுػೳ", "content_scripts": [ { "matches": ["<all_urls>"], "js": ["content.js"] } ] } ఆٛɾઃఆϑΝΠϧ શͯͷ΢ΣϒϖʔδͰɺ
    DPOUFOUKTΛద༻͢Δ
19. DPOUFOUKT // content.js // ϖʔδ্ͷςΩετΛมߋ document.body.innerText = "Hello, Chrome֦ுػೳ!"; // ུ ࣮ߦϑΝΠϧ
20. DPOUFOUKT // content.js // ϖʔδ্ͷςΩετΛมߋ document.body.innerText = "Hello, Chrome֦ுػೳ!"; // ུ ࣮ߦϑΝΠϧ ڟѱ͗͢Δ
21. DPOUFOUKT // content.js // ϖʔδ্ͷςΩετΛมߋ // document.body.innerText = "Hello, Chrome֦ுػೳ!"; // DomContentLoad࣌ʹaλάͷtargetଐੑΛ࡟আ͢Δ function removeTarget() { const links = document.querySelectorAll('a[target]'); links.forEach((link) => { link.removeAttribute('target'); }); setTimeout(removeTarget, 500) } removeTarget(); ࣮ߦϑΝΠϧ
    ϖʔδ಺શͯͷUBSHFUଐੑ ΛSFNPWF͢Δ
22. NBOJGFTUKTPO { "manifest_version": 3, "name": "࠷খݶͷChrome֦ுػೳ", "version": "1.0", “description": "ϖʔδ্ͷHTMLΛมߋ͢Δ࠷খݶͷChrome֦ுػೳ", "content_scripts": [ { "matches": ["https://maepon.blog*"], "js": ["content.js"] } ] } ఆٛɾઃఆϑΝΠϧ
    ద༻͢ΔαΠτ͸ࢦఆͨ͠ํ ͕ແ೉Ͱ͢
    ʢਖ਼نදݱ͸࢖͑ͳ͍͸ͣʣ
23. +BWB4DSJQUॻ͚Ε͹
    ͳΜͱ͔ͳΔ
    ؾ͕͖ͯ͠·ͤΜʁ
24. ࡞੒࣌ͷ5JQTΛ͍͔ͭ͘ w DPOUFOUKT͕ಡΈࠐ·ΕΔͷ͸%0.$POUFOU-PBEFEͷޙ
    w MPDBM4USBHFී௨ʹ࢖͑·͢ɻͨͩ͠ϖʔδͷυϝΠϯͷΈ
    w υϝΠϯΛ·͍ͨ͗ͨ৔߹͸ɺ$IPSNF"1*Λར༻͢Δ
    w 41"తͳͷ͸.VUBUJPO0CTFSWFSʹͱͯ΋ੈ࿩ʹͳΓ·͢
    w ࣌ʹ͸JOUFSWBMճ͢͜ͱ΋ʜ
25. ؾΛ͚ͭΔ͜ͱ w 6*͍͡Δܥ͸%0.ΛͳΜͱ͔ηϨΫλۦ࢖ͯ͠ཁૉΛ௫Ή
    w ͭ·ΓΫϥε໊มΘͬͨΒಈ͔ͳ͘ͳͬͨΓ
    w ͜Ε͹͔Γ͸Ͳ͏͠Α͏΋ͳ͍
    w ηϨΫλͷৄࡉ౓ΛͲΕ͚ͩখ͘͞Ͱ͖Δ͔ͷউෛ
    w ͱ͸͍͑ؤுͬͨͱ͜ΖͰɺͷੈքͰ͸͋Δ
26. ͥͻ4UPSFެ։Λ w ޿͘࢖ͬͯ΋Βͬͯ΋ྑ͍ͳɺͱ͍͏΋ͷ͸ੋඇετΞެ։Λ
    w $ISPNFͷετΞ͸Λճ෷͑͹σϕϩούʔʹͳΕ·͢
    w ΞΠίϯ΍ΞΠΩϟονը૾͕ඞཁɻ͕Μ͹Εʂ
    w &EHFͷ֦ுػೳετΞ΋͋Γ·͢
    w ͪ͜Β͸ແྉʢͰ΋$ISPNFΑΓෑډߴ͍ײ͡ʣ
27. ͋Γ͕ͱ͏͍͟͝·ͨ͠