๋ณธ๋ฌธ ๋ฐ”๋กœ๊ฐ€๊ธฐ
๋ ˆ๊ฑฐ์‹œ

2022.02.10์˜ ๊ธฐ๋ก

by GroovyArea 2022. 2. 10.

โ–ถ ์˜ค๋Š˜ ์‹คํ˜„ ๊ฐ€๋Šฅํ•œ ์„ธ๋ถ€ ๋ชฉํ‘œ

 

=>  ๊ณต๋ถ€ ๊ด€๋ จ

1) AJAX ๊ฐœ๋… ์ •๋ฆฌ

2) ๊ฐ์ฒด์ง€ํ–ฅ ์ฑ… 3๋‹จ์› ์ฝ๊ณ  ์ •๋ฆฌ

 

โ–ถ ๊ณต๋ถ€ ๋‚ด์šฉ

AJAX(Asynchronous JavaScript And XML)

๋™๊ธฐ์‹ VS ๋น„๋™๊ธฐ์‹

⇒ ๋™๊ธฐ ๋ฐฉ์‹์€ ๋ฐ์ดํ„ฐ๋ฅผ ์ฒ˜๋ฆฌํ•˜๊ธฐ ์ „๊นŒ์ง€ ๋‹ค๋ฅธ ์ž‘์—… ์ˆ˜ํ–‰ ๋ถˆ๊ฐ€ ๋น„๋™๊ธฐ๋Š” ๊ฐ€๋Šฅ.

GET ๋ฐฉ์‹ ์š”์ฒญ ์‹œ ๋ฌธ์ œ์ (์ „๋‹ฌ ๊ฐ’์ด ์ ์€ ๊ฒฝ์šฐ/๊ฐ„๋‹จํ•˜๊ฒŒ ์ „๋‹ฌํ•  ๊ฒฝ์šฐ)

⇒ ์ธํ„ฐ๋„ท ์ต์Šคํ”Œ๋กœ๋Ÿฌ๋Š” URL์— ํ•œ๊ธ€ ์ „๋‹ฌ์ด ์•ˆ๋˜๋ฏ€๋กœ(๋ธŒ๋ผ์šฐ์ € ์ž์ฒด๊ฐ€ ์ž๋™ ํŒŒ์‹ฑ์ด ์•ˆ๋จ) ํ•œ๊ธ€ ๊ฐ’ ์ „๋‹ฌ ์‹œ ๋ถ€ํ˜ธํ™” ์ฒ˜๋ฆฌ๋ฅผ ํ•ด์•ผ ํ•จ.

POST ๋ฐฉ์‹์œผ๋กœ ์›น ํ”„๋กœ๊ทธ๋žจ์„ ์š”์ฒญ(์ „๋‹ฌ ๊ฐ’์ด ๋งŽ์€ ๊ฒฝ์šฐ/๋ณด์•ˆ์„ ์š”ํ•จ)

⇒ send ๋ฉ”์†Œ๋“œ์˜ ๋งค๊ฐœ๋ณ€์ˆ˜๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ๊ฐ’ ์ „๋‹ฌ

⇒ ๊ธฐ๋ณธ์€ ์›์‹œ ๋ฐ์ดํ„ฐ๋กœ ์ „๋‹ฌ(ํ…์ŠคํŠธ, multipart/form data → ์›์‹œ๋ฐ์ดํ„ฐ)

⇒ ํ•ด๊ฒฐ๋ฒ•) “application/x-www-form-unlencoded” ํ˜•์‹(๋ฌธ์ž๋ฐ์ดํ„ฐ)์œผ๋กœ ๊ฐ’์ด ์ „๋‹ฌ๋˜๋„๋ก Request Header ๋ณ€๊ฒฝ Content-Type(request์˜ ๋ฐ”๋””) ๋ณ€๊ฒฝํ•˜๋ฉด ๋จ.

⇒ ์ˆœ์„œ : open → ๋ณ€๊ฒฝ → send

⇒ ํ•œ๊ธ€ ์ „๋‹ฌ ๋ฐ›์„ ์‹œ ์ „๋‹ฌ๋œ ๊ฐ’์— ๋Œ€ํ•œ CharacterSet ์ธ์ฝ”๋”ฉ ๋ณ€๊ฒฝ

๋ชจ๋“ˆ

⇒ ๊ฐ’์„ ์ „๋‹ฌํ•˜๋Š” ํ•จ์ˆ˜๋“ค์˜ ๋ชจ์ž„

AJAX๋ฅผ ์ด์šฉํ•œ ์ง€์†์ ์ธ ๋ฐ์ดํ„ฐ๋ฅผ ์ œ๊ณต๋ฐ›์„ ๋•Œ์˜ ๋ฌธ์ œ์ 

