david's daily developer note

[BE] 포스트맨 + 엑셀 조합으로 API 실행 자동화 -3 (HTML Parsing) 본문

[Develop] Web/Back-end

[BE] 포스트맨 + 엑셀 조합으로 API 실행 자동화 -3 (HTML Parsing)

mouse-david 2023. 9. 19. 23:14
728x90

이전 글에서는 포스트맨 Collection단위로 인증 정보 및 RSA 암호화 관련한 것을 소개하였다.

2023.09.19 - [[Develop] Web/Back-end] - [BE] 포스트맨 + 엑셀 조합으로 API 실행 자동화 -1 (Authorization)

2023.09.19 - [[Develop] Web/Back-end] - [BE] 포스트맨 + 엑셀 조합으로 API 실행 자동화 -2 (RSA)

이번 글에서는 다음 API 요청에 필요한 필수 파라미터값을 서버에서 JSON 형태로 받지 못하고,
결과 페이지(HTML)를 받는 상황에서 추출(parsing)하는 예시를 본다.

예시를 가정하면,
1. 페이지를 접속, 필요정보는 서버에서 리다이렉트되면서 전달받은 HTML에 포함
2. 페이지에서 호출하는 API에 필요한 정보는 프론트 로직에서 가공해서 사용하는 방식
3. 관련 정보를 받는 API가 없는 상황

서버로 부터 받은 다음의 예시 HTML에서 회원 ID (customerId)를 추출

<!doctype html>
<html lang="ko">

<head>
	<title></title>
	<meta charset="utf-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta http-equiv="expires" content="0">
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
</head>

<body class="cumstomer-info">
	<div id="wrap">
		<form id="frm" method="post">
			<header id="header"></header>
			<input type="hidden" name="customerId" value="1001" />
			<input type="hidden" name="customerRole" value="일반" />
		</form>
	</div>
	<!--//wrap-->
</body>

</html>

1. 페이지를 가져오는 요청을 만들고 Tests에 받아온 아래 코드를 작성

pm.test('GET CUSTOMER PAGE', function() {
    const $ = cheerio.load(pm.response.text());
    let customer_id = $('input[type=hidden]').attr("value");
    console.log(`customer Id :`+ customer_id);
    pm.collectionVariables.set('CUSTOMER_ID', customer_id);
})

포스트맨에서 기본 제공하는 cheerio 라이브러리를 사용하여 html의 요소를 추출할 수 있다.
1번줄에서 요청에 받은 응답(html)을 저장한다.
2번줄에서 $('   ') 함수를 사용하여 요소를 추출한다.
$함수는 jQuery와 동일하게 동작하며, 태그/클래스/이름/속성 기반으로 선택이 가능하다.
추출된 customer ID는 Collection variables인 {{CUSTOMER_ID}}에 저장한다.

추가적인 내용은 cheerio 문서를 참고

 

Welcome to Cheerio! | cheerio

Let's get a quick overview of Cheerio in less than 5 minutes.

cheerio.js.org

2. 다음 API 요청에 {CUSTOMER_ID}}를 파라미터로 적용하고 요청한다.

일단, 여기까지 API 묶음으로 자동화하는 과정에서 만날 수 있는 문제 해결법을 정리해보았다.

다음 글에서는 최종적으로
엑셀의 열의 순차적으로 읽어서 파라미터로 설정하고 지금까지 만든 Collection을 자동으로 수행하는 방법을 소개한다.

 

다음 글 보기

2023.09.19 - [[Develop] Web/Back-end] - [BE] 포스트맨 + 엑셀 조합으로 API 실행 자동화 -4 (CSV Automation)

728x90

'[Develop] Web > Back-end' 카테고리의 다른 글

[BE] IntelliJ + MariaDB Local Setting  (1) 2023.10.24
[BE] 포스트맨 + 엑셀 조합으로 API 실행 자동화 -2 (RSA)  (0) 2023.09.19
[BE] 포스트맨 + 엑셀 조합으로 API 실행 자동화 -4 (CSV Automation)  (0) 2023.09.19
[BE] 포스트맨 + 엑셀 조합으로 API 실행 자동화 -1 (Authorization)  (0) 2023.09.19
[BE] IntelliJ + Spring + Maven 기존 프로젝트 서버 설정 체크  (0) 2023.09.11
'[Develop] Web/Back-end' Related Articles more