한국어
한국어
Ajax (비동기 JavaScript 및 XML)는 대화식 웹 응용 프로그램을 만드는 데 사용되는 기술입니다. Ajax를 사용하면 개발자가 페이지를 새로 고치지 않고 서버와 상호 작용하여 웹 페이지 컨텐츠를 동적으로 업데이트 할 수 있습니다.
PHP7.0에서는 AJAX를 결합하여 전면 및 후면 간의 데이터 상호 작용을 실현하여 사용자 경험과 웹 페이지 성능을 향상시킬 수 있습니다.
AJAX를 사용하기 전에 먼저 데이터를 위해 서버와 상호 작용하는 데 사용되는 XMLHTTPREQUEST 객체를 작성해야합니다.
var xhr = new XMLHttpRequest();XMLHTTPREQUEST 객체는 AJAX 개발의 핵심이며 HTTP 요청을 작성하고 서버와 데이터를 교환하는 일을 담당합니다.
AJAX 요청을 보내는 것은 일반적으로 두 단계가 필요합니다. 요청 매개 변수 설정 및 요청을 보냅니다.
요청 매개 변수 설정 :
var url = "example.php";
var params = "name=John&age=25";
xhr.open("POST", url, true);
xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");요청 보내기 :
xhr.send(params);위 코드에서는 게시물 메소드를 통해 요청을 보내고 요청 매개 변수를 키 값 쌍으로 서버로 전달합니다. 요청을 보내기 전에 setrequestheader () 메소드를 사용하여 요청 헤더를 설정하고 데이터 전송 형식을 지정하십시오.
서버가 요청에 응답하면 요청을 처리해야합니다. XHR 객체의 onreadyStateChange 속성을 설정하여 응답 상태를 듣습니다.
xhr.onreadystatechange = function() {
if (xhr.readyState === XMLHttpRequest.DONE) {
if (xhr.status === 200) {
var response = xhr.responseText;
// 서버에서 반환 한 데이터를 처리합니다
}
}
};서버 응답이 반환되면 XHR 객체의 responceetext 속성을 사용하여 데이터가 얻어지고 처리됩니다.
PHP7.0에서는 PHP 스크립트가 AJAX 요청을 처리하기위한 배경 처리기로 사용됩니다. 먼저 요청을 수신하고 처리 할 PHP 파일을 만듭니다.
<?php
$name = $_POST['name'];
$age = $_POST['age'];
// 데이터 처리를 수행하십시오
$response = "Hello, " . $name . "! You are " . $age . " years old.";
echo $response;
?>이 코드에서는 $ _post 글로벌 변수를 통해 프론트 엔드로 전달되는 매개 변수를 얻고 해당 데이터 처리를 수행하고 프론트 엔드로 반환합니다.
프론트 엔드 페이지에서 JavaScript를 통해 AJAX 요청을 보내십시오.
function sendRequest() {
var xhr = new XMLHttpRequest();
var url = "example.php";
var name = document.getElementById("name").value;
var age = document.getElementById("age").value;
var params = "name=" + name + "&age=" + age;
xhr.onreadystatechange = function() {
if (xhr.readyState === XMLHttpRequest.DONE) {
if (xhr.status === 200) {
var response = xhr.responseText;
document.getElementById("result").innerHTML = response;
}
}
};
xhr.open("POST", url, true);
xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhr.send(params);
}이 코드에서는 sendRequest () 함수를 정의하고 getElementByid () 메소드를 통해 사용자의 데이터 입력을 얻고 매개 변수로 서버로 보냅니다. 그런 다음 InnerHTML을 통해 페이지에 응답 데이터가 표시됩니다.
개발자는 AJAX 및 PHP7.0을 결합하여 서버와 효율적인 데이터 상호 작용을 달성하여 웹 페이지 컨텐츠를 동적으로 업데이트하고 웹 페이지 상호 작용 및 성능을 향상시킬 수 있습니다. 실제 개발에서 Ajax 기술의 합리적인 사용은 사용자 경험을 향상시키고 웹 페이지 응답 속도를 최적화 할 수 있습니다.