⇒ ๋ฌธ์ œ) ๋™์ผํ•œ ์›น ํ”„๋กœ๊ทธ๋žจ์„ ์ง€์†์ ์œผ๋กœ ์š”์ฒญํ•  ๊ฒฝ์šฐ ๋ธŒ๋ผ์šฐ์ € ์บ์‹ฑ ๊ธฐ๋Šฅ์— ์˜ํ•ด ์„œ๋ฒ„์˜ ์‘๋‹ต ๊ฒฐ๊ณผ๊ฐ€ ์•„๋‹Œ ๊ธฐ์กด ์‘๋‹ต ๊ฒฐ๊ณผ ์žฌ์‚ฌ์šฉ - ์ตœ์ดˆ ์‘๋‹ต๊ฒฐ๊ณผ๋ฅผ ๊ณ„์† ์‚ฌ์šฉํ•จ.

⇒ ํ•ด๊ฒฐ-1) ์›น ํ”„๋กœ๊ทธ๋žจ์˜ ์š”์ฒญ URL ์ฃผ์†Œ๋ฅผ ์ง€์†์ ์œผ๋กœ ๋ณ€๊ฒฝํ•˜์—ฌ ์š”์ฒญ - QueryString ์ด์šฉ

⇒ ํ•ด๊ฒฐ-2) ์š”์ฒญ ์›นํ”„๋กœ๊ทธ๋žจ์—์„œ ์‘๋‹ต๊ฒฐ๊ณผ์— ๋Œ€ํ•œ ๋ธŒ๋ผ์šฐ์ € ์บ์‹ฑ๊ธฐ๋Šฅ์„ ๋ฌดํšจํ™” ์ฒ˜๋ฆฌ (์ž๋ฐ” or META ํƒœ๊ทธ)

CSV

⇒ ํŠน์ • ๋ฌธ์ž๋ฅผ ์ด์šฉํ•˜์—ฌ ๊ฐ’(์—ด)์ด๋‚˜ ์ •๋ณด(ํ–‰)๋ฅผ ๊ตฌ๋ถ„ํ•˜๋Š” ๋น„๊ตฌ์กฐ์ ์ธ ๋ฐ์ดํƒ€ ํ‘œํ˜„ ๋ฐฉ๋ฒ•

XML

⇒ ๊ตฌ์กฐ์ ์œผ๋กœ ์ €์žฅ๋œ ๋ฐ์ดํ„ฐ๋ฅผ ํ…์ŠคํŠธ ํ˜•ํƒœ๋กœ ํ‘œํ˜„

 


> ๊ฐ์ฒด์ง€ํ–ฅ : ํ˜„์‹ค ์„ธ๊ณ„๋ฅผ ๋ชจ๋ฐฉ x , ์‹ ์„ธ๊ณ„๋ฅผ ์ฐฝ์กฐํ•˜๋Š” ๊ฒƒ 

> ๋‹คํ˜•์„ฑ : ๋™์ผํ•œ ์š”์ฒญ์— ๋‹ค์–‘ํ•œ ๋ฐฉ์‹์œผ๋กœ ์‘๋‹ตํ•  ์ˆ˜ ์žˆ๋Š” ๋Šฅ๋ ฅ

 

> ๊ฐ์ฒด๋Š” ์ƒํƒœ์™€ ์‹๋ณ„์ž์™€ ํ–‰๋™์œผ๋กœ ์ •์˜๋œ๋‹ค.

> ํ–‰๋™์€ ์™ธ๋ถ€์„ธ๊ณ„๋กœ ๋‚˜ํƒ€๋‚ด๊ณ  ์ƒํƒœ๋Š” ์บก์Šํ™”๋˜์–ด ์ž๋ฆฌํ•œ๋‹ค.

> ํ–‰๋™์ด ์ƒํƒœ๋ฅผ ๊ฒฐ์ •ํ•œ๋‹ค. ์ฆ‰ ํ–‰๋™์€ ์ƒํƒœ์— ์˜์กด์ ์ด๋ฉฐ ์ƒํƒœ๋ฅผ ์ด์šฉํ•ด ์„œ์ˆ  ๊ฐ€๋Šฅํ•˜๋‹ค.

๋ฐ˜์‘ํ˜•

'๋ ˆ๊ฑฐ์‹œ' ์นดํ…Œ๊ณ ๋ฆฌ์˜ ๋‹ค๋ฅธ ๊ธ€

2022-02-13์˜ ๊ธฐ๋ก  (0) 2022.02.13
2022-02-11์˜ ๊ธฐ๋ก  (0) 2022.02.13
2022.1.23์˜ ๊ธฐ๋ก  (0) 2022.01.23
2022.1.21์˜ ๊ธฐ๋ก  (0) 2022.01.21
2022.1.19์˜ ๊ธฐ๋ก  (0) 2022.01.19