솔내시스템(주) - 웹 브라우저를 통한 장비 제어 (HTTP 구현) · 2019-06-21 · 4. 경로 및 파일 이름: 자원의 이름과 서버에서 폴더 위치 웹 상에서

솔내시스템㈜

http://www.sollae.co.kr

Application Note

웹 브라우저를 통한 장비 제어

(HTTP 구현) Version 2.1

http://www.sollae.co.kr/

웹 브라우저를 통한 장비 제어 (HTTP 구현) Ver. 2.1

- 1 - http://www.sollae.co.kr

1 목차

1 목차............................................................................................................................................ - 1 -

2 개요............................................................................................................................................ - 2 -

2.1 월드 와이드 웹 (World Wide Web) .......................................................................................................... - 2 -

2.2 HTTP (HyperText Transfer Protocol) .......................................................................................................... - 2 -

2.3 ezTCP 를 이용한 웹 서버 구축 ................................................................................................................... - 2 -

3 HTTP 프로토콜 ........................................................................................................................ - 4 -

3.1 URI (Uniform Resource Identifier) .............................................................................................................. - 4 -

3.2 HTTP 메시지 ........................................................................................................................................................ - 4 -

3.2.1 HTTP 요청 메시지 .................................................................................................................................... - 5 -

3.2.2 HTTP 응답 메시지 .................................................................................................................................... - 7 -

4 HTTP 구현 ............................................................................................................................. - 10 -

4.1 ezTCP 설정 ......................................................................................................................................................... - 10 -

4.2 GET Request 사용 예 .................................................................................................................................... - 12 -

4.2.1 200 OK 응답 ............................................................................................................................................ - 12 -

4.2.2 404 Not Found 응답 ............................................................................................................................ - 13 -

4.3 HTTP 자원 접근............................................................................................................................................... - 14 -

4.3.1 1:1 접속 환경 .......................................................................................................................................... - 15 -

4.3.2 다중 접속 환경 ....................................................................................................................................... - 16 -

4.3.3 HTML 코드 작성 주의 사항 ............................................................................................................. - 17 -

5 주의 사항 ............................................................................................................................... - 18 -

6 문서 변경 이력 ...................................................................................................................... - 19 -




2 개요

2.1 월드 와이드 웹 (World Wide Web)

월드 와이드 웹(World Wide Web, WWW, W3)은 인터넷(Internet)을 통해 접근이 가능하고 상

호간에 연결되어 있는 하이퍼텍스트(hypertext)로 이루어져 있는 정보 시스템을 말하며 줄여

서 웹(The Web)이라고도 합니다.

2.2 HTTP (HyperText Transfer Protocol)

HTTP 는 웹에서 사용되는 TCP/IP 응용 계층 프로토콜로 서버/클라이언트 형태로 동작합니다.

클라이언트는 서버로 요청(request)을 보내고 서버는 요청을 처리한 후 응답(response)을 보

내는 방식입니다.

그림 2-1 HTTP 프로토콜

2.3 ezTCP를 이용한 웹 서버 구축

웹 브라우저를 통해 장비를 제어하려면 HTTP 프로토콜을 지원하는 웹 서버가 필요합니다.

하지만 ezTCP 는 TCP/IP 프로토콜의 전송 계층(TCP/UDP) 까지만 구현되어 있으므로 사용자

장비에서 응용 계층 프로토콜인 HTTP 를 지원해야 합니다. 본 기술문서는 HTTP 에 대한 간략

한 설명과 함께 그 구현 방법에 대해 설명하고 있습니다.

그림 2-2 ezTCP 적용




본 문서에서 사용하는 표기법은 다음과 같습니다.

구분 표기법

16 진수 0x 를 붙여서 표시합니다.

예) 10 진수 32 0x20

바이너리 데이터 16 진수

일반 텍스트 영문 또는 숫자로 표시합니다.

0x20 <SP>

0x0D <CR>

0x0A <LF>

표 2-1 문서 내 표기법




3 HTTP 프로토콜

3.1 URI (Uniform Resource Identifier)

인터넷에서 접근할 수 있는 자원의 위치를 알려주기 위해 필요한 프로토콜로 다음과 같이

크게 4 가지 요소로 이루어져 있습니다.

1. 프로토콜: 응용 계층 프로토콜

2. 호스트네임: DNS 도메인 이름(예: www.sollae.co.kr) 혹은 IP 주소(예: 10.1.0.1)

3. 포트번호: 서버에서 사용되는 포트 번호, 생략시 기본 포트 번호 사용(HTTP 는 80 번)

4. 경로 및 파일 이름: 자원의 이름과 서버에서 폴더 위치

