Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Speaker Deck
PRO
Sign in
Sign up for free
クラウドを活用した WebRTC コールセンターの最前線
Kiminari Homma
September 17, 2016
Technology
3
2.9k
クラウドを活用した WebRTC コールセンターの最前線
http://softlayer.connpass.com/event/34524/
での登壇スライド
Kiminari Homma
September 17, 2016
Tweet
Share
More Decks by Kiminari Homma
See All by Kiminari Homma
Twilio Meetup 東京 2022/11/11
honkimi
0
3
Twilio iOS 徹底攻略
honkimi
1
480
2021年 Twilio Voice 報告
honkimi
0
140
WebRTC ビジネスの失敗と成功
honkimi
2
1.1k
最近の Twilio トレンド報告
honkimi
0
240
Twilio Meet Up
honkimi
0
56
利用ユーザーからみた Twilio の紹介
honkimi
0
35
Zendesk App を Heroku で作ってみた話
honkimi
0
60
国内における Twilio x Alexa
honkimi
0
590
Other Decks in Technology
See All in Technology
KyvernoとRed Hat ACMを用いたマルチクラスターの一元的なポリシー制御
ry
0
230
データ分析基盤の要件分析の話(202201_JEDAI)
yabooun
0
290
AWS re:Invent 2022で発表された新機能を試してみた ~Cloud OperationとSecurity~ / New Cloud Operation and Security Features Announced at AWS reInvent 2022
yuj1osm
1
220
Logbii(ログビー) 会社紹介
logbii
0
160
re:Inventの完全招待制イベント Building a Roadmap to SaaSについて / Building a Roadmap to SaaS an invitation only event at reinvent
yayoi_dd
0
150
私見「UNIXの考え方」/20230124-kameda-unix-phylosophy
opelab
1
170
SSMパラメーターストアでクロススタック参照の罠を回避する
shuyakinjo
0
7.9k
WebLogic Server for OCI 概要
oracle4engineer
PRO
3
890
金属加工屋の営業マンがSTマイクロで・・・
usashirou
0
170
SmartHRからOktaへのSCIM連携で作り出すHRドリブンのアカウント管理
jousysmiler
1
120
立ち止まっても、寄り道しても / even if I stop, even if I take a detour
katoaz
0
880
Deep Neural Networkの共同学習
hf149
0
330
Featured
See All Featured
Making Projects Easy
brettharned
102
4.8k
The Language of Interfaces
destraynor
149
21k
We Have a Design System, Now What?
morganepeng
37
5.9k
Git: the NoSQL Database
bkeepers
PRO
419
60k
Scaling GitHub
holman
453
140k
Designing for humans not robots
tammielis
245
24k
Rebuilding a faster, lazier Slack
samanthasiow
69
7.6k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
31
20k
Support Driven Design
roundedbygravity
88
8.9k
Statistics for Hackers
jakevdp
785
210k
The Pragmatic Product Professional
lauravandoore
21
3.5k
Docker and Python
trallard
30
1.9k
Transcript
ΫϥυΛ׆༻ͨ͠ WebRTC ίʔϧηϯλʔ ͷ࠷લઢ @kimihom
ຊؒ ߖ @kimihom CTO at selfree,llc TwilioJP-UG ϝϯόʔ CallConnect (ిαϙʔτΛ؆୯ʹ)
ϒϩά “ϘΫίί” ӡӦ https://www.callconnect.jp http://www.bokukoko.info/ Who am Iʁ
Goal “ίʔϧηϯλʔ” ʹ͍ͭͯࣝΛਂΊɺ WebRTC ͕ͲͷΑ͏ʹ׆༻͞Ε࣮ݱ͍ͯ͠Δͷ͔ Λཧղ͠ɺ࣍ͳΔ Cloud Innovation ͷώϯτΛ௫ΜͰ͍ͩͨͩ͘
Topic
Topic • ίʔϧηϯλʔͷྺ࢙ͱΈ • ίʔϧηϯλʔ ͱ WebRTC • WebRTC ίʔϧηϯλʔͷ࣮ྫ
• ऴΘΓʹ
Q. ͦͦి ͳͥͭͳ͕Δͷʁ
Ωʔϫʔυ “ަػ”
A B C ࢢہ൪ ަػ Ұൠి
A B C ࢢ֎ہ൪ ަػ Ұൠి
اۀͷઢిίʔϧηϯλʔΛ ߏங͍ͨ͠߹ʹɺ ిͷ ”γεςϜԽ” ͕ඞཁʹͳΔ
A: ݻఆి B: SIP ϑΥϯ C ࢢ֎ہ൪ IP-PBX ަػ PBX
(اۀަػ) ࣾ ࣾ֎
ࣾͰަػ(PBX)Λ࣋ͭ ϝϦοτ • ઢ௨(௨ྉͷઅ) • දి൪߸ • ઢసૹ • ͦͷଞίʔϧηϯλʔػೳ
(IP-PBX) σϝϦοτ • ઐ༻ PBX / αʔόʔ ͷ ߏங/ӡ༻͕ඞཁ
σϝϦοτΛղܾ͢ΔͨΊʹ ిަػΛ”Ϋϥυ”Խ
A B C Ϋϥυ PBX ަػ
Ϋϥυ PBX ͷϝϦοτ • ࣗࣾͰަػΛ࣋ͭඞཁ͕ͳ͘ͳΔ • ॳظίετɾݻఆࢿ࢈ͷෛ୲Λݮ • ಋೖεϐʔυ͕͍ •
ఆظతͳΞοϓσʔτ
ɹɹɹͷొ
A B C Ϋϥυ PBX ަػ
• Ϋϥυ PBX αʔϏεͱಉͷΈΛ API Ͱɹɹɹ ఏڙ͠ɺ։ൃऀ͕ࣗ༝ʹిγεςϜΛߏஙͰ͖Δ • ిγεςϜͷΈΛ Web
ٕज़ͷΈ Ͱ࣮ݱ ࠶ੜɺసૹɺԻɺอཹɺϓογϡૢ࡞ɺΩϡʔɾɾ • ిճઢ͕ෆཁ • νϟωϧͷ֓೦͕ͳ͍ Voice
ి ͱ Web ͷ͕֞ࠜແ͘ͳΓͭͭ͋Δ
Topic • ίʔϧηϯλʔͷྺ࢙ͱΈ • ίʔϧηϯλʔ ͱ WebRTC • WebRTC ίʔϧηϯλʔͷ࣮ྫ
• ίʔϧηϯλʔͷྺ࢙ͱΈ • ίʔϧηϯλʔ ͱ WebRTC • WebRTC ίʔϧηϯλʔͷ࣮ྫ • ऴΘΓʹ
WebRTC (Web Real-Time Communication)
WebRTC ͰͰ͖Δ͜ͱ • ి • Ի • ϏσΦ௨ • σʔλڞ༗
• ө૾৴ Ϣʔβʔઐ༻ϓϥάΠϯແ͠Ͱར༻Մೳ
σόΠεαʔόͱ (P2P) ܨ͕Δ εϚϗ ΞϓϦ PC ϒϥβ IP-PBX Web
αʔό SIP ϑΥϯ
A B C ަػ
WebRTC ίʔϧηϯλʔͷར • ి ͱ Web ͷ༥߹ • Chrome ͚ͩͰίʔϧηϯλʔΛ࣮ݱͰ͖Δ
> Ձ֨, ಋೖ༰қ, ߴػೳ • ి/ϏσΦ/νϟοτ “ΦϜχνϟωϧԽ”
WebRTC ͷ՝ • ༷͕ݻ·Γ͖Ε͍ͯͳ͍ • γάφϦϯάͷͨΊͷΈ • ωοτϫʔΫͷઐࣝ • Ϣʔβʔڥʹେ͖͘ґଘ
WebRTC ͷ՝ • ༷͕ݻ·Γ͖Ε͍ͯͳ͍ • γάφϦϯάͷͨΊͷΈ • ωοτϫʔΫͷઐࣝ • Ϣʔβʔڥʹେ͖͘ґଘ
3લͷ
WebRTC Ϋϥυ API * WebRTC ࠷৽ͷै * WebRTC ͷίΞ࣮Λ ҙࣝͤͣʹϦΞϧλΠϜ
αʔϏεΛߏஙͰ͖Δ SDK
• Ϋϥυ ”ίϛϡχέʔγϣϯ” API αʔϏε Ի௨ / SMS / ϏσΦ
/ νϟοτ / ௨ / ಉظ / IoT • Add-on Ͱ Watson ͱͷ࿈ܞ༰қ • ࢝Ί͔Βैྔ՝ۚ • શࠃͰษڧձͬͯ·͢ (Twilio-UG)
ैདྷਂ͍ઐੑΛཁͨ͠ “ίϛϡχέʔγϣϯͷٕज़” ͕୭Ͱ API Ͱ࣮ݱՄೳʹ Open Cloud Innovation
Topic • ίʔϧηϯλʔͷྺ࢙ͱΈ • ίʔϧηϯλʔ ͱ WebRTC • WebRTC ίʔϧηϯλʔͷ࣮ྫ
• ίʔϧηϯλʔͷྺ࢙ͱΈ • ίʔϧηϯλʔ ͱ WebRTC • WebRTC ίʔϧηϯλʔͷ࣮ྫ • ऴΘΓʹ
None
“ސ٬ରԠϝʔϧνϟοτͰे”ʁ ސ٬ຬΛٻ͢ΔͳΒ ిϚετɻ ϏδωεΛޭʹಋ͘ ”ث”ͱͳΔπʔϧΛࢦ͢ αʔϏεͷࢥ͍
• ࠃ།Ұͷશ SaaS ܕ WebRTC ίʔϧηϯλʔ • 5Ͱಋೖ/ӡ༻Մೳ • 14ແྉτϥΠΞϧ
• PC ిͱڞʹɺސ٬ใ௨ཤྺΛ Web ্Ͱཧ • ଞΫϥυαʔϏεͱͷ࿈ܞ
DEMO
WebRTC αʔϏεͷӡ༻ • iOS ະରԠ (ݱঢ় iOS Chrome Ͱར༻ෆՄ) •
ϢʔβʔڥΛνΣοΫ͢Δϖʔδ ඞਢ • ϔουηοτͷ࣭ • ωοτϫʔΫ (ଓঢ়ଶ, ಉ࣌ଓ, ཧ) • Ի࣭͕ѱ͍ͱ͍͏͍߹ΘͤΑ͘དྷΔ 98% ωοτϫʔΫϚΠΫͷଓෆྑʹΑΔͷ
Topic • ίʔϧηϯλʔͷྺ࢙ͱΈ • ίʔϧηϯλʔ ͱ WebRTC • WebRTC ίʔϧηϯλʔͷ࣮ྫ
• ίʔϧηϯλʔͷྺ࢙ͱΈ • ίʔϧηϯλʔ ͱ WebRTC • WebRTC ίʔϧηϯλʔͷ࣮ྫ • ऴΘΓʹ
WebRTC ͰԿ͔Λ࡞ΔͳΒɺ Chrome ݶఆʹ͢Δ͔ ΞϓϦݶఆʹ͠Α͏
WebRTC / WebSocket Λ͏ͳΒ ଓΛΒ͞ͳ͍Α͏ʹ Ajax Խ͠Α͏
WebRTC / WebSocket Λ͏ͳΒ ࠷৽ͷ HTML5 ٕज़ΛੵۃతʹऔΓೖΕΑ͏ ServiceWorker, Canvas, HistoryAPI,
File API, WebSpeech API, Device API…
εϚϗΞϓϦ ͕ͯ Web Խ͞Ε͍ͯ͘ Web ΞϓϦ͕ͯ εϚϗΞϓϦͷΑ͏ʹͳΔ
Cloud Innovation جຊٕज़ͷֵ৽͔Βੜ·ΕΔ ਐԽٕͨ͠ज़ͷΈ߹Θͤ ٕज़ͷ”Ҿ͖ग़͠”Λ૿͢͜ͱ͕ॏཁ
JavaScript! JavaScript! JavaScript! + Ϋϥυ API
ϔουηοτ ϓϨθϯτ Ωϟϯϖʔϯ ࣮ࢪதʂ ࠂ ϒʔεग़లதʂ ͜͜Λग़͙ͯ͢લ
Thanks.
ൃද͜͜·ͰͰ͢ɻ ҎԼɺ༧උεϥΠυ
Goal CallConnect ͷ࣮Λ௨ͯ͠ HTML 5 ͷ”ࠓ”ͱ”ํੑ”Λ͍͖ͬͯͨͩɺ ࣍ͳΔ Open Cloud Innovation
ΛੜΈग़͢ ͖͔͚ͬώϯτͱͳΔʹ͢Δ
Topic • ࠷৽ Web ςΫϊϩδʔͱͷ͖߹͍ํ • HTML 5 ςΫϊϩδʔͷ͝հ •
HTML 5 ͷࢦ͢ͱ͜Ζͷߟ
Topic • ࠷৽ Web ςΫϊϩδʔͱͷ͖߹͍ํ • HTML 5 ςΫϊϩδʔͷ͝հ •
HTML 5 ͷࢦ͢ͱ͜Ζͷߟ
None
ΫϩεϒϥβରԠ or HTML 5 ͷ࠷৽ςΫϊϩδʔ ͲͪΒʹ࣌ؒΛׂ͖͔͘ αʔϏε࣍ୈ
ϒϥβαϙʔτΛݶఆ͢Δ Chrome ݶఆΛ໌ه (Φεεϝ)
ϥϯσΟϯάϖʔδ ͷ UA
Topic • ࠷৽ Web ςΫϊϩδʔͱͷ͖߹͍ํ • HTML 5 ςΫϊϩδʔͷ͝հ •
HTML 5 ͷࢦ͢ͱ͜Ζͷߟ
͝հ͢Δ HTML 5 • WebRTC • WebSocket • History API
• Canvas • File API • Web Speech API • Web Notifications • Service Worker • Device API
WebRTC (Web Real-Time Communication)
P2P ͰσόΠεαʔόͱ ””ܨ͕Δ εϚϗ ΞϓϦ PC ϒϥβ PSTN Web αʔό
SIP ϑΥϯ
WebRTC ͰͰ͖Δ͜ͱ • ϏσΦ௨ • ి • Ի • σʔλڞ༗
• ө૾৴ Ϣʔβʔઐ༻ϓϥάΠϯແ͠Ͱར༻Մೳ
WebRTC • σόΠεͷϚΠΫ/ΧϝϥΛར༻ (UserMedia) • ϒϥβͰϦΞϧλΠϜ௨ (RTCPeerConnection) • ςΩετόΠφϦσʔλͷૹड৴ (DataChannel)
“୭ͱ"ଓ͢Δ͔Λࢦఆ͢Δ࣮ࣗͰ༻ҙ͠ͳ͚ΕͳΒͳ͍ “γάφϦϯά”
՝ ωΠςΟϒ࣮ͷෳࡶ͞ ωοτϫʔΫͷઐࣝ ଓͷͨΊͷઐ༻αʔόʔ ϒϥβґଘ ϢʔβʔͷϚΠΫ ڥ
͜͜·Ͱ 3લͷ
WebRTC ΫϥυαʔϏε • Twilio • SkyWay • Tropo WebRTC ࠷৽ͷै
WebRTC ͷίΞ࣮Λ ҙࣝͤͣʹϦΞϧλΠϜ αʔϏεΛߏஙͰ͖Δ SDK
// ॳظԽ Twilio.Device.setup(“Twilio Token”); // ॳظԽྃ࣌ Twilio.Device.ready(function (device) { console.log("ண৴Մೳ");
} // ண৴࣌ Twilio.Device.incoming(function (conn) { conn.accept(); // ௨։࢝ } // ௨։࢝࣌ Twilio.Device.connect(function (conn) { console.log("௨த"); }); ߦͷίʔυͰϦΞϧλΠϜ௨৴ػೳΛ࣮ݱʂ
DEMO UserMedia ͱ RTCPeerConnection
WebRTC αʔϏεͷӡ༻ • iOS ະରԠ (ݱঢ় iOS Chrome Ͱར༻ෆՄ) •
ϢʔβʔڥΛνΣοΫ͢Δϖʔδඞਢ • ϔουηοτͷ࣭ • ωοτϫʔΫ (ଓঢ়ଶ, ಉ࣌ଓ, ཧ) • Ի࣭͕ѱ͍ͱ͍͏͍߹ΘͤΑ͘དྷΔ 98% ωοτϫʔΫϚΠΫͷଓෆྑʹΑΔͷ
WebRTC ͷࠓޙ (͔ͳΓ׆ൃ) • ҆ఆɺηΩϡΞ • εΫϦʔϯڞ༗ • canvas
video ཁૉͱͷ༥߹ • ը
WebSocket
A: Hello A: Hello A B αʔόʔ͔ΒಛఆͷΫϥΠΞϯτ(B)ʹϝοηʔδΛૹ৴͍ͨ͠…
A: Hello WebSocket ϓϩτίϧ A B WebSocket ͰଓΛཱ֬
WebSocket • αʔόʔ/ϒϥβͷํσʔλ௨৴ • ςΩετ/όΠφϦͷૹड৴ • https ͱผͷ WebSocket ϓϩτίϧ
(wss) ͰଓΛཱ֬
WebSocket ͰͰ͖Δ͜ͱ(ྫ) • νϟοτ • ϦΞϧλΠϜ௨ • ڞ༗Ϙʔυ • Ϣʔβʔಉ࢜ͷ͋ΒΏΔίϥϘϨʔγϣϯ
՝ ωοτϫʔΫڥґଘ ϒϥβґଘ ଓͷͨΊͷ WS ༻αʔόʔ
WebSocket ΫϥυαʔϏε • Twilio • Node-RED • Milkcocoa • Firebase
• … ઐ༻αʔόෆཁ εέʔϧରԠ SDKͰ։ൃޮԽ
// ॳظԽ accessManager = new Twilio.AccessManager(data.token); messagingClient = new Twilio.IPMessaging.Client(accessManager);
// channel ͷऔಘ messagingClient.getChannel().then(initChannel); // channel ͷΠϕϯτ function initChannel(channel) { channel.on('messageAdded', function(message) { console.log(message); }); }
DEMO
WebSocket αʔϏεͷӡ༻ • PC ΛεϦʔϓͨ͠Γ͢Δͱଓ͕ΕΔ “ଓ͕Εͨɻߋ৽ͯ͠” ͱ͍͏දࣔΛඞͣೖΕΔ • اۀͷωοτϫʔΫڥʹҙ ϙʔϦϯάͷସͱΈ߹ΘͤΔඞཁ͋Γ
ແཧʹ WebSocket ΛΘͳͯ͘ɺ“ϖʔδߋ৽” Ͱ ղܾͰ͖ΔͳΒͦͷ΄͏͕͍͍ (χϡʔεܝࣔ൘ͳͲ)
WebRTC WebSocket Λ͏ͱ γϯάϧϖʔδΞϓϦέʔγϣϯ (SPA) લఏͱͳΔ SPA ͦͷଞͷཧ༝ Ϣʔβʔମݧ্
ωοτϫʔΫෛՙܰݮ εϚϗΞϓϦԽ
SPA ͷಛ • େྔͷΠϕϯτΛ JavaScript Ͱఆٛ • ϖʔδ͝ͱͷ js/css ͕ఆٛͰ͖ͳ͍
(Ұׅ) • Δ/ਐΉͷಈ࡞Λߟྀ
͜ΕΒΛఆͯ͠ߏங͞Εͨ SPA ϑϨʔϜϫʔΫ • React.js • AngularJS • Vue.js •
JS ϑϨʔϜϫʔΫͷ૪ઈ͑ͳ͍ɾɾɻ
History API
History API • ϢʔβʔͷϖʔδભҠΛ Stack ͰੵΈ্͛Δ • Δ/ਐΉ ΠϕϯτͷఆٛͰࢦఆ URL
/ ύϥ ϝʔλΛऔಘ • URL ʹԠͨ͡ϖʔδΓସ͑ࣗͰ࣮
// Stack ੵΈ্͛ History.pushState(option, title, url); // Stack มԽ࣌ͷΠϕϯτఆٛ History.Adapter.bind(
window, ‘statechange’, function() { let state = History.getState(); let url = state.cleanUrl; console.log(url) //=> /posts/1 // URL ʹجͮ͘ϧʔςΟϯά }); History.js Ͱͷ࣮ྫ
DEMO
History API ͷ࣮ • ࣗલͰ࣮Ͱಛʹ͘͠ͳ͍ • ΩϟογϡͷΈΛߏஙՄ • ࣗલ SPA
ͷ߹࠷ॳʹඞͣߟྀ͠Α͏
Web Notifications Service Worker
Web Notifications • ͍ΘΏΔ σεΫτοϓ௨ • ࠷ۙ௨ʹϘλϯΞΠίϯͳͲΛࡌՄ • ௨ΫϦοΫ࣌ͷಈ࡞Λఆٛ •
ServiceWorker ͱΈ߹ΘͤΔ͜ͱͰ εϚϗ௨Մ
Service Worker • όοΫάϥϯυͰಈ͘ JavaScript • ࠓॳΊ͘Β͍͔Β͞Ε࢝ΊΔ • ΦϑϥΠϯରԠ/Ωϟογϡ/ϓογϡ௨ ϓογϡ௨ͷཚ༻Ί·͠ΐ͏ʂ
// ServiceWorker ͷొ navigator.serviceWorker.register(‘/sw.js'); // ௨ൃߦ navigator.serviceWorker.ready.then(function(registration) { registration.showNotification('௨', {
icon: '/icon.png', body: name + 'ΑΓண৴͕͋Γ·͢ɻ', vibrate: [200, 100, 200, 100, 200, 100, 200] }); });
self.onnotificationclick = function(event) { event.notification.close(); event.waitUntil( clients.matchAll({ includeUncontrolled: true }).then(function(clientList)
{ for (var i = 0; i < clientList.length; i++) { var client = clientList[i]; if (client.url.match('myapp') && 'focus' in client) { return client.focus(); } } }); ); }; sw.js
DEMO εϚϗϓογϡ௨
File API
File API • ϑΝΠϧબυϥοά&υϩοϓ • JavaScript ͰϑΝΠϧऔಘɺૢ࡞
ϑΝΠϧૢ࡞ΛϑϩϯτΤϯ υͰղܾ αʔόʔෛՙͷԼ Ϣʔβʔମݧͷ্
ྫ) ը૾ΞοϓϩʔυͷྲྀΕ • ը૾Λυϥοά & υϩοϓ (File API) • ϑΝΠϧλΠϓͷνΣοΫ
(File API) • ը૾ͷϦαΠζ (Canvas) • Cropper.js Ͱॎԣൺͷௐ • ը૾αʔόΞοϓϩʔυ (CORS) શͯ JavaScript Ͱ࣮Մೳ
// imagefield dragover $(document).on("dragover", ".droparea", function(e) { e.preventDefault(); $(".droparea").addClass("hover"); });
// imagefield dragleave $(document).on("dragleave", “.droparea", function(e) { e.preventDefault(); $(".droparea").removeClass("hover"); }); // imagefield drop $(document).on("drop", ".droparea", function(e) { e.preventDefault(); var file = e.originalEvent.dataTransfer.files[0]; });
DEMO ࣮ํ๏”ݸਓϒϩά”ʹͯ
Canvas
Canvas • JavaScript Ͱඳ͚Δ 2D ඳըϥΠϒϥϦ • ௨ৗͷ HTML Ͱදݱ͠ʹ͍͘ͷΛॊೈʹ
දࣔͰ͖Δ
Canvas ≠ άϥϑΟοΫ/ήʔϜઐ จࣈɺਤܗɺΫϦοΫΠϕϯτ ͋ΒΏΔΞϓϦέʔγϣϯͰ ΑΓΘ͔Γ͍͢ UI Λ࣮ݱͰ͖Δ
Canvas ༻ϥΠϒϥϦ • Fabric.js • jCanvas • άϥϑΟοΫ/ήʔϜ༻Ͱͦͷଞଟ
DEMO
Canvas ͷ࣮ • ࠶ඳըͷͨΊʹ σʔλΛJSON ܗࣜͰอଘ͠ ࠶ݱ͢Δͷ͕࣮ͷࢁ (Fablic.js ඪ४ࡌ) •
px ୯ҐͳͨΊ ϨεϙϯγϒԽ͕͍͠ • ςΩετϘοΫεͳͲͷ HTML ϑΥʔϜຒΊ ࠐΈෆՄ
Web Speech API
Web Speech API • Chrome, Firefox ͷ࣮ݧஈ֊ͷػೳ • ϒϥβࡌ •
Text to Speech, Speech to Text • අ༻ 0 & ੍ͳ͠
• ਫ਼ׂͱߴ͍ • ݱঢ়్தͰউखʹจࣈى͕͜͠ࢭ·ͬͨΓ͢ ΔͨΊɺͣͬͱԻ͢ΔʹԿ͔͠ΒͷϋοΫ ͕ඞཁ • વ ͠૬खͷͳͲऔಘෆՄɻ ->
ͦͷ࣌ ͪΖΜ Watson Ͱɻ
// ॳظԽ let recognition = new webkitSpeechRecognition(); recognition.lang = 'ja-JP';
recognition.continuous = true; // ։࢝ recognition.start(); // ݁Ռ recognition.onresult = function(event){ let results = event.results; var message = ""; for (var i = event.resultIndex; i < results.length; i++){ message += results[i][0].transcript; } console.log(message); };
DEMO https://www.google.com/intl/ja/chrome/demos/speech.html
Web Speech API ͷར༻ • ձͷॻ͖ى͜͠Ͱᘳͳਫ਼ෆՄೳ • จΛܗ͢ΔΑ͏ͳٕज़ΛΈ߹ΘͤΔͱྑ͍
Device API
• ͋ΒΏΔใΛ ϒϥβͰऔಘ • Ґஔใɺ֤ηϯαใɺόοςϦɺόΠϒ • ϚΠΫग़ྗσόΠε …etc https://developer.chrome.com/apps/api_index
• Web ΞϓϦͷ ”εϚϗΞϓϦ” Խ • Web ΞϓϦΛ࡞Εɺ֤ϓϥοτϑΥʔϜʹ ґଘ͠ͳ͍αʔϏεΛల։Մ •
֤σόΠε, OS, ϒϥβͷରԠʹظ
Topic • ࠷৽ Web ςΫϊϩδʔͱͷ͖߹͍ํ • HTML 5 ςΫϊϩδʔͷ͝հ •
HTML 5 ͷࢦ͢ͱ͜Ζͷߟ
Cloud Innovation جຊٕज़ͷֵ৽͔Βੜ·ΕΔ ਐԽٕͨ͠ज़ͷΈ߹Θͤ
ٕज़ͷҾ͖ग़͠Λ૿͢
εϚϗΞϓϦ ͕ͯ Web Խ͞Ε͍ͯ͘ Web ΞϓϦ͕ͯ εϚϗΞϓϦͷΑ͏ʹͳΔ
JavaScript, JavaScript, JavaScript. + API
Thanks.