<div id="readability-page-1" class="page"><div>
                                
                                <div id="SE-762218f9-16ab-4627-940d-abe967e0ddb5">
                                    <p id="SE-2499634d-0635-4c72-83a1-6558327a4cee"><span id="SE-572b5abc-d347-4b39-bba8-030d679e8500">polling 은 일반적으로 우리가 알고있는 주기적인 요청을 통한 데이터 확인이다. 아래와 같은 장단점이 있다.</span></p><p id="SE-e584e408-c425-4824-98d2-43961964428b"><span id="SE-83b0b349-cc35-4eda-8f4d-7f26de8b1669">​</span></p><p id="SE-c8718f78-b5c6-46be-a66f-d8fc21480a7a"><span id="SE-5444620e-b34b-4058-bc4d-2ed45b7e3d17">장점 :</span></p><ul><li><p id="SE-e0333197-978e-4e54-9cc4-0cd3a16a2543"><span id="SE-e4239411-636a-4202-bbcb-02ed09357013">구현이 쉽다.</span></p></li></ul><p id="SE-871dcf8b-07ab-4a37-891d-83a70a12be78"><span id="SE-15953afc-039a-4caa-9120-3121c00291df">​</span></p><p id="SE-6fdd3bde-a1da-4d6b-b2b6-7df88716edb3"><span id="SE-bbcb0df5-2d5e-4fd0-90f4-7e0cd2e9558b">단점 :</span></p><ul><li><p id="SE-65a000d1-9b69-4281-bf9a-0f9cb72c9107"><span id="SE-4262a02e-141f-44db-b9bc-84b80e058367">서버에 부담이 갈 수 있다.</span></p></li><li><p id="SE-30cc0885-8ddf-405a-a064-5e788a53e958"><span id="SE-b537204f-9c77-4fae-b87c-f749db5605e1">쓸모없는 요청/응답으로 인해 쓸모없는 트래픽 (ingress / egress) 을 유발한다.</span></p></li><li><p id="SE-5ddbe52a-c604-4dd0-947c-9723750ee0ca"><span id="SE-f687d47a-7a33-4a30-9971-ae574d03cf40">서버의 데이터 변경을 실시간으로 받을수 없다.</span></p></li></ul><p id="SE-42276af8-785c-4721-95c7-5f85318ac9bf"><span id="SE-9b3f5c1c-4f87-4479-8d4a-217c7f22198e">​</span></p><p id="SE-86a8e69b-33b4-4351-ae2f-5e0c7485bb4d"><span id="SE-6960e799-8b4e-40dc-ad22-c64b66064fae">아래는 스프링 + react 로 구현한 예제</span></p><p id="SE-908f2f3d-d174-4c49-86e4-302de641ec46"><span id="SE-25b07b2d-cc05-4b1e-b165-939389cf03b8">​</span></p><p id="SE-6ceea2e9-4bd4-4cf8-82b1-8fafad0cc19e"><span id="SE-60e289d6-c588-492e-8cb1-08ddb19d8f6c">springboot :</span></p>
                            </div>                <div id="SE-df866b06-6590-4a24-a733-93a0fac6f9eb">
                                    <p>@CrossOrigin("*")
@RestController
class PollingController {
    val message = AtomicReference&lt;String&gt;(null)

    @GetMapping("/poll")
    fun getMessage(): ResponseEntity&lt;String&gt; {
        val result = message.get() ?: return ResponseEntity.noContent().build()
        message.set(null)
        return ResponseEntity.ok(result)
    }

    @PostMapping("/poll")
    fun setMessage(newMessage: String) {
        message.set(newMessage)
    }
}</p>
                                </div>                                <div id="SE-ef9e3196-805a-4809-b7c6-d857ab2bcb1f">
                                    <p>'use client';

import { useEffect, useState } from 'react';

