AJAX의 구조
AJAX의 에센스는 무엇입니까?예를 들어 사용자가 이 링크를 클릭하면 현재 페이지를 새로고침하지 않고 일부 정보가 서버로 전송되도록 페이지에 링크를 설정합니다.AJAX야?
저는 이소프레임을 사용하여 이 동작을 할 수 있었습니다.자세한 것은 작은 이소 프레임에 링크(작은 이미지라고 합시다)를 넣었습니다.사용자가 이 링크를 클릭하면 브라우저는 ISO 프레임 페이지만 새로고침합니다.
하지만, 나는 그것이 목표에 도달하는 우아한 방법은 아니라고 생각한다.AJAX를 써야 할 것 같아요.어떻게 작동합니까?XHTML을 사용하면 고려된 문제를 우아하게 해결할 수 있습니까?아니면 JavaScript를 사용해야 하나요?
별로 필요 없어요.(클릭 후) 서버에 정보를 전송한 작은 링크가 필요합니다.메시지 근처에 "별 이미지"가 있다고 가정해 보겠습니다.사용자가 별(메시지를 좋아함)을 누르면 색상과 서버 업데이트 데이터베이스(메시지를 좋아함)가 변경됩니다.
AJAX(Asynchronous Javascript And XML의 약자)를 처음 접하는 경우 Wikipedia에서 AJAX 엔트리를 사용하는 것이 좋습니다.
DHTML이나 LAMP와 마찬가지로 AJAX는 그 자체로 테크놀로지가 아니라 테크놀로지 그룹입니다.AJAX는 다음 조합을 사용합니다.
- HTML 및 CSS: 마크업 및 스타일링 정보
- DOM은 JavaScript를 사용하여 접근하여 제시된 정보를 동적으로 표시하고 상호 작용합니다.
- 브라우저와 서버 간에 데이터를 비동기적으로 교환하여 페이지 새로고침을 방지하는 방법입니다.보통 XMLHttpRequest(XHR) 개체가 사용되지만 IFrame 개체 또는 동적으로 추가된 태그가 대신 사용될 수 있습니다.
- 브라우저로 전송되는 데이터의 형식입니다.일반적인 형식에는 XML, 미리 포맷된HTML, 플레인텍스트 및 JavaScript Object Notation(JSON)이 있습니다.이 데이터는 어떤 형식의 서버측 스크립팅에 의해 동적으로 작성될 수 있습니다.
보시다시피 순수 기술적 관점에서 보면 여기엔 정말 새로운 것이 없습니다.의 AJAX AJAX의 ).XMLHttpRequest오브젝트)진정한 참신함은 구글이 GMail(2004)과 Google Maps(2005)에서 했던 것처럼 이 부분들을 함께 사용하는 것이었다.사실 두 사이트 모두 AJAX 홍보에 크게 기여했습니다.
클라이언트와 리모트서버간의 통신, 및 종래의 애플리케이션과 AJAX 탑재 애플리케이션의 차이를 나타내는 그림은, 1,000 워드의 가치가 있습니다.
다 으로 할 수 요.XMLHttpRequest오브젝트) 또는 jQuery, 프로토타입, YUI 등의 유명한 JavaScript 라이브러리를 사용하여 응용 프로그램의 클라이언트 측을 "AJaxify"할 수 있습니다.이러한 라이브러리는 JavaScript 개발의 복잡성(예: 브라우저 간 호환성)을 숨기는 것을 목적으로 하지만 단순한 기능으로는 과잉일 수 있습니다.
서버측에서는, 일부의 프레임워크도 도움이 됩니다(Java 를 사용하고 있는 경우는 DWR 나 RAJAX 등). 다만, 기본적으로 필요한 정보만을 반환해 페이지를 부분적으로 갱신하는 서비스(처음에는 XML/XHTML 로서 AJAX 의 X 로서 사용되고 있습니다만, 현재는 JSON 이 권장되고 있는 경우가 많습니다.
AJAX의 본질은 다음과 같습니다.
페이지는 사용자가 다른 작업을 수행하는 동안 웹을 탐색하고 자신의 콘텐츠를 업데이트할 수 있습니다.
즉, javascript는 비동기 GET 및 POST 요청을 (보통 오브젝트를 통해) 전송하고, 이러한 요청의 결과를 사용하여 (Document Object Model 조작을 통해) 페이지를 수정할 수 있습니다.
AJAX는 일반적으로 클라이언트에서 서버로 HTTP 요청을 전송하고 전체 페이지를 새로고침하지 않고 서버의 응답을 처리합니다.(비동기적으로).
Javascript는 일반적으로 제출을 수행하고 서버로부터 데이터 응답을 수신합니다(기존에는 XML, 종종 JSON과 같이 상세하지 않은 다른 형식).
그러면 Javascript는 DOM 페이지를 동적으로 업데이트하여 사용자의 보기를 업데이트할 수 있습니다.
즉, '비동기 Javascript And XML'입니다.
페이지를 새로고침하지 않고 사용자의 뷰를 갱신할 수 있는 다른 옵션(Flash나 Applets 등)이 있습니다만, 이러한 옵션은 고객님의 경우에 적합한 솔루션이라고는 생각되지 않습니다.Javascript가 최선인 것 같네요.이 사이트에서 사용되는 jQuery와 같이 좋은 라이브러리 지원이 많이 있기 때문에 실제로 Javascript를 많이 쓸 필요는 없습니다.
Ajax는 페이지의 일부만 새로고침하는 것이 아닙니다.Ajax는 Asynchronous Javascript And Xml의 약자입니다.
필요한 것은 javascript의 XMLHttpRequest 객체뿐입니다.html의 작은 부분을 div 또는 기타 태그로 로드 및 새로고침하려면 이 기능을 사용해야 합니다.
그 예를 읽으면 생각만큼 빨리 프로가 될 수 있어요!
<html>
<body>
<script type="text/javascript">
function ajaxFunction()
{
var xmlhttp;
if (window.XMLHttpRequest)
{
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else if (window.ActiveXObject)
{
// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
else
{
alert("Your browser does not support XMLHTTP!");
}
xmlhttp.onreadystatechange=function()
{
if(xmlhttp.readyState==4)
{
document.myForm.time.value=xmlhttp.responseText;
}
}
xmlhttp.open("GET","time.asp",true);
xmlhttp.send(null);
}
</script>
<form name="myForm">
Name: <input type="text" name="username" onkeyup="ajaxFunction();" />
Time: <input type="text" name="time" />
</form>
</body>
</html>
AJAX는 Asynchronous Javascript와 XML의 약자입니다.AJAX는 전체 페이지를 서버에 다시 게시할 필요 없이 페이지에 대한 부분 업데이트를 지원합니다.
AJAX에는 많은 옵션이 있습니다.가장 주목할 만한 것은 마이크로소프트의 ASP입니다.NET AJAX(구 Atlas) 및 jQuery.
ASP.NET AJAX는 이미 ASP에 익숙하다면 비교적 쉽게 설정할 수 있습니다.NET. jQuery는 javascript를 이미 알고 있다면 좋습니다.또한 페이지 조회와 갱신을 매우 세밀하게 제어할 수 있습니다.
HTH
관심 있는 경우 IBM은 Ajax에 대한 10개(아마도 더 많은) 파트 시리즈를 보유하고 있습니다: Mastering Ajax 파트 1
아직 몇 년 전이지만, 좋은 인트로입니다.(처음 부분만 읽어도!)
여기에 전체 시리즈를 게재해야 한다고 생각합니다만, 현시점에서는 사이트가 조금 느리긴 하지만...
요약:.
HTML, JavaScript™ 기술, DHTML 및 DOM으로 구성된 Ajax는 투박한 웹 인터페이스를 대화형 Ajax 응용 프로그램으로 전환하는 데 도움이 되는 탁월한 접근 방식입니다.Ajax의 전문가인 저자는 이들 테크놀로지가 어떻게 연계되어 있는지(개요부터 상세까지) 설명하고, 매우 효율적인 Web 개발을 용이하게 합니다.또한 XMLHttpRequest 객체를 포함한 Ajax의 중심 개념도 공개합니다.
그건 에이잭스야javascript 없이는 ajax를 사용할 수 없습니다.jquery와 프로토타입의 예를 보고 사용법을 이해해야 합니다.
네가 하려는 것은 엄밀히 말하면 아약스다.Ajax는 페이지의 섹션을 업데이트하기 위해 xhtml fragment 트랜잭션을 만듭니다.Javascript는 이러한 get 요청을 멋지고 깔끔하게 만듭니다.
언급URL : https://stackoverflow.com/questions/1510011/how-does-ajax-work
'programing' 카테고리의 다른 글
| Spring Boot Dev Tools 프로덕션에서 전원을 끄시겠습니까? (0) | 2023.02.22 |
|---|---|
| Angular로부터 해결된 약속을 반환하는 방법$q를 사용하는 JS 서비스? (0) | 2023.02.22 |
| 하위 도메인에 WordPress를 설치하는 방법 (0) | 2023.02.22 |
| 오류: [$injector:unpr] 알 수 없는 공급자: Angular입니다.JS 서비스 테스트 (0) | 2023.02.22 |
| Wordpress - slug별로 태그 ID 가져오기 (0) | 2023.02.22 |