웹 상에서 사용되는 URI 를 특별히 URL (Uniform Resource Locator) 이라고 부르며 이 문서

의 위치는 다음과 같은 인터넷 주소(URL)로 표현할 수 있습니다.

그림 3-1 URL

3.2 HTTP 메시지

HTTP 메시지는 빈 줄(an empty line)에 의해 나뉘어지는 Header 와 Body 2 개로 구성되며

메시지 종류에 따라 Body 는 생략 가능합니다.

그림 3-2 HTTP 메시지




3.2.1 HTTP 요청 메시지

HTTP 요청 메시지는 기본 메시지 구조를 아래 그림과 같이 세분화 할 수 있습니다. 또한,

Header 는 Request Line 과 Request Headers 로 나누어 볼 수 있습니다.

그림 3-3 HTTP Request Message

Request Line

헤더의 첫 번째 줄에 위치하며 다음과 같은 형식입니다.

그림 3-4 Request Line

(예 1)

GET /documents/application/an_http_application_ko.pdf HTTP/1.1

(예 2)

GET http://www.sollae.co.kr/documents/application/an_http_application_ko.pdf HTTP/1.1

- Method

Method 는 GET, POST, HEAD, PUT, DELETE, OPTION, TRACE, CONNECT 등이 있으며

클라이언트는 이 중 하나를 사용할 수 있습니다. 이 문서는 GET 에 대해서만 설명합

니다.

- Request-URI

웹 브라우저가 요청하는 데이터를 나타냅니다. 위의 (예 1)과 같이 프로토콜과 호스

트네임은 생략 가능합니다.

- HTTP-Version

버전 1.0 과 1.1 총 2 개가 사용되고 있습니다.

(표시형식) “HTTP” “/” 1*DIGIT “.” 1*DIGIT

(예) HTTP/1.1


http://www.sollae.co.kr/documents/application/an_http_application_ko.pdf



Request Headers

HTTP Header 는 general-header, request-header, response-header, entity-header 총 4 가

지가 있습니다.

(표시형식) header-name “:” header-value

- General Headers

Header function/example

Connection 접속 옵션 지정

(예) Connection: Keep-Alive

Date 메시지가 작성된 시간

(예) Date: Thu, 03 Apr 2014 08:07:59 GMT

표 3-1 General Headers

- Request Headers


Accept

응답으로 허용하는 데이터 타입

(예) Accept: text/html,application/xhtml+xml,application/

