ॳΊͯͷ-5ձ LPIFJUBLBIBTIJ "DUJPO$BCMFΛ࢖ͬͯ ෼ใػೳΛ࣮૷͍ͯ͠·͢

ࣗݾ঺հ "DUJPO$BCMFͷੈք؍ ͲͷΑ͏ʹ࣮૷͍ͯ͠Δͷ͔ ·ͱΊ ࢀߟαΠτ ˞Ͱ͖Δ͚ͩਖ਼֬ͳ಺༰Λ఻͑ΔΑ͏ʹ৺͕͚ͯ·͕͢ɺؒҧͬͨ಺༰Λ࿩ͯͨ͠Β͍͢·ͤΜ ˞ͦͷࡍ͸ڭ͑ͯͩ͘͞Δͱେม༗೉͍Ͱ͢ ͜ͷൃදͷ಺༰

LPIFJUBLBITIJ ߴڮߤฏ ࡀ ஍ํͷେֶӃͰྟচ৺ཧΛษڧ͍͕ͯͨ͠ɺ࠳ંͯ͠ϓϩάϥϛϯάʹͨ·ͨ·ग़ձ͏ ͨ·ͨ·'+03%#005$".1Λݟ͚ͭɺ೥݄ʹೖձ ೥݄͔Βबۀ༧ఆ झຯ͸ϘʔυήʔϜͱಡॻͱԹઘ ݈߁ϥϯυ ࠓ͸εΫϥϜ։ൃͱࣗ࡞ΞϓϦ։ൃʹऔΓ૊ΜͰ͍·͢ ࣗݾ঺հ

෼ใػೳΛ࣮૷த ࣗ෼΍ଞͷਓͷ౤ߘΛݟΔͨΊʹɺҰճҰճϖʔδΛϦ ϩʔυͨ͘͠ͳ͍ɻ ͦͷͨΊɺϖʔδϦϩʔυͳ͠ͰϦΞϧλΠϜʹ౤ߘɺฤ ूɺ࡟আ͕දࣔ͞ΕΔΑ͏ʹ͍ͨ͠ɻ ͦͷϦΞϧλΠϜදࣔΛ࣮ݱ͢ΔͨΊʹ 伴ͱͳͬͯ͘Δͷ͕૒ํ޲௨৴

૒ํ޲௨৴Λ࣮ݱ͢ΔͨΊʹ 3BJMT͕ఏڙ͍ͯ͠ΔϑϨʔϜϫʔΫ͕ "DUJPO$BCMF

Ұ౓ίωΫγϣϯཱ͕֬͞ΕΔͱɺઐ༻ͷϓϩτίϧ্Ͱ΍ΓͱΓΛߦ͏Α͏ʹͳΓ·͢ɻ͜ ΕʹΑΓɺແཧͳ͘૒ํ޲௨৴͕Ͱ͖ΔΑ͏ʹͳΓ·ͨ͠ɻ "DUJPO$BCMFͰ͸8FC4PDLFU௨৴͕Ͱ͖Δ )551ίωΫγϣϯ 8FC4PDLFUίωΫγϣϯ

ΫϥΠΞϯτ͕αʔόʔʹϦΫΤετΛૹΓɺͦΕʹԠ౴ͯ͠ɺαʔόʔଆ͕ϨεϙϯεΛฦ ͢͜ͱ͕લఏͷͨΊɺϦΫΤετͳ͠Ͱαʔόʔଆ͕ೳಈతʹσʔλΛૹΔ͜ͱ͕Ͱ͖·ͤΜ Ͱͨ͠ɻ 9.-3FRVFTU௨৴Ͱ͸ ϦΫΤετ Ϩεϙϯε

$PNFU௨৴Ͱ͸ ͦ΋ͦ΋)551ίωΫγϣϯ͸ɺϦΫΤετΛૹͬͯϨεϙϯε͕ฦ͖ͬͯͨΒΫ ϩʔζ͢ΔͨΊɺ͜ΕΛҙਤతʹΫϩʔζͤ͞ͳ͍͜ͱͰɺ૒ํ޲௨৴Λ࣮ݱ͠Α͏ ͱͨ͠ͷ͕$PNFU௨৴Ͱ͢ɻ )551ίωΫγϣϯͷຊདྷͷ࢖͍ํͱ͸ҟͳΔͨΊɺཪٕతͳ΋ͷͷΑ͏Ͱ͢ɻ )551ίωΫγϣϯ

"DUJPO$BCMFͷੈք؍

"DUJPO$BCMFͷੈք؍ 8FC4PDLFUίωΫγϣϯ DPOTVNFS DIBOOFM EBUB ΫϥΠΞϯτ αʔόʔ