export default function Home() {
  const [message, setMessage] = useState('');

  const poll = async () =&gt; {
    const res = await fetch('http://localhost:8080/poll', {
      method: 'GET',
    });

    let text = await res.text();
    if (text === '' || text === null) {
      text = 'no message';
    }

    setMessage(text);
  };

  useEffect(() =&gt; {
    const interval = setInterval(poll, 2000);
    return () =&gt; clearInterval(interval);
  }, [message]);

  return (
    &lt;div className="flex flex-col justify-center items-center w-full h-screen"&gt;
      &lt;h1&gt;Http Practice&lt;/h1&gt;
      &lt;p&gt;message: {message}&lt;/p&gt;
    &lt;/div&gt;
  );
}
</p>
                                </div>                                <div id="SE-6b8e56cd-87c6-4596-9026-4d5c37b14ec3">
                                <p><a href="#" onclick="return false;" data-linktype="img" data-linkdata="{&quot;id&quot; : &quot;SE-6b8e56cd-87c6-4596-9026-4d5c37b14ec3&quot;, &quot;src&quot; : &quot;https://mblogthumb-phinf.pstatic.net/MjAyNTA5MTJfMjk1/MDAxNzU3NjUyNzc2MjQ4.eBxn3KUKg0g2vcawc_5Nc0_0FNYk6vA3Npuu5kEwObMg.E6Czc3HHNJfn3vMWLRgyBZBIyxxCvUluBDMyTqmRhQEg.PNG/%EC%8A%A4%ED%81%AC%EB%A6%B0%EC%83%B7_2025-09-12_%EC%98%A4%ED%9B%84_1.52.54.png&quot;, &quot;originalWidth&quot; : &quot;429&quot;, &quot;originalHeight&quot; : &quot;229&quot;, &quot;linkUse&quot; : &quot;false&quot;, &quot;link&quot; : &quot;&quot; }">
                                        <img src="https://mblogthumb-phinf.pstatic.net/MjAyNTA5MTJfMjk1/MDAxNzU3NjUyNzc2MjQ4.eBxn3KUKg0g2vcawc_5Nc0_0FNYk6vA3Npuu5kEwObMg.E6Czc3HHNJfn3vMWLRgyBZBIyxxCvUluBDMyTqmRhQEg.PNG/%EC%8A%A4%ED%81%AC%EB%A6%B0%EC%83%B7_2025-09-12_%EC%98%A4%ED%9B%84_1.52.54.png?type=w800" data-width="429" data-height="229" alt="">
                                    </a>
                                </p>
                        </div>
                <div id="SE-7c3ba9c7-4aa9-4cb4-bf80-ce7457396234">
                                <p><a href="#" onclick="return false;" data-linktype="img" data-linkdata="{&quot;id&quot; : &quot;SE-7c3ba9c7-4aa9-4cb4-bf80-ce7457396234&quot;, &quot;src&quot; : &quot;https://mblogthumb-phinf.pstatic.net/MjAyNTA5MTJfMjQw/MDAxNzU3NjUyNzk0MzQ3.VBjPMzE6mhpg9K8KAOJlYwBqDx8iTcbIHIrikdw7PfYg.Uroziz92js3UbEB9RmIGyknPbGI8h1Z-Ezu5efHuyXMg.PNG/%EC%8A%A4%ED%81%AC%EB%A6%B0%EC%83%B7_2025-09-12_%EC%98%A4%ED%9B%84_1.53.12.png&quot;, &quot;originalWidth&quot; : &quot;1284&quot;, &quot;originalHeight&quot; : &quot;335&quot;, &quot;linkUse&quot; : &quot;false&quot;, &quot;link&quot; : &quot;&quot; }">
                                        <img src="https://mblogthumb-phinf.pstatic.net/MjAyNTA5MTJfMjQw/MDAxNzU3NjUyNzk0MzQ3.VBjPMzE6mhpg9K8KAOJlYwBqDx8iTcbIHIrikdw7PfYg.Uroziz92js3UbEB9RmIGyknPbGI8h1Z-Ezu5efHuyXMg.PNG/%EC%8A%A4%ED%81%AC%EB%A6%B0%EC%83%B7_2025-09-12_%EC%98%A4%ED%9B%84_1.53.12.png?type=w800" data-width="693" data-height="180" alt="">
                                    </a>
                                </p>
                        </div>
                <div id="SE-48bc0f2b-ac04-4f8a-8634-b21238847718">
                                <p><a href="#" onclick="return false;" data-linktype="img" data-linkdata="{&quot;id&quot; : &quot;SE-48bc0f2b-ac04-4f8a-8634-b21238847718&quot;, &quot;src&quot; : &quot;https://mblogthumb-phinf.pstatic.net/MjAyNTA5MTJfMjEg/MDAxNzU3NjUyODIwNTYw.eKFoxHstvmA5evctHEGe49b5N_SwyX1XS5lBM0CDblIg.EQPb2b9sBX0sVKiZ4H4GEq6LIBMZnoZI0ryWjwvKPlUg.PNG/%EC%8A%A4%ED%81%AC%EB%A6%B0%EC%83%B7_2025-09-12_%EC%98%A4%ED%9B%84_1.53.37.png&quot;, &quot;originalWidth&quot; : &quot;322&quot;, &quot;originalHeight&quot; : &quot;219&quot;, &quot;linkUse&quot; : &quot;false&quot;, &quot;link&quot; : &quot;&quot; }">
                                        <img src="https://mblogthumb-phinf.pstatic.net/MjAyNTA5MTJfMjEg/MDAxNzU3NjUyODIwNTYw.eKFoxHstvmA5evctHEGe49b5N_SwyX1XS5lBM0CDblIg.EQPb2b9sBX0sVKiZ4H4GEq6LIBMZnoZI0ryWjwvKPlUg.PNG/%EC%8A%A4%ED%81%AC%EB%A6%B0%EC%83%B7_2025-09-12_%EC%98%A4%ED%9B%84_1.53.37.png?type=w800" data-width="322" data-height="219" alt="">
                                    </a>
                                </p>
                        </div>
                    </div></div>

나만의공간。

KIM JUNGHWAN

polling 은 일반적으로 우리가 알고있는 주기적인 요청을 통한 데이터 확인이다. 아래와 같은 장단점이 있다. 장점 : 구현이 쉽다. 단점 : 서버에 부담이 갈 수 있다. 쓸모없는 요청/응답으로 인해 쓸모없는 트래픽 (ingress / egress) 을 유발한다. 서버의 데이터 변경을 실시간으로 받을수 없다. 아래는 스프링 + react 로 구현한 예제 springboot : react : 결과 :

[HTTP] (short) Polling

댓글