xml;q=0.9,image/webp,*/*;q=0.8

Accept-Language

응답으로 허용하는 언어

(예) Accept-Language: ko-KR,ko;q=0.8,en-

US;q=0.6,en;q=0.4

Accept-Encoding 응답으로 허용하는 encoding type

(예) Accept-Encoding: gzip,deflate,sdch

Host 요구하는 데이터를 가지고 있는 host 와 port

(예) Host: www.sollae.co.kr

User-Agent

웹 브라우저 정보

(예) User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64)

AppleWebKit/537.36 (KHTML, like Gecko)

Chrome/33.0.1750.154 Safari/537.36

표 3-2 Request Headers

An Empty Line

<CR><LF> (0x0d, 0x0a)





3.2.2 HTTP 응답 메시지

HTTP 응답 메시지 구조는 요청 메시지와 유사하며 Request Line 대신 Status Line 이 위

치합니다.

그림 3-5 HTTP Response Message

Status Line

Header 의 첫 번째 줄에 위치하며 다음과 같은 형식입니다.

그림 3-6 Status Line

- HTTP-Version

Request Line 의 HTTP-Version 과 동일한 항목입니다.

- Status-Code

HTTP 요청 메시지에 대한 결과값으로 3 자리 숫자로 표현

다음은 Status-Code 의 첫 번째 자리 숫자에 대한 설명입니다.

코드 종류 설명

1xx Informational 임시 응답으로 다음 처리 과정 계속 필요

2xx Success 성공

3xx Redirection 요청 완료를 위해 페이지 이동이 필요

4xx Client Error 클라이언트의 요청에 오류가 있음

5xx Server Error 서버 내부 문제로 인한 오류

표 3-3 Status-Code




- Reason-Phrase

결과값에 대한 설명

Status-

Code Reason-Phrase 설명

200 OK 요청이 성공했을 때

301 Move Permanently 요청 URI 위치가 영구히 이동되었을 때

302 Found 요청 URI 위치가 임시로 이동되었을 때

400 Bad Request 문법 오류로 요청을 이해할 수 없을 때

401 Unauthorized 사용자 인증이 필요할 때 (ID/PW 방식)

403 Forbidden 서버가 요청을 거부할 때

404 Not Found 요청 URI 가 존재하지 않을 때

이유를 밝히지 않고 요청을 거부할 때

500 Internal Server Error 서버 내부 오류 발생

표 3-4 주요 Status-Code

Response Header

- Response Headers


Server Server 의 소프트웨어 정보

(예) Server: Sollae Embedded Web

WWW-Authenticate

사용자 인증 방법에 대한 정보

401 응답 코드에 반드시 포함되어야 함

(예) WWW-Authenticate: Basic realm=”ezTCP

Authorization”

표 3-5 Response Headers

- Entity Headers


Last-Modified

Entity 가 마지막으로 수정된 날짜와 시간 정보

웹 브라우저가 캐쉬를 이용할 때 사용

(예) Last-Modified: Thu, 03 Apr 2014 10:08:30 GMT

Content-Length Entity Body 의 데이터 사이즈

(예) Content-Length: 901

Content-Type Entity Body 의 데이터 타입

(예) Content-Type: text/html

표 3-6 Entity Headers




An Empty Line

<CR><LF> (0x0d, 0x0a)

Message Body

웹 브라우저 요청 URI 에 대한 데이터




4 HTTP 구현

4.1 ezTCP 설정

사용자 장비에 웹 서버를 구현하려면 ezTCP 는 TCP 서버로 동작하고 사용자 장비는 HTTP

프로토콜을 처리해야 합니다 (그림 1-2 참조). ezTCP 의 TCP 서버 동작은 “TCP/IP 통신 설정”

의 [통신모드]를 “T2S – TCP 서버” 혹은 “ATC – AT 명령”으로 선택함으로써 이루어집니다. 웹

브라우저로 접속할 URI 의 호스트 네임은 ezTCP 의 [제품 IP 주소] 항목을 사용하고 포트 번

호는 “TCP/IP 통신 설정”의 [제품 로컬포트] 항목을 사용합니다. 경로 및 파일 이름은 사용자

장비에서 직접 처리해야 됩니다. 또한 웹 서버는 HTTP 데이터를 모두 전송 후 TCP 접속을

종료해야 하므로 [접속종료 대기시간(초)] 항목 설정이 필요합니다.

“T2S – TCP 서버” 설정 예

① [통신모드] T2S – TCP 서버

② [제품 로컬포트] 80

웹 브라우저에서 URI 입력할 때 생략하면 80 번 포트로 접속합니다.

③ [접속종료 대기시간(초)] 2

마지막 데이터 통신 2 초 후에 접속이 끊기게 합니다 (ezTCP 가 설치된 네트워크의

접속 속도에 따라 조절 필요).

그림 4-1 T2S – TCP 서버




“ATC – AT 명령” 설정 예

① [통신모드] ATC – AT 명령

② [제품 로컬포트] 80

웹 브라우저에서 URI 입력할 때 생략하면 80 번 포트로 접속합니다.

③ [접속종료 대기시간(초)] 0

사용자 장비는 모든 HTTP 데이터 전송 후 ‘ATH’ 명령어를 이용해 TCP 접속을 종료

해야 합니다. TCP 접속 종료 과정에서 escape 문자(기본 값 ‘+++’)가 전송되지 않

도록 +PSE 명령어 적용이 필요합니다.

그림 4-2 ATC – AT 명령




4.2 GET Request 사용 예

4.2.1 200 OK 응답

그림 4-3 HTTP 200 OK 응답 예

위 사용 예는 웹 브라우저 주소 창에 “http://10.1.0.1”을 입력하였을 때 웹 브라우저와 사

용자 장비 사이에 오간 HTTP 요청/응답을 나타냅니다. GET 요청 ‘/’는 웹 서버의 메인 페

이지 요청을 의미하며 사용자 장비는 메인 페이지에 대한 응답으로 Status Line, Response

Header 등을 포함한 HTML 코드를 시리얼 포트로 전송하고 이 데이터를 ezTCP 가 TCP/IP

처리하여 웹 브라우저로 전송하면, 웹 브라우저는 Header 와 HTML 코드를 분석하여 화면

에 표시하게 됩니다. 이 후 ezTCP 의 [접속종료 대기시간(초)] 설정(예: 2 초) 혹은 사용자

장비의 ‘ATH’ 명령에 의해 TCP 접속이 종료 되면 모든 통신 과정이 마무리 됩니다.

그림 4-4 접속 화면 예




4.2.2 404 Not Found 응답

그림 4-5 HTTP 404 Not Found 응답 예

위 사용 예는 웹 브라우저 주소 창에 http://10.1.0.1/test.html 을 입력하여 ‘test.html’을

요청했는데, 사용자 장비에 test.html 파일이 없기 때문에 Not Found 응답을 보내는 것을

나타냅니다.

그림 4-6 접속 화면 예


http://10.1.0.1/test.html



4.3 HTTP 자원 접근

다음 HTML 코드(logo.html)를 살펴 보면 페이지 자체와 이미지 즉, ‘logo.html’과 ‘logo.jpg’

총 2 개의 자원이 있는 것을 알 수 있습니다. 이와 같이 한 페이지에 여러 자원이 존재하게

되면 웹 브라우저는 해당 자원마다 TCP 접속을 맺어 HTTP 메시지를 주고 받습니다.

HTML 코드 자원

<html>

<head><title>LOGO PAGE</title></head>

<body>

<h1>This is a LOGO page!</h1>

<img src="./logo.jpg">

</body>

</html>

HTML 코드 자체 (logo.html)

logo.jpg

표 4-1 logo.html 샘플 코드

그림 4-7 샘플 페이지 정상 접속 화면




4.3.1 1:1 접속 환경

웹 브라우저 주소 창에 http://10.1.0.1/logo.html 을 입력하면 ‘logo.html’과 ‘logo.jpg’ 2 개

의 자원에 접근하기 위해 2 개의 TCP 접속을 맺고 각각의 TCP 접속으로 HTTP GET 요청

메시지를 전송합니다. 하지만 대부분의 ezTCP 는 동시에 1 개의 TCP 접속만 사용할 수 있

기 때문에 이와 같은 형태의 HTML 페이지는 적용이 어려울 수 있습니다.

그림 4-8 웹 페이지 접속 실패 과정

1:1 접속만 가능한 ezTCP 일 경우 위와 같이 2 번째 자원에 대한 TCP 접속이 실패하게

되므로 웹 브라우저는 필요한 HTTP 자원으로 모두 받을 수 없게 됩니다. 실제 접속을 하

게 되면 아래 그림과 같이 logo.jpg 가 표시되어야 할 곳에 이미지가 제대로 표시되지 않

게 됩니다.

그림 4-9 웹 페이지 접속 실패 화면

☞ 운영체제와 웹 브라우저 종류에 따라 자원 별로 접속을 순차적으로 맺고 HTTP 요청 메

시지를 보내는 경우에는 정상적인 페이지가 나타날 수 있습니다.


http://10.1.0.1/logo.html



4.3.2 다중 접속 환경

일부 TCP 다중 접속을 지원하는 ezTCP 가 있지만 다음과 같은 이유로 적용할 수 없습니

다. ezTCP 는 시리얼 포트로부터 수신된 데이터는 현재 접속되어 있는 TCP 세션 모두로

전송하기 때문에 사용자 장비로부터 발생한 HTTP 응답 메시지가 해당 요청을 보내지 않

은 다른 TCP 세션으로 전송되는 상황이 발생합니다.

그림 4-10 다중 접속 환경 접속 과정

그림 4-11 다중 접속 환경 접속 화면

HTTP 응답 메시지가 2 개의 TCP 접속 모두로 전송되면서 위 그림과 같이 ‘logo.jpg’ 이미

지 아래에 알 수 없는 깨진 데이터가 표시됩니다.




4.3.3 HTML 코드 작성 주의 사항

사용자 장비를 통한 HTTP 구현은 4.3.1 절과 4.3.2 절과 같은 경우를 고려하여 해당

HTML 코드에 하나의 자원만 사용 가능하게 작성할 것을 권장합니다. 여러 개의 자원에

접근하는 HTML 코드는 비정상적인 웹 브라우저의 동작을 발생시킬 수 있습니다.




5 주의 사항

본 문서는 RFC2616 을 기반으로 ezTCP 를 이용한 간단한 HTTP 서버 구현 방법에 대

해 설명합니다.

당사는 본 문서를 작성함에 있어서 충분한 검토를 거쳤으나 문서 내 설명에 대해 어

떠한 보증도 하지 않으며 사전 예고 없이 변경될 수 있습니다.

좀 더 자세한 내용은 RFC2616 을 참조해주시기 바랍니다.




6 문서 변경 이력

날짜 버전 변경내용 작성자

2003.08.12 1.0 ○ 최초 배포

2014.04.11 2.0 ○ 문서 스타일 변경

○ 여러 HTTP 자원 동시 사용에 대한 설명 추가 이성운

2015.02.13 2.1 ○ 오탈자 수정 이성운


Documents

솔내시스템(주) - 웹 브라우저를 통한 장비 제어 (HTTP 구현) · 2019-06-21 · 4. 경로 및 파일 이름: 자원의 이름과 서버에서 폴더 위치 웹 상에서