8FC4PDLFUίωΫγϣϯͷத 8FC4PDLFUίωΫγϣϯ DIBOOFM EBUB DPOTVNNFS͕DIBOOFMʹೖΓɺσʔ λड͚औΓՄೳঢ়ଶʹͳΔ͜ͱΛ TVCTDSJCFͱ͍͏ DPOTVNFS EBUB͕DIBOOFMʹૹΒΕͯɺ DPOTVNFS͕डऔՄೳঢ়ଶʹͳΔ͜ͱΛ CSPBEDBTUͱ͍͏

ݱஈ֊ͷ෼ใػೳΛ͓ݟͤ͠·͢

͜Ε͸ͲͷΑ͏ʹ࣮૷ͨ͠ͷ͔

෼ใϖʔδΛ։͍ͨ࣌ͷॲཧͷྲྀΕ 7VFίϯϙʔωϯτ UJNFMJOFT@DIBOOFMWVF UJNFMJOFWVF 7VFKTଆ 3BJMTଆ BQQDIBOOFMT DIBOOFMSC DPOOFDUJPOSC BQQMJDBUJPO@DBCMF UJNFMJOFT@DIBOOFMSC ᶆαϒεΫϥΠϒ͞ΕͨΒɺ աڈͷ෼ใҰཡͷσʔλΛૹΔ ᶃίϯϙʔωϯτ͕DSFBUF͞Εͨ࣌ʹ 8FC4PDLFUίωΫγϣϯΛ࡞Ζ͏ͱ͢Δ ᶄDVSSFOU@VTFSͳΒ ίωΫγϣϯΛཱ֬͢Δ ᶅίωΫγϣϯཱ͕֬͞ΕͨΒ αϒεΫϥΠϒ͢Δ

7VFίϯϙʔωϯτ UJNFMJOFT@DIBOOFMWVF UJNFMJOFWVF 7VFKTଆ 3BJMTଆ BQQDIBOOFMT DIBOOFMSC DPOOFDUJPOSC BQQMJDBUJPO@DBCMF UJNFMJOFT@DIBOOFMSC

8FC4PDLFUίωΫγϣϯͷཱ֬ʹؔ͢Δॲཧ Λهड़͍ͯ͠·͢ɻ ͜͜Ͱ͸ɺJEFOUJGJFE@CZͰ8FC4PDLFUίω ΫγϣϯʹJEΛ༩͍͑ͯ·͢ɻ ͜͜Ͱ͸ɺDVSSFOU@VTFSΛίωΫγϣϯͷJE ʹ͍ͯ͠·͢ɻ DPPLJF͔ΒDVSSFOU@VTFSͷ৘ใΛಡΈऔͬ ͍ͯ·͢ɻ΋͠ɺDPPLJFʹDVSSFOU@VTFSͷ ৘ใ͕ͳ͚Ε͹ɺίωΫγϣϯΛཱ֬͠·ͤ Μɻ DPOOFDUJPOSCΛݟ͍ͯ͘ ۩ମతͳίʔυ͕ཉ͍͠ module ApplicationCable class Connection < ActionCable::Connection::Base identified_by :current_user def connect self.current_user = find_verified_user end private def find_verified_user if verified_user = User.find_by(id: store["user_id"]) verified_user else reject_unauthorized_connection end end def store cookies.encrypted[Rails.application.config.session_options[:key]] end end end

7VFίϯϙʔωϯτ UJNFMJOFT@DIBOOFMWVF UJNFMJOFWVF 7VFKTଆ 3BJMTଆ BQQDIBOOFMT DIBOOFMSC DPOOFDUJPOSC BQQMJDBUJPO@DBCMF UJNFMJOFT@DIBOOFMSC

"DUJPO$BCMFͷDIBOOFMʹ͓͚Δ DPOUSPMMFSͷ໾ׂΛ୲͍·͢ɻ ͦͷͨΊɺ$36%ͷॲཧΛهड़ͯ͠· ͢ɻ σʔλΛϒϩʔυΩϟετ͢Δ͜ͱͰɺ νϟωϧʹσʔλΛૹΓ·͢ɻ ·ͨɺαϒεΫϥΠϒͨ࣌͠΍ɺαϒε ΫϥΠϒ͕ऴΘͬͨ࣌ͷॲཧΛॻ͖· ͢ɻ ͜͜Ͱ͸ɺαϒεΫϥΠϒͨ࣌͠ʹɺա ڈͷ෼ใҰཡΛૹΔΑ͏ʹ͍ͯ͠·͢ɻ UJNFMJOFT@DIBOOFMSCΛݟ͍ͯ͘ ۩ମతͳίʔυ͕ཉ͍͠ class TimelinesChannel < ApplicationCable::Channel include Rails.application.routes.url_helpers def subscribed stream_from "timelines_channel" timelines = Timeline.order(created_at: :asc) transmit({ event: "timelines", current_user: format_current_user, timelines: format_timelines(timelines) }) end def unsubscribed # Any cleanup needed when channel is unsubscribed end def create_timeline(data) @timeline = Timeline.create!(user_id: current_user.id, description: data["description"]) ActionCable.server.broadcast "timelines_channel", { event: "create_timeline", timeline: format_timeline(@timeline) } end def update_timeline(data) @timeline = Timeline.find_by(id: data["id"]) @timeline.update(description: data["description"]) ActionCable.server.broadcast "timelines_channel", { event: "update_timeline", timeline: format_timeline(@timeline) } end def delete_timeline(data) @timeline = Timeline.find_by(id: data["id"]) @timeline.destroy ActionCable.server.broadcast "timelines_channel", { event: "delete_timeline", timeline: format_timeline(@timeline) } end end

