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
Feature Policy
Search
Sponsored
·
SiteGround - Reliable hosting with speed, security, and support you can count on.
→
Yosuke Furukawa
PRO
October 18, 2018
Programming
1
160
Feature Policy
Yosuke Furukawa
PRO
October 18, 2018
Tweet
Share
More Decks by Yosuke Furukawa
See All by Yosuke Furukawa
デザインシステムが必須の時代に
yosuke_furukawa
PRO
2
190
Node.js, Deno, Bun 最新動向とその所感について
yosuke_furukawa
PRO
10
4.9k
Welcome JSConf.jp 2024
yosuke_furukawa
PRO
1
4.5k
tc39 x jsconf.jp Panel Discussion 2024
yosuke_furukawa
PRO
0
300
Removing Corepack
yosuke_furukawa
PRO
9
1.8k
JavaScript Runtime とはなにか
yosuke_furukawa
PRO
15
3k
Strip Types と Storage
yosuke_furukawa
PRO
4
470
Module Harmony について
yosuke_furukawa
PRO
4
1.8k
LTのやり方
yosuke_furukawa
PRO
16
2.9k
Other Decks in Programming
See All in Programming
Basic Architectures
denyspoltorak
0
670
AIエージェントのキホンから学ぶ「エージェンティックコーディング」実践入門
masahiro_nishimi
5
450
OCaml 5でモダンな並列プログラミングを Enjoyしよう!
haochenx
0
140
責任感のあるCloudWatchアラームを設計しよう
akihisaikeda
3
170
dchart: charts from deck markup
ajstarks
3
990
AI Schema Enrichment for your Oracle AI Database
thatjeffsmith
0
280
Rust 製のコードエディタ “Zed” を使ってみた
nearme_tech
PRO
0
170
AIによる開発の民主化を支える コンテキスト管理のこれまでとこれから
mulyu
3
270
副作用をどこに置くか問題:オブジェクト指向で整理する設計判断ツリー
koxya
1
610
Patterns of Patterns
denyspoltorak
0
1.4k
CSC307 Lecture 01
javiergs
PRO
0
690
AI巻き込み型コードレビューのススメ
nealle
1
220
Featured
See All Featured
Done Done
chrislema
186
16k
The untapped power of vector embeddings
frankvandijk
1
1.6k
30 Presentation Tips
portentint
PRO
1
210
Designing Powerful Visuals for Engaging Learning
tmiket
0
230
Winning Ecommerce Organic Search in an AI Era - #searchnstuff2025
aleyda
0
1.9k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
49
9.9k
YesSQL, Process and Tooling at Scale
rocio
174
15k
The Director’s Chair: Orchestrating AI for Truly Effective Learning
tmiket
1
96
No one is an island. Learnings from fostering a developers community.
thoeni
21
3.6k
4 Signs Your Business is Dying
shpigford
187
22k
My Coaching Mixtape
mlcsv
0
48
Imperfection Machines: The Place of Print at Facebook
scottboms
269
14k
Transcript
Future HTTP 2018/10/12 @ Future Architect
Twitter: @yosuke_furukawa Github: yosuke-furukawa
ϦΫϧʔτςΫϊϩδʔζ ITE౷ׅ෦ϓϩμΫτΤϯδχΞϦϯά෦ASG ݹཅհʢϑϧΧϫϤεέʣ 3 ▪৬ ࣗݾհ Application Solution GroupͷάϧʔϓϚωʔδϟ γχΞιϑτΣΞΤϯδχΞ
͓ࣸਅ ໌Δ͍දͷͷ ϓϥΠϕʔτՄ ▪GMͱͯͬͯ͠Δ͜ͱ ιϑτΣΞΤϯδχΞମ੍ͮ͘Γ ࠾༻/ධՁ νʔϜϏϧσΟϯά/ίϯαϧςΟϯά ▪γχΞͱͯͬͯ͠Δ͜ͱ R&D - React/Redux/Node.jsΛͬͨϘΠϥʔϓϨʔτ - Consumer Driven Contract πʔϧ agreed࡞ ύϑΥʔϚϯενϡʔχϯά - ࣾISUCON։͍ͨΓ - ࣾWeb Page SpeedϋοΧιϯ։͍ͨΓ
ݺΜͰ͍͖ͨͩ ͋Γ͕ͱ͏͍͟͝·͢ʂʂʂʂʂʂʂ
None
None
ँࣙʹࡌͤͯΒͬͨʂʂ
HTTP
None
Future
ϑϡʔνϟʔ
ϑΟʔνϟʔ
ϑΟʔνϟʔ… HTTP…
ʊਓਓਓਓਓਓਓਓਓਓਓʊ ʼɹFeature Policy !!!!ɹʻ ʉY^Y^Y^Y^Y^Y^Y^Y^ʉ
Webʹ͓͚Δ Permission
Webʹ͓͚Δ legacy feature
Webʹ͓͚Δ legacy feature HTML Parser ͕࣮ߦதʹDOMΛ͍ͬͯ͡͠·͏. ࣮ߦதʹωοτϫʔΫΛࢭΊͯ͠·͏ɻ
Webʹ͓͚Δ legacy feature const syncXhr = new XMLHttpRequest(); syncXhr.open("GET",
"https://example.com/sample.txt", false); syncXhr.send(null);
Webʹ͓͚Δ legacy feature const syncXhr = new XMLHttpRequest(); syncXhr.open("GET",
"https://example.com/sample.txt", false); syncXhr.send(null); ͏ͳʂʂʂҎ্
Feature-Policy ϔομʔͰ ػೳͷPermissionΛ ઃఆͰ͖Δ Feature-Policy: sync-xhr 'self'; document- write 'none';
geolocation 'example.com';
DEMO 1: Sync XHR ͕Ͱ͖ͳ͍Α͏ʹ ͢Δɻ Feature-Policy: sync-xhr 'none';
DEMO 2: document.write ͕Ͱ͖ͳ͍ Α͏ʹ͢Δɻ Feature-Policy: document- write 'none';
DEMO 3: ϨΨγʔͳը૾ϑΥʔϚοτ ΛରԠ͠ͳ͍ɻ Feature-Policy: legacy- image-formats 'none’;
͜ͷଞʹɿ geolocation, getUserMedia,document.co okie, lazyload, animations, payment, webxr etc etc
WebͷਐԽ͋Δ͕ɺਐԽͷ ҰํͰࠓͬͯ΄͘͠ͳ͍ ػೳ͋Δɻ (document.write, sync-xhr)
·ͨٯʹڧྗ͗͢Δػೳʹର ੍ͯ͠ݶ͍ͨ͜͠ͱ͋Δ উखʹiframeͰදࣔ͞ΕͯΔࠂ͔ΒҐஔ ใऔΒΕͨ͘ͳ͍
WebͱPermissionͱ͍͏ͷ ࠓ͍ྖҬɺͲ͏ͬͯ҆ શͰ༗Γଓ͚Δ͔ɺͲ͏ͬ ͯߴͳਐԽΛଓ͚Δ͔ͱ͍ ͏ʹͳ͍ͬͯΔɻ
·ͱΊʂʂʂ • Feature Policy Webͷະདྷʹॏཁͳػೳ • ஈ֊తʹػೳΛ༗ޮԽͤͭͭ͞ɺஈ֊తʹػ ೳΛແޮԽͤ͞Δ͜ͱͰ͖Δ • ौ͞Μ
• 2൛ँࣙͬͯ·͢ɻ
͋ɺͦ͏ͦ͏େࣄͳ͜ͱ
feature-policyͷnode moduleΛ࡞ͬͨͷ ͰͬͯΈ͍ͯͩ͘͞ʂʂʂʂʂʂʂʂʂʂ $ npm install node-feature-policy
Thank you