syn.$w: 화면 개발 및 거래 업무 기능을 제공합니다.

속성

$webform version을 반환합니다.

메서드

sessionStorage 또는 localStorage에 데이터를 저장합니다.
sessionStorage 또는 localStorage에 데이터를 조회합니다.
sessionStorage 또는 localStorage에 데이터를 삭제합니다.
sessionStorage 또는 localStorage에 저장된 전체 키 목록을 조회합니다.
화면 내 이벤트가 발생하는 노드 > 활성화 중인 노드 > 포커스중인 노드 순서로 조회합니다.
JSON 객체를 확장합니다.
페이지 로드 시 자동으로 1회 호출되어 폼 제출 처리, SSO 사용자 정보, 탭 순서 등 화면 부트스트랩을 수행합니다. 이미 자동 실행되었으므로 버튼은 재호출 대신 현재 상태(pageScript, isPageLoad)만 조회합니다.
엘리먼트의 triggerOptions 속성(JSON 문자열)을 파싱하여 반환합니다.
triggerID/action 조합으로 등록된 event 핸들러를 간접적으로 실행합니다. 아래 예시는 syn.$w.scrollToTop() 버튼의 클릭 이벤트를 간접 실행합니다.
"syn.$l"과 같은 모듈 경로 문자열로 실제 모듈 객체 참조를 조회합니다.
transaction 설정(functionID, inputs, outputs)을 현재 화면의 거래 목록($this.config.transactions)에 등록합니다. 네트워크 요청 없이 로컬 등록만 수행하므로 백엔드 없이도 확인할 수 있습니다.
거래 요청 정보를 조회합니다.
거래 응답 정보를 적용합니다.
functionID(GD01)로 등록된 transaction 설정을 기반으로 입력값 수집, 서버 요청, 응답 매핑까지 한 번에 수행합니다.
주의: 이 항목은 실제 HandStack 백엔드/거래 모듈이 연결되어 있어야 정상 동작합니다. 백엔드 없이 실행하면 오류 메시지 또는 빈 결과가 표시되며, 이는 정상적인 동작입니다.
transaction 화면 매핑 설정 없이 functionID/transactionID 등 값을 직접 지정해 서버에 거래를 요청합니다(Promise 반환).
주의: 이 항목은 실제 HandStack 백엔드/거래 모듈이 연결되어 있어야 정상 동작합니다. 백엔드 없이 실행하면 오류 메시지가 표시되며, 이는 정상적인 동작입니다.
functionID를 기준으로 서버 전송용 거래 객체의 기본 골격(programID, transactionID, inputs 등 빈 값)을 생성합니다. 네트워크 요청 없이 객체 구조만 확인합니다.
화면 스크롤을 최상위로 이동합니다.
지정한 엘리먼트 위치까지 부드럽게(easing) 스크롤 이동합니다. offset 값만큼 여유를 둘 수 있습니다.
웹 페이지의 favicon 이미지를 설정합니다.
웹 페이지 주소의 결과를 파일로 다운로드 합니다.
지정한 시간(ms) 동안 대기하는 Promise를 반환합니다. callback을 전달하면 setTimeout으로 동작합니다.
엘리먼트와 하위 노드에 연결된 on* 인라인 이벤트 핸들러와 등록된 이벤트를 재귀적으로 제거합니다(메모리 누수 방지).
거래 전송 시 참고할 서비스 객체 값을 문자열로 저장합니다(syn.$w.serviceObject).
xmlHttp()로 XMLHttpRequest 인스턴스를 생성하고, setServiceClientHeader()로 인증 헤더(CertificationKey)를 설정합니다.
XML 문자열을 DOMParser로 파싱하여 Document 객체로 반환합니다.
Proxy 기반 send() 메서드로 http/https 요청을 수행하는 경량 fetch 래퍼입니다. 이 예시는 같은 경로의 sample.json을 조회하므로 백엔드 없이도 동작합니다.
api 방식으로 http 프로토콜 요청을 수행합니다. 참고: 이 버튼들은 syn.$w(webform)가 아닌 형제 모듈 syn.$r(request)의 httpFetch() 기능을 보여주는 예시입니다.
외부 javascript를 화면에 동적으로 로드합니다.
외부 stylesheet를 화면에 동적으로 로드합니다.
런타임에 <style> 시트를 가져오거나 생성하고(getDynamicStyle), CSS 규칙을 추가(addCssRule)/삭제(removeCssRule)합니다.
pseudoStyle()은 selector 1개, pseudoStyles()는 여러 selector/cssText 조합을 하나의 <style> 태그로 일괄 적용합니다.
웹 페이지 주소의 결과를 텍스트로 조회합니다.
웹 페이지 주소의 결과를 Json 객체로 조회합니다.
XMLHttpRequest 기반으로 JSON 주소를 동기/비동기 방식으로 요청하고 success/callback 함수를 실행합니다. 같은 경로의 sample.json을 조회하므로 백엔드 없이도 동작합니다.
이미지 주소를 미리 로드하고, 실패 시 fallback 이미지로 재시도합니다(Promise<HTMLImageElement>).
아래로 스크롤하면 표시자가 화면에 들어올 때마다 추가 로드가 자동 실행됩니다(최대 3회 후 자동 중지).
불러오는 중 표시자
IntersectionObserver 기반으로 placeholder 엘리먼트가 화면(또는 지정한 root)에 들어오면 loadMore 콜백을 실행하는 무한 스크롤/지연 로딩 헬퍼입니다.
scrollToElement() 데모의 목적지 앵커입니다.