7VFίϯϙʔωϯτ UJNFMJOFT@DIBOOFMWVF UJNFMJOFWVF 7VFKTଆ 3BJMTଆ BQQDIBOOFMT DIBOOFMSC DPOOFDUJPOSC BQQMJDBUJPO@DBCMF UJNFMJOFT@DIBOOFMSC

෼͔Γ΍͍͢Α͏ʹҰ෦ൈਮͱɺվมΛߦ͍ͬͯ ·͢ɻ ͜͜ʹɺϑϩϯτΤϯυଆͷUJNFMJOF@DIBOOFM ʹؔ͢Δ৘ใ͕·ͱ·͍ͬͯ·͢ CSPBEDBTU͞Εͨσʔλ͸\BDUJPODSFBUF UJNFMJOF!UJNFMJOF^ͳͲͷܗͰૹΔΑ͏ʹ͠ ͍ͯ·͢ɻ ͦ͜Ͱɺड͚औͬͨσʔλͷBDUJPO͕ͳΜͳͷ ͔ͰɺॲཧΛม͑ΔΑ͏ʹ͍ͯ͠·͢ɻ UJNFMJOFTDIBOOFMWVFΛݟ͍ͯ͘ this.timelinesChannel = this.$cable.subscriptions.create("TimelinesChannel", { connected: () => { console.log('connected successfully') }, disconnected: () => { }, received: (data) => { switch (data.event) { case 'timelines': data.timelines.forEach((timeline) => { this.timelines.unshift(timeline) }) break case 'create_timeline': this.timelines.unshift(data.timeline) break case 'update_timeline': this.timelines.forEach((timeline) => { if (timeline.id === data.timeline.id) { timeline.description = data.timeline.description } }) break case 'delete_timeline': this.timelines.forEach((timeline, i) => { if (timeline.id === data.timeline.id) { this.timelines.splice(i, 1) } }) break } } })

"DUJPO$BCMFͷੈք؍Λ௫Ήͷ͕ͱͯ΋େมͰͨ͠ɻͦ͜ͰɺͦͷഎܠͱͳΔ8FC4PDLFU ͷ֓ཁΛֶͿ͜ͱͰɺͣͬͱཧղ͠΍͘͢ͳΓ·ͨ͠ɻ +BWB4DSJQUଆͰDIBOOFMͰఆٛ͞ΕͨϝιουΛݺ΂ͨΓɺϝιουҰͭͰɺσʔλΛૹΕ ͨΓ͢ΔͷͰɺ3BJMTͱ7VFKTͷσʔλͷ΍ΓऔΓ͕ൺֱత؆୯ʹͰ͖·ͨ͠ɻ खܰʹϦΞϧλΠϜͷΞΫγϣϯ͕࣮૷Ͱ͖ΔҰํͰɺগ͠खͷࠐΜͩ͜ͱΛ΍Ζ͏ͱ͢Δ ͱɺͱͯ΋ϋϚΓ·ͨ͠ ࣗ෼ͷྗෆ଍ͳ͚ͩͰ͕͢ʜ ɻ ͋ͱগ͠Ͱ13Λग़ͤΔͷͰ͕͢ɺͦͷগ͠ͷͱ͜ΖͰ֨ಆதͰ͢ɻ ۩ମతʹͲΜͳͱ͜ΖʹϋϚͬͨͷ͔ɺۤ͠Μͩͷ͔͸ޙ೔ϒϩάʹॻ͖͍ͨͱࢥ͍·͢ɻ ·ͱΊ

3BJMTΨΠυd"DUJPO$BCMFͷ֓ཁd IUUQTSBJMTHVJEFTKQ BDUJPO@DBCMF@PWFSWJFXIUNM 8FC4PDLFU IUUQTKBXJLJQFEJBPSHXJLJ8FC4PDLFU ࣮ࡍͷ13͸ͪ͜Β IUUQTHJUIVCDPNGKPSEMMDCPPUDBNQQVMM ࢀߟʹ͍͍ͤͯͨͩͨ͞αΠτ౳

͝੩ௌ༗Γ೉͏͍͟͝·ͨ͠