웹 버전 사용 튜토리얼
이 튜토리얼에서는 브라우저 기반 호스트 콘솔을 사용하여 심박·혈중 산소 모듈을 연결하고 모니터링하는 방법을 설명합니다. 웹 버전은 Web Serial로 시리얼 포트에 직접 접근하므로 Python이나 .exe를 설치할 필요가 없으며 Windows, macOS, Linux에서 모두 사용할 수 있습니다.
온라인 주소:https://juxi-technology.github.io/JUXI_HeartRate_SPO2/
웹 버전과 데스크톱 호스트 콘솔은 동일한 Modbus RTU 프로토콜(슬레이브 주소
0x20, 9600 보레이트)을 사용하며 판독값이 완전히 동일합니다.
1. 환경 요구 사항
- 데스크톱 Chrome, Edge 또는 Opera(Web Serial 지원 필요)
- Safari, Firefox, 모바일 브라우저는 Web Serial이 구현되지 않아 시리얼 포트에 연결할 수 없습니다
- USB-TTL 변환 드라이버(CH340, CP2102, FT232 등)
- 페이지를 불러오려면 인터넷 연결 필요
- 브라우저는 한 번에 하나의 시리얼 장치만 페이지에 허용
2. 하드웨어 연결
| 심박·혈중 산소 모듈 | USB-TTL 변환 |
|---|---|
| VCC | 5V(3.3V에 연결하지 마십시오) |
| GND | GND |
| TX | RX(교차 연결) |
| RX | TX(교차 연결) |
⚠️ TX와 RX는 반드시 교차 연결해야 합니다. 연결한 후 USB-TTL 변환 모듈을 컴퓨터에 꽂습니다.
3. 장치 연결
- 데스크톱 Chrome / Edge / Opera로 위의 온라인 주소를 엽니다.
- 보레이트는 모듈과 동일하게 9600으로 유지합니다.
- 「시리얼 포트 연결」을 클릭하고 브라우저 팝업에서 모듈에 해당하는 USB 시리얼 장치를 선택합니다.
- 상태가 「연결됨, 수집 대기」로 표시되면 연결 성공이며, 버튼 옆에 선택한 장치가 표시됩니다.
시리얼 파라미터는 8 데이터 비트, 1 스톱 비트, 패리티 없음, 흐름 제어 없음으로 고정되어 있으며 페이지가 자동으로 설정하므로 수동 설정이 필요 없습니다.
4. 수집 및 모니터링 시작
- 「수집 시작」을 클릭합니다. 모듈 LED가 켜지고 상태가 「수집 시작됨, LED 켜짐」으로 바뀝니다.
- 손가락을 센서 위에 올려 광학 영역을 완전히 덮습니다. 가볍게 올리기만 하고 힘껏 누르지 마십시오.
- 「모니터링 시작」을 클릭합니다. 상태가 「모니터링 중...」으로 바뀌고 실시간 데이터 갱신이 시작됩니다.
5. 화면 설명
실시간 데이터
| 지표 | 단위 | 설명 |
|---|---|---|
| 혈중 산소 (SPO2) | % | 혈중 산소 포화도 |
| 심박수 | 회/분 | 맥박수 |
| 온도 | °C | 모듈 기판 온도(체온 아님) |
필터링: 기본으로 켜져 있습니다. 판독값에 5점 중앙값 평활화를 적용하고 정상 범위(심박수 35–220, 혈중 산소 70–100%, 온도 0–60 °C)를 벗어난 이상값을 제거합니다. 제거된 개수는 데이터 영역 아래에 「이상값 N개 제거됨」처럼 표시됩니다. 체크를 해제하면 처리되지 않은 원시 판독값을 볼 수 있습니다.
상태 표시: 연결 안 됨 / 장치 선택 대기… / 연결됨, 수집 대기 / 수집 시작됨, LED 켜짐 / 수집 종료됨, LED 꺼짐 / 모니터링 중… / 모니터링 중지됨 / 장치 연결 끊김 / 현재 브라우저는 Web Serial을 지원하지 않습니다.
언어 전환
오른쪽 위의 EN / 中文 버튼으로 화면 언어를 전환합니다. 보레이트와 필터링 스위치 선택은 브라우저에 저장되어 다음에 열 때 마지막 설정이 유지됩니다.
사용 문서 탭
상단의 「사용 문서」 탭에는 본 제품의 11개 언어 튜토리얼이 내장되어 있어 페이지 안에서 직접 언어를 전환하며 읽을 수 있습니다.
6. 중지 및 연결 해제
다음 순서로 조작하는 것이 좋습니다.
- 「모니터링 중지」 클릭
- 「수집 종료」 클릭 — LED 꺼짐
- 「연결 해제」 클릭
7. 데이터 해석
| 데이터 | 정상 범위 | 설명 |
|---|---|---|
| 혈중 산소 SpO2 | 95% – 100% | 90% 미만이면 병원 진료 권장 |
| 심박수 | 60 – 100 회/분 | 성인 안정 시 범위 |
| 온도 | 25 – 35 °C | 기판 센서 온도(체온 아님) |
방금 연결했거나 손가락이 제대로 놓이지 않았을 때 -1이 표시되는 것은 정상입니다.
8. 데스크톱 호스트 콘솔과의 차이
| 비교 항목 | 웹 버전 | 데스크톱 호스트 콘솔 |
|---|---|---|
| 설치 | 설치 불필요 | .exe 또는 Python 스크립트 실행 필요 |
| 실행 환경 | 브라우저 | Windows |
| 통신 방식 | Web Serial | 시스템 시리얼 포트 |
| 오프라인 사용 | 미지원, 페이지 로드에 인터넷 필요 | 지원 |
| 프로토콜 및 판독값 | 동일 | 동일 |
9. 자주 묻는 질문
Q1: 「현재 브라우저는 Web Serial을 지원하지 않습니다」라고 표시됩니다. 데스크톱 Chrome, Edge 또는 Opera로 바꾸십시오. Safari, Firefox, 모바일 브라우저는 모두 Web Serial을 지원하지 않습니다.
Q2: 「시리얼 포트 연결」을 클릭해도 팝업에 장치가 없습니다. USB-TTL 변환 드라이버가 설치되어 있는지, 데이터 케이블이 데이터 전송을 지원하는지 확인하십시오. 다른 USB 포트를 사용하거나 다시 꽂은 후 재시도하십시오.
Q3: 연결에 실패합니다. 시리얼 포트가 다른 프로그램(시리얼 어시스턴트, Arduino IDE 등)에 의해 점유되어 있지 않은지, 장치 전원이 켜져 있는지 확인하십시오.
Q4: 「수집 시작」을 클릭해도 LED가 켜지지 않습니다. VCC가 3.3V가 아닌 5V에 연결되어 있는지 확인하고 TX/RX 교차 연결을 점검하십시오.
Q5: 데이터가 계속 -1로 표시됩니다. 「수집 시작」을 클릭했는지 확인하고 손가락이 센서 광학 영역을 완전히 덮도록 한 뒤 수 초간 안정적으로 유지하십시오.
Q6: 장치가 뽑혔습니다. 페이지에 「장치 연결 끊김」이 표시됩니다. 다시 꽂은 후 「시리얼 포트 연결」을 다시 클릭하십시오.
10. 주의사항
- 센서를 먼저 연결한 후 USB를 꽂으십시오.
- 센서는 반드시 5V로 전원을 공급해야 하며 3.3V에서는 정상 동작하지 않을 수 있습니다.
- 측정 시 손가락으로 광학 영역을 완전히 덮고 힘껏 누르지 마십시오.
- 센서에 강한 빛이 직접 비치지 않도록 하십시오.
- 브라우저는 한 번에 하나의 시리얼 장치만 허용하므로 여러 장치는 각각 연결해야 합니다.