Token ์ €์žฅ ์œ„์น˜

token์€ cookie์— ์ €์žฅํ•  ์ˆ˜๋„, Web Storage์— ์ €์žฅํ•  ์ˆ˜๋„, Client ์ž์ฒด์— ์ €์žฅํ•  ์ˆ˜๋„ ์žˆ๋‹ค.

 

Cookie

  • ์ฟ ํ‚ค๋Š” ์„œ๋ฒ„๊ฐ€ ๋ณด๋‚ธ ๋ฐ์ดํ„ฐ๋ฅผ ์ตœ๋Œ€ 4KB๊นŒ์ง€ ์ €์žฅ ๊ฐ€๋Šฅํ•˜๋‹ค.
  • ํด๋ผ์ด์–ธํŠธ์—์„œ Credential ์†์„ฑ์œผ๋กœ ํ—ˆ์šฉํ•˜๋ฉด ์„œ๋ฒ„์—์„œ ์ ‘๊ทผ ๊ฐ€๋Šฅํ•˜๋‹ค.
  • HTTP Request ์‹œ ์ž๋™์œผ๋กœ ํฌํ•จ๋˜์–ด ์„œ๋ฒ„์— ์ฟ ํ‚ค ์ •๋ณด๋ฅผ ์ œ๊ณต ๊ฐ€๋Šฅํ•˜๋‹ค.
  • HttpOnly ์„ค์ •์„ ์ด์šฉํ•˜์—ฌ ์‚ฌ์šฉ์ž๊ฐ€ ์ œ์–ดํ•  ์ˆ˜ ์—†๋„๋ก ๋งŒ๋“ค ์ˆ˜ ์žˆ๋‹ค.

 

Web Storage

  • Session Storage
    • ์„œ๋ฒ„์—์„œ ์ ‘๊ทผํ•  ์ˆ˜ ์—†๋‹ค.
    • ์„ธ์…˜์ด ์ข…๋ฃŒ๋˜๋ฉด ๋ชจ๋‘ ์‚ญ์ œ ๋œ๋‹ค.
    • 5~10MB์˜ ํฌ๊ธฐ๋ฅผ ๊ฐ–๋Š”๋‹ค.
  • Local Storage
    • ์„œ๋ฒ„์—์„œ ์ ‘๊ทผํ•  ์ˆ˜ ์—†๋‹ค.
    • ๋ฐ˜ ์˜๊ตฌ์ ์œผ๋กœ ์ €์žฅํ•  ์ˆ˜ ์žˆ๋‹ค.
    • 5~10MB์˜ ํฌ๊ธฐ๋ฅผ ๊ฐ–๋Š”๋‹ค.

 

Client Side

  • ํด๋ผ์ด์–ธํŠธ ์„œ๋ฒ„์— ์ฟ ํ‚ค๋ฅผ ์ €์žฅํ•ด๋‘๊ณ  ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๋‹ค.

 

์ฐธ๊ณ 

https://velog.io/@neity16/NodeJS-Token-์ €์žฅ-์œ„์น˜์˜-๊ณ ์ฐฐ

https://velog.io/@ehdrms2034/Access-Token-์ €์žฅ-์œ„์น˜์—-๋Œ€ํ•œ-๊ณ ์ฐฐ

๋ฐ˜์‘ํ˜•

'์›น (WEB) > ๊ณต๋ถ€' ์นดํ…Œ๊ณ ๋ฆฌ์˜ ๋‹ค๋ฅธ ๊ธ€

Micro Service Architecture์ด๋ž€?  (0) 2021.07.22
Refresh Token  (0) 2021.07.22
OAuth 2.0  (0) 2021.07.22
React-query :: api fetch ์‹œ ์‚ฌ์šฉํ•˜๋Š” ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ  (0) 2021.07.10
React-query :: Query Invalidation  (0) 2021.07.10