CORSã§ãƒãƒžã£ãŸã“ã¨ã¾ã¨ã‚ - pixiv inside [archive]
ã“ã¡ã‚‰ã¯ ãƒ”ã‚¯ã‚·ãƒ–æ ªå¼ä¼šç¤¾ Advent Calendar 2014 ã®12/16ã®è¨˜äº‹ã§ã™ã€‚ ã“ã‚“ã«ã¡ã¯ã€ã‚¨ãƒ³ã‚¸ãƒ‹ã‚¢ã®@dnskimoã§ã™ã€‚ 先日ã€ã¯ã˜ã‚ã¦CORSを実装ã™ã‚‹æ©Ÿä¼šãŒã‚ã£ãŸã®ã§ã€è¦šæ›¸ãŒã¦ã‚‰ã¾ã¨ã‚ã¦ãŠããŸã„ã¨æ€ã„ã¾ã™ã€‚ CORSã¨ã¯ Cross-origin resource sharingã®ç•¥ã§ã™ã€‚ èªã¿æ–¹ã¯ã€Œã‚³ãƒ«ã‚¹ã€ã§ã„ã„ã‚“ã§ã—ょã†ã‹ï¼Ÿ Same-Origin Policyã«å¼¾ã‹ã‚Œãšã«ã€ç•°ãªã‚‹ãƒ‰ãƒ¡ã‚¤ãƒ³é–“ã§ãƒªã‚½ãƒ¼ã‚¹ã‚’共有ã™ã‚‹ä»•çµ„ã¿ã§ã™ã€‚ 2014å¹´1月ã«W3C勧告ã«ãªã‚Šã€JSONPã«æ›¿ã‚る方法ã¨ã—ã¦å¾ã€…ã«æ™®åŠã—ã¦ãã¦ã„るよã†ã§ã™ï¼ˆè¦å‡ºå…¸ï¼‰ã€‚ アクセスコントãƒãƒ¼ãƒ«ã®ä»•æ§˜ã‚‚定義ã•ã‚Œã¦ã„ã‚‹ã®ã§ã€ç‰¹å®šã®ã‚µã‚¤ãƒˆã‹ã‚‰ã®ã¿åˆ©ç”¨å¯èƒ½ãªAPIを作る際ãªã©ã«ä¾¿åˆ©ã§ã™ã€‚ JSONPã®ã‚ˆã†ãªã€Œè£ãƒ¯ã‚¶ã€çš„ãªæ–¹æ³•ã§ã¯ãªã„ã¨ã“ã‚も個人的ã«å¥½ã¿ã§ã™ã€‚ 詳ã—ã„ã“ã¨ã¯ãƒãƒƒãƒˆä¸Šã«ç´ 晴らã—ã„記事ãŒãŸãã•ã‚“ã‚ã‚‹ã®ã§
![CORSã§ãƒãƒžã£ãŸã“ã¨ã¾ã¨ã‚ - pixiv inside [archive]](https://cdn-ak-scissors.b.st-hatena.com/image/square/70054759c3787b5c8b89449617d22d699ef3b8f9/height=288;version=1;width=512/https%3A%2F%2Fcdn.image.st-hatena.com%2Fimage%2Fscale%2F4393f2761db895fd0a5106a3761d1fe12d734abe%2Fbackend%3Dimagemagick%3Bversion%3D1%3Bwidth%3D1300%2Fhttp%253A%252F%252Fcdn-ak.f.st-hatena.com%252Fimages%252Ffotolife%252Fd%252Fdevpixiv%252F20141216%252F20141216151227.jpg)
知ã£ã¦ã„るよã†ã§çŸ¥ã‚‰ãªã„Webサーãƒã‚¢ãƒ¼ã‚テクãƒãƒ£
第６回ゲームサーãƒå‹‰å¼·ä¼šç”¨è³‡æ–™ã§ã™ã€‚ Webã®æŠ€è¡“ã®æ ¹å¹¹ã¨ãªã‚‹HTTPã‚„TCP/IPを軽ããŠã•ã‚‰ã„ã—ãŸã‚ã¨ã€ マルãƒãƒ—ãƒã‚»ã‚¹ã€ãƒžãƒ«ãƒã‚¹ãƒ¬ãƒƒãƒ‰ã€ã‚¤ãƒ™ãƒ³ãƒˆé§†å‹•ã¨ã„ã£ãŸã‚µãƒ¼ãƒã‚¢ãƒ¼ã‚テクãƒãƒ£ã«ã¤ã„ã¦è§£æžã—〠ã•ã‚‰ã«ã‚¤ãƒ™ãƒ³ãƒˆé§†å‹•ã‚’実ç¾ã™ã‚‹ãŸã‚ã®éžãƒ–ãƒãƒƒã‚ングI/Oã¨I/Oã®å¤šé‡åŒ–ã«ã¤ã„ã¦è§£èª¬ã—ã¾ã™ã€‚
フãƒãƒ³ãƒˆã‚¨ãƒ³ãƒ‰ã‚¨ãƒ³ã‚¸ãƒ‹ã‚¢ã®ãŸã‚ã®å‹•ç”»ã‚¹ãƒˆãƒªãƒ¼ãƒŸãƒ³ã‚°æŠ€è¡“基礎
å‹•ç”»ã¯ãƒ‡ãƒ¼ã‚¿å®¹é‡ãŒå¤§ãã„ ç”»åƒã¨é•ã„ã€å‹•ç”»ã‚³ãƒ³ãƒ†ãƒ³ãƒ„ã¯ãƒ‡ãƒ¼ã‚¿å®¹é‡ãŒã¨ã¦ã‚‚大ãã„ãŸã‚ã€ãƒ‡ãƒ¼ã‚¿ã‚’ダウンãƒãƒ¼ãƒ‰ã—ã¦å†ç”Ÿã™ã‚‹ã¾ã§ã«å¾…ã¡æ™‚é–“ãŒç™ºç”Ÿã—ã¾ã™ã€‚ å‹•ç”»ã®ãƒ‡ãƒ¼ã‚¿å®¹é‡ãŒå¤§ãã„ç†ç”±ã¯ã¨ã¦ã‚‚å˜ç´”ã§ã€å‹•ç”»ã¯ç”»åƒãƒ‡ãƒ¼ã‚¿ãŒé›†åˆã—ãŸã‚‚ã®ã ã‹ã‚‰ã§ã™ã€‚é™æ¢ç”»åƒã‚’人間ã®ç›®ãŒæ»‘らã‹ã«æ„Ÿã˜ã‚‰ã‚Œã‚‹é€Ÿã•ã§åˆ‡ã‚Šæ›¿ãˆã¦è¡¨ç¤ºã™ã‚‹ã“ã¨ã§çµµã‚’å‹•ã‹ã™ã¨ã„ã†è¡¨ç¾ã‚’実ç¾ã—ã¦ã„ã¾ã™ï¼ˆã‚ˆãパラパラマンガã«ä¾‹ãˆã‚‰ã‚Œã¾ã™ãŒã€ãã‚“ãªæ„Ÿã˜ã§ã™ï¼‰ã€‚ã“ã®äººé–“ã®ç›®ãŒæ»‘らã‹ã«æ„Ÿã˜ã‚‹é€Ÿã•ã¨ã„ã†ã®ãŒ 1 秒間㫠30 æžšã ã£ãŸã‚Š 24 枚を切り替ãˆã‚‹ã“ã¨ã«ãªã‚Šã¾ã™ã€‚29.97 (≒30) fps ã¨ã‹ 24 fps ã¨ã‹ã®æ•°å—を耳ã«ã—ãŸã“ã¨ãŒã‚ã‚‹ã‹ã¨æ€ã„ã¾ã™ãŒã€24 fps ã®å ´åˆã¯ 1 秒間（s）ã®é–“（p）㫠24 フレーム（f）を切り替ãˆã‚‹ã“ã¨ã‚’æ„味ã—ã¾ã™ã€‚ データを全ã¦è‡ªåˆ†ã®ç«¯æœ«ã«ãƒ€ã‚¦ãƒ³ãƒãƒ¼ãƒ‰ã—ã¦ã‹ã‚‰å†ç”Ÿã—よã†ã¨ã™ã‚‹ã¨ã€ã‹ãªã‚Šé•·ã„å¾…ã¡æ™‚é–“ãŒç™ºç”Ÿã—ã¦ã—ã¾
フãƒãƒ³ãƒˆã‚¨ãƒ³ãƒ‰ã‚¨ãƒ³ã‚¸ãƒ‹ã‚¢ã®ãŸã‚ã®ç”Ÿæ”¾é€ã¨ RTMP 通信基礎
å‰å›žã€Œãƒ•ãƒãƒ³ãƒˆã‚¨ãƒ³ãƒ‰ã‚¨ãƒ³ã‚¸ãƒ‹ã‚¢ã®ãŸã‚ã®å‹•ç”»ã‚¹ãƒˆãƒªãƒ¼ãƒŸãƒ³ã‚°æŠ€è¡“基礎ã€ã§ã¯ HTTP ベースã®ã‚¹ãƒˆãƒªãƒ¼ãƒŸãƒ³ã‚°æŠ€è¡“ã«é–¢ã—ã¦å‹‰å¼·ä¼šã‚’実施ã—ã¾ã—ãŸã€‚視è´è€…ã«æ˜ åƒã‚’届ã‘ã‚‹ãŸã‚ã®ã‚¹ãƒˆãƒªãƒ¼ãƒŸãƒ³ã‚°æŠ€è¡“ã«é–¢ã—ã¦ã®ãŠè©±ã§ã—ãŸã€‚ 本記事ã¯ã€AbemaTV ã®ç”Ÿæ”¾é€ç•ªçµ„ã§æ’®å½±æ©Ÿæã‹ã‚‰é€ã‚‰ã‚ŒãŸæ˜ åƒãŒã‚¨ãƒ³ã‚³ãƒ¼ãƒ€ãƒ¼ã‚’介ã—ã¦ãƒªã‚¢ãƒ«ã‚¿ã‚¤ãƒ ã«æ”¾é€ã™ã‚‹éƒ¨åˆ†ã«ã¤ã„ã¦å‹‰å¼·ä¼šã‚’実施ã—ãŸéš›ã®è³‡æ–™ã§ã™ã€‚ 生放é€ã«ãŠã‘る動画データã®é€šä¿¡ AbemaTV ã§ã¯ç”Ÿæ”¾é€ã§æ’®å½±ã—ãŸå‹•ç”»ãƒ‡ãƒ¼ã‚¿ã®ã‚„ã‚Šã¨ã‚Šã« RTMP ã¨ã„ã†ãƒ—ãƒãƒˆã‚³ãƒ«ã‚’利用ã—ã¦ã„ã¾ã™ã€‚ RTMP ã¨ã¯ RTMP 㯠Real-Time Message Protocol ã®ç•¥ã§ã€ãã®åå‰ã®é€šã‚Šãƒªã‚¢ãƒ«ã‚¿ã‚¤ãƒ ã«ã‚³ãƒŸãƒ¥ãƒ‹ã‚±ãƒ¼ã‚·ãƒ§ãƒ³ã‚’è¡Œã†ãŸã‚ã®ãƒ—ãƒãƒˆã‚³ãƒ«ã§ã™ã€‚Web æ¥ç•Œã§ã¯ Photoshop ãªã©ã§ãŠé¦´æŸ“ã® Adobe Systems 社ãŒé–‹ç™ºã—ã¦ã„ã¾ã™ã€‚Adobe Flash Player
Cache-Control ã® Immutable æ‹¡å¼µã«ã‚ˆã‚‹ãƒªãƒãƒ¼ãƒ‰æ™‚ã®ã‚ャッシュ最é©åŒ– | blog.jxck.io
Intro ブラウザã¯ãƒªãƒãƒ¼ãƒ‰æ™‚ã«ã€ max-age ã«æº€ãŸãªã„ã‚ャッシュをæŒã£ã¦ã„ã¦ã‚‚ Conditional GET ã«ã‚ˆã£ã¦ã‚ャッシュ㮠Validate (有効性ã®å•ã„åˆã‚ã›)ã‚’è¡Œã†ã€‚ Cache-Control Extension ã¨ã—ã¦æ案ã•ã‚Œã¦ã„ã‚‹ Immutable æ‹¡å¼µã¯ã€ã‚ャッシュ㌠max-age 内ã§ã‚ã‚Œã°ãƒªãƒãƒ¼ãƒ‰æ™‚ã‚‚ã‚ャッシュヒットã•ã›ã‚‹æ‹¡å¼µã§ã‚る。 ã“ã®ãƒ˜ãƒƒãƒ€ã®åŠ¹æžœã¨ã€æœ¬ã‚µã‚¤ãƒˆã¸ã®é©ç”¨ã«ã¤ã„ã¦è¨˜ã™ã€‚ Cache-Control Cache-Control ã« max-age を指定ã™ã‚‹ã“ã¨ã§ã€ãƒ–ラウザã«ãƒªã‚½ãƒ¼ã‚¹ã‚’ã‚ャッシュã•ã›ã‚‹ã“ã¨ãŒã§ãる。 ã“ã®ã‚ャッシュ㯠max-age ã®æœŸé–“内㯠fresh ã¨ã¿ãªã•ã‚Œã€ fresh ã§ã‚ã‚Œã°ã‚µãƒ¼ãƒã¸ã®å•ã„åˆã‚ã›ãªãå†åˆ©ç”¨ã•ã‚Œã‚‹ã€‚ サーãƒã¸ã®å•ã„åˆã‚ã›(RTT)ãŒç„¡ã„ãŸã‚ã€äº‹å®Ÿä¸Šæœ€é€Ÿã®ãƒªã‚½ãƒ¼ã‚¹å–å¾—ã¨ãªã‚‹ã€‚ Reload
Prevent unnecessary network requests with the HTTP Cache  | Articles  | web.dev
How the HTTP Cache works All HTTP requests that the browser makes are first routed to the browser cache to check whether there is a valid cached response that can be used to fulfill the request. If there's a match, the response is read from the cache, which eliminates both the network latency and the data costs that the transfer incurs. The HTTP Cache's behavior is controlled by a combination of r
Webã«ãŠã‘ã‚‹ãƒãƒƒãƒˆãƒ¯ãƒ¼ã‚¯é€šä¿¡
Webã«ãŠã‘ã‚‹ãƒãƒƒãƒˆãƒ¯ãƒ¼ã‚¯é€šä¿¡ 「ãƒãƒƒãƒˆãƒ¯ãƒ¼ã‚¯ã£ã¦ãªã‚“ã ã‚ã†ï¼Ÿã€ã¨è€ƒãˆãŸã“ã¨ã¯ã‚ã‚‹ã ã‚ã†ã‹ã€‚å‰è·ã§ã‚‚プãƒã‚°ãƒ©ãƒžã¨ã—ã¦åƒã„ã¦ã„ãŸã‚‚ã®ã®ã€ï¼ˆæ¥ãšã‹ã—ãªãŒã‚‰ï¼‰çŸ¥è˜ã¯çš†ç„¡ã«è¿‘ã‹ã£ãŸã—ã€Webã®ãƒ•ãƒãƒ³ãƒˆã‚¨ãƒ³ã‚¸ãƒ‹ã‚¢ã¨ã—ã¦èˆµã‚’切ã£ãŸ2å¹´ã¨5ヶ月å‰ã¯ã€ã“ã®æ‰‹ã®è©±ãŒãƒ•ãƒãƒ³ãƒˆã‚¨ãƒ³ãƒ‰ã«é–¢ã‚ã‚‹ã¨ã¯æ€ã£ã¦ã‚‚ã„ãªã‹ã£ãŸã€‚ HTTPã ã®ã€WebSocketã ã®ã€è¨€è‘‰ã¯è€³ã«ã™ã‚‹ã‘ã©å®Ÿæ…‹ã¯ã‚ˆãã‚ã‹ã‚‰ãªã„ …ã¨ã„ã†äººã‚‚多ã„ã¨æ€ã†ã€‚ç§è‡ªèº«ã‚‚æ·±ã密ç€ã—ã¦ã„ã‚‹ã‚ã‘ã§ã¯ãªã„ã—ã€èªžã‚‹ã»ã©è©³ã—ã„ã‹ã¨è¨€ã‚れれã°ç–‘å•ç¬¦ãŒæ®‹ã‚‹ã€‚ãã‚Œã§ã‚‚ã€ä»Šã¾ã§ãƒ¢ãƒ¤ãƒ¢ãƒ¤ã—ã¦ã„ãŸã¨ã“ã‚ã‚’å°‘ã—ã§ã‚‚晴らã™æ‰‹åŠ©ã‘ãŒå‡ºæ¥ã‚Œã°ã¨æ€ã„ã€ä»Šæ—¥ã¯ã‚¤ãƒ³ã‚¿ãƒ¼ãƒãƒƒãƒˆã®ä¸–ç•Œã§ä½•ãŒèµ·ã“ã£ã¦ã„ã‚‹ã‹ã«ã¤ã„ã¦ã®è¨˜äº‹ã‚’書ããŸã„。 ãã‚‚ãもサーãƒãƒ¼ã¨ã¯ï¼Ÿ サーãƒãƒ¼ã£ã¦ä¸€ä½“何ã ã‚ã†ã¨æ€ã£ã¦ã„る人も多ã„ã®ã§ã¯ãªã„ã ã‚ã†ã‹ï¼Ÿæ‰‹å…ƒã®ãƒ‘ソコンã€iPhoneã€Androidã¨ã„ã£ãŸ クライアントã‹ã‚‰ã®è¦æ±‚ã‚’å¾…
Fetch API 解説ã€ã¾ãŸã¯ Web ã«ãŠã„㦠"Fetch ã™ã‚‹" ã¨ã¯ä½•ã‹ï¼Ÿ - Block Rockin’ Codes
Update [14/11/11]: Chromium ã§ã®å®Ÿè£…㌠M40 ã‹ã‚‰ã‚ã‚‹ãã†ãªã®ã§ã€æœ«å°¾ã«å¼•ç”¨è¿½è¨˜ã•ã›ã¦ã„ãŸã ãã¾ã—ãŸã€‚ [14/11/12]: ã“ã®è¨˜äº‹ã‚’書ãã«ã‚ãŸã£ã¦ã€è‰²ã€…ãªã‹ãŸã«ãƒ¬ãƒ“ãƒ¥ãƒ¼ã‚„åŠ©è¨€ã‚’é ‚ã„ãŸã®ã§ã™ãŒã€è¬è¾žãªã©ãŒä¸€åˆ‡æŠœã‘ã¦ã¾ã—ãŸã€æœ¬å½“ã«ã™ã„ã¾ã›ã‚“。追記ã—ã¾ã—ãŸã€ã”å”åŠ›é ‚ã„ãŸæ–¹ã€…本当ã«ã‚ã‚ŠãŒã¨ã†ã”ã–ã„ã¾ã—ãŸã€‚ WHATGW Fetch Spec WHATWG ã®ãƒ¡ãƒ³ãƒ†ãƒŠãƒ³ã‚¹ã™ã‚‹ãƒ‰ãƒ©ãƒ•ãƒˆã« Fetch Spec ãŒè¿½åŠ ã•ã‚Œã¾ã—ãŸã€‚ ã‚‚ã†ã™ã§ã«æ—¥æœ¬èªžè¨³ã‚‚ã‚ã‚Šã¾ã™ã€ã™ã°ã‚‰ã—ã„。Fetch Standard 日本語訳 ã“ã®ä»•æ§˜ã«ã¯äºŒã¤ã®ã“ã¨ãŒå®šç¾©ã•ã‚Œã¦ã„ã¾ã™ã€‚ "Fetching": Fetch ã™ã‚‹ã¨ã¯ä½•ã‹? ã®å®šç¾© "Fetch API": fetch() ã®å®šç¾© 後者ã®å®šç¾©ã«åŸºã¥ã fetch() ã¨ã„ㆠDOM API ã®å®Ÿè£…も始ã¾ã£ã¦ã„ã¾ã™ã€‚(詳細ã¯å¾Œè¿°) ã—ã‹ã—
Webを支ãˆã‚‹ãƒ—ãƒãƒˆã‚³ãƒ« - ASnoKaze blog
若者ã®ãƒ—ãƒãƒˆã‚³ãƒ«é›¢ã‚ŒãŒå«ã°ã‚Œã¦ä¹…ã—ã„ãŒã€æœ€è¿‘プãƒãƒˆã‚³ãƒ«ã¯éžå¸¸ã«ãƒ›ãƒƒãƒˆãªåˆ†é‡Žã§ã‚る。 ç›®ã¾ãã‚‹ã—ã進化ã™ã‚‹Webã«åˆã‚ã›ã€ãƒ—ãƒãƒˆã‚³ãƒ«ã®ä¸–界もç€å®Ÿã«é€²åŒ–ã—ã¦ã„る。 今ã¾ã§ãƒ–ラウザã§ã¯å‡ºæ¥ãªã‹ã£ãŸäº‹ãŒå‡ºæ¥ã‚‹ã‚ˆã†ã«ãªã‚Šã€Webサービスをより安全ã«ä½¿ãˆã‚‹ã‚ˆã†ã«ãªã£ãŸã€‚ ãã—ã¦Webã®ãƒ‘フォーマンスを大ãã改善ã™ã‚‹ãŸã‚ã«HTTP2.0ã‚‚è°è«–ã•ã‚Œã¦ã„る。 Webを支ãˆã‚‹ãƒ—ãƒãƒˆã‚³ãƒ«ã¨ã—ã¦ã€å¤§ãã分ã‘ã¦ï¼“ã¤ã«åˆ†ã‘られるã‹ã¨æ€ã†ï¼ˆç§ã®å‹æ‰‹ãªã‚¤ãƒ¡ãƒ¼ã‚¸ã€æ£ç¢ºãªå›³ã§ã¯ã‚ã‚Šã¾ã›ã‚“） Webアプリケーション ブラウザãŒä»Šã¾ã§å‡ºæ¥ãªã‹ã£ãŸã“ã¨ã‚’出æ¥ã‚‹ã‚ˆã†ã«ã—ãŸã‚Šã€Webアプリケーションã®èªè¨¼ãƒ»èªå¯ãªã©ã®æ©Ÿèƒ½ã‚’æä¾›ã™ã‚‹ãƒ—ãƒãƒˆã‚³ãƒ«ãªã©ã€‚JSやサーãƒã‚µã‚¤ãƒ‰ãƒ—ãƒã‚°ãƒ©ãƒŸãƒ³ã‚°ã§åˆ©ç”¨ã—ãŸã‚Šã™ã‚‹ã€‚ WebSocket (http://tools.ietf.org/html/rfc6455) ブラウザã¨Webサーãƒã®é–“ã§ã‚½ã‚±ãƒƒãƒˆé€šä¿¡ã‚’è¡Œã†
1
ランã‚ング
ãŠçŸ¥ã‚‰ã›
ランã‚ング
リリースã€éšœå®³æƒ…å ±ãªã©ã®ã‚µãƒ¼ãƒ“スã®ãŠçŸ¥ã‚‰ã›
最新ã®äººæ°—エントリーã®é…ä¿¡
j次ã®ãƒ–ックマーク
kå‰ã®ãƒ–ックマーク
lã‚ã¨ã§èªã‚€
eコメント一覧を開ã
oページを開ã
Building Protocols with HTTP
HTTP and 5G (fixed1)
https://www.stillhttp.com/
{{#tags}}- {{label}}
{{/tags}}