XMLHttpRequest QML Type
서버로 요청을 보내기 위한 객체입니다. 더 보기...
Import Statement: | import QtQml |
속성
- onreadystatechange : function
- readyState : enumeration
- response : var
- responseText : string
- responseType : string
- responseURL : string
(since 6.6)
- responseXML : var
- status : int
- statusText : string
방법
- void abort()
- string getAllResponseHeaders()
- string getResponseHeader(headerName)
- void open(method, url, async)
- void overrideMimeType(mime)
(since 6.6)
- void send(data)
- void setRequestHeader(header, value)
상세 설명
XMLHttpRequest
객체를 사용하면 스크립트에서 양식 데이터를 제출하거나 서버에서 비동기식으로 데이터를 로드하는 등 HTTP 클라이언트 기능을 수행할 수 있습니다.
XMLHttpRequest
API는 다음과 같은 예외를 제외하고 W3C XHR 레벨 1 표준을 부분적으로 구현한 것입니다:
- 동일한 출처 정책을 적용하지 않습니다.
요청 보내기
XMLHttpRequest
API를 사용하여 요청을 보내려면 다음 단계를 따르세요:
XMLHttpRequest
객체를 만듭니다.- onreadystatechange 시그널 핸들러에 콜백 함수를 할당합니다.
- 적절한 HTTP 메서드와 요청할 URL을 사용하여 open()를 호출합니다.
- send() 호출
콜백 함수는 요청에 대한 HTTP 응답을 처리합니다. 다음 방법 중 하나를 사용하여 응답을 읽기 전에 핸들러에서 readyState 이 DONE
인지 확인하는 것이 좋습니다:
다음 예제는 요청을 보내고 응답을 읽는 방법을 보여줍니다:
import QtQuick import QtQuick.Layouts import QtQuick.Controls import "request.js" as XHR ApplicationWindow { width: 640 height: 640 visible: true ColumnLayout { anchors.fill: parent RowLayout { Layout.fillWidth: true TextField { id: urlTextField text: "https://www.example.com/index.html" Layout.fillWidth: true } Button { text: qsTr("Send!") onClicked: XHR.sendRequest(urlTextField.text, function(response) { statusTextField.text = response.status; let isPlainText = response.contentType.length === 0 contentTypeTextField.text = isPlainText ? "text" : response.contentType; if (isPlainText) contentTextArea.text = response.content; }); } } GridLayout { columns: 2 Layout.fillWidth: true Label { text: qsTr("Status code") Layout.fillWidth: true } Label { text: qsTr("Response type") Layout.fillWidth: true } TextField { id: statusTextField Layout.fillWidth: true } TextField { id: contentTypeTextField Layout.fillWidth: true } } Flickable { clip: true contentWidth: contentTextArea.width contentHeight: contentTextArea.height Text { id: contentTextArea } Layout.fillWidth: true Layout.fillHeight: true ScrollBar.vertical: ScrollBar {} ScrollBar.horizontal: ScrollBar {} } } }
앞의 스니펫은 버튼의 클릭 신호를 외부 sendRequest
함수에 연결합니다. 리소스 URL이 첫 번째 인수로 전달되고 UI 업데이트를 처리하는 콜백 함수가 두 번째 인수로 전달됩니다. 외부 request.js
파일에 존재하는 sendRequest
함수는 다음과 같이 구현할 수 있습니다:
function sendRequest(url, callback) { let request = new XMLHttpRequest(); request.onreadystatechange = function() { if (request.readyState === XMLHttpRequest.DONE) { let response = { status : request.status, headers : request.getAllResponseHeaders(), contentType : request.responseType, content : request.response }; callback(response); } } request.open("GET", url); request.send(); }
앞의 스니펫은 처음에 언급한 네 가지 간단한 단계를 따릅니다. 먼저 XMLHttpRequest
객체를 인스턴스화하고 응답을 처리할 콜백 함수를 할당합니다. 또한 서버로 요청을 보내기 전에 HTTP 메서드와 URL을 사용하여 open()를 호출합니다. sendRequest
의 두 번째 인수는 onreadystatechange 의 마지막에 호출되어 HTTP 응답에 따라 UI 업데이트를 처리합니다.
요청을 디버깅하려면 QML_XHR_DUMP
환경 변수를 1
으로 설정하세요. 그러면 다음 정보가 기록됩니다:
- 메서드 유형(GET 또는 POST), URL, 전송된 요청 본문.
- 받은 응답의 URL 및 본문.
- 네트워크 오류(있는 경우).
로컬 파일에 액세스하기
기본적으로 XMLHttpRequest
객체를 사용하여 로컬 파일 시스템에서 파일을 읽을 수 없습니다. 이 기능을 사용하여 로컬 파일에 액세스하려면 다음 환경 변수를 1
으로 설정하면 됩니다.
- QML_XHR_ALLOW_FILE_READ
- QML_XHR_ALLOW_FILE_WRITE
경고: 애플리케이션이 신뢰할 수 있는 QML 및 JavaScript 코드를 실행하는 경우에만 이 기능을 사용하세요.
응답XML 문서
현재 QML에서 지원하는 responseXML
XML DOM 트리는 웹 브라우저에서 지원되는 DOM 레벨 3 코어 API의 축소된 하위 집합입니다. 다음 객체 및 속성은 QML 구현에서 지원됩니다:
노드 | Document | Element | Attr | CharacterData | 텍스트 |
---|---|---|---|---|---|
|
|
|
|
|
|
속성 문서
onreadystatechange : function |
XMLHttpRequest
객체의 readyState 가 변경될 때마다 호출할 콜백 함수를 선택합니다.
readyState 를참조하세요 .
readyState : enumeration |
XMLHttpRequest
객체의 현재 상태를 나타냅니다.
값은 다음 중 하나가 될 수 있습니다:
상수 | 설명 |
---|---|
XMLHttpRequest.UNSENT | 요청이 초기화되지 않은 상태, 즉 open()를 호출하기 전의 상태입니다. |
XMLHttpRequest.OPENED | 요청이 초기화되었음( open()이 이전에 호출되었지만 더 이상 진행되지 않았음을 의미). |
XMLHttpRequest.HEADERS_RECEIVED | 서버로부터 응답을 받았지만 요청이 아직 완전히 처리되지 않았습니다. |
XMLHttpRequest.LOADING | 서버에서 데이터를 다운로드하는 중입니다. |
XMLHttpRequest.DONE | 요청 처리가 완료되었습니다. |
onreadystatechange도 참조하세요 .
response : var |
마지막 요청의 responseType 에 따라 String
, ArrayBuffer
또는 Document
를 반환합니다.
responseType, responseText, responseXML도 참조 하세요.
responseText : string |
마지막 응답에서 받은 데이터가 포함된 String
을 반환합니다.
responseXML도 참조하세요 .
responseType : string |
마지막으로 받은 응답의 콘텐츠 유형을 설명하는 String
을 반환합니다.
- 응답 유형이 "text" 또는 비어 있는
String
인 경우 응답 콘텐츠는 UTF-16으로 인코딩된String
입니다. - 응답 유형이 "arraybuffer"인 경우 응답 콘텐츠가 바이너리 데이터를 포함하는
ArrayBuffer
임을 의미합니다. - 응답 유형이 "json"인 경우 응답 콘텐츠는 JSON
Document
이어야 합니다. - 응답 유형이 "document"인 경우 응답 콘텐츠가 responseXML 속성을 사용하여 안전하게 읽을 수 있는 XML
Document
이라는 의미입니다.
response도 참조하세요 .
responseURL : string |
리디렉션이 발생한 후 응답 데이터를 검색하는 데 사용된 URL을 반환합니다.
이 프로퍼티는 Qt 6.6에 도입되었습니다.
responseXML : var |
응답 콘텐츠를 XML 또는 HTML로 파싱할 수 없는 경우 Document
또는 null
을 반환합니다. 자세한 내용은 responseXML document 섹션을 참조하세요.
responseText도 참조하십시오 .
status : int |
마지막으로 수신한 응답의 상태 코드를 반환합니다.
statusText도 참조 하세요.
메서드 문서
void abort() |
현재 요청을 취소합니다.
readyState 속성을 XMLHttpRequest.UNSENT
로 변경하고 readystatechange
신호를 전송합니다.
string getAllResponseHeaders() |
마지막 응답에서 받은 String
헤더를 반환합니다.
다음은 응답 헤더 예시입니다:
content-encoding: gzip content-type: text/html; charset=UTF-8 date: Mon, 06 Feb 2023 09:00:08 GMT expires: Mon, 13 Feb 2023 09:00:08 GMT last-modified: Thu, 17 Oct 2019 07:18:26 GMT
getResponseHeader()도 참조하세요 .
string getResponseHeader(headerName) |
마지막 응답의 headerName 값을 반환하거나 headerName 가 누락된 경우 빈 String
을 반환합니다.
getAllResponseHeaders()도 참조하세요 .
void open(method, url, async) |
요청에 사용할 HTTP method 와 요청할 url 을 지정합니다. 항상 send() 전에 이 함수를 호출해야 합니다. 선택적 세 번째 매개변수 async 를 사용하여 요청이 비동기식인지 여부를 결정할 수 있습니다. 기본값은 true
입니다.
readyState 속성이 XMLHttpRequest.OPENED
으로 설정된 onreadystatechange 핸들러를 호출하는 readystatechange
신호를 전송합니다.
|
다음 HTTP 응답에서 수신한 데이터를 서버가 제공한 MIME 유형이 아닌 mime 으로 해석하도록 XMLHttpRequest
을 강제 설정합니다.
이 메서드는 Qt 6.6에 도입되었습니다.
void send(data) |
요청을 서버로 보냅니다. 선택적 인수 data 를 사용하여 요청 본문에 추가 데이터를 추가할 수 있습니다. 이는 일반적으로 요청에 추가 데이터를 포함하려는 POST 요청에 유용할 수 있습니다.
readyState 속성은 서버에서 응답을 수신한 후 응답이 처리되는 동안 업데이트됩니다. 응답이 완전히 처리되면 먼저 HEADERS_RECEIVED
, LOADING
, 마지막으로 DONE
로 설정됩니다. readyState 이 업데이트될 때마다 readystatechange
신호가 전송됩니다.
void setRequestHeader(header, value) |
다음 전송하려는 요청에 새 헤더를 추가합니다. 이것은 키-값 쌍으로, header 이라는 이름과 해당 value 이라는 값을 갖습니다.
© 2025 The Qt Company Ltd. Documentation contributions included herein are the copyrights of their respective owners. The documentation provided herein is licensed under the terms of the GNU Free Documentation License version 1.3 as published by the Free Software Foundation. Qt and respective logos are trademarks of The Qt Company Ltd. in Finland and/or other countries worldwide. All other trademarks are property of their respective owners.