javascript ajax 예제

Facebook 또는 Gmail을 사용한 시간을 생각해 보시면 됩니다. 전체 페이지를 다시 로드하지 않고 작업을 수행했습니다. 예를 들어 같은 페이지에 있는 동안 즉시 게시하는 댓글을 남겼습니다. 이것이 바로 AJAX가 허용하는 것입니다! AJAX소개에 이어 XMLHttpRequest API를 사용하여 AJAX 요청을 초기화하는 예제가 있습니다. ajax() 메서드는 AJAX(비동기 HTTP) 요청을 수행하는 데 사용됩니다. 이 문서에서는 AJAX 기본 사항에 대해 안내하고 시작하는 데 필요한 두 가지 간단한 실습 예제를 제공합니다. 데이터를 게시하려면 요청의 MIME 유형을 설정해야 할 수 있습니다. 예를 들어, 쿼리 문자열로 전송되는 양식 데이터에 대해 send()를 호출하기 전에 다음을 사용합니다. 보안상의 이유로 브라우저에서는 도메인 간 Ajax 요청을 허용하지 않습니다. 즉, 응용 프로그램이 도메인 “mysite.com”에서 실행되는 경우 Ajax가 “othersite.com” 또는 다른 도메인에 요청할 수 없는 경우 원래 페이지와 동일한 도메인의 URL에 대해서만 Ajax 요청을 수행할 수 있습니다. 일반적으로 동일한 원본 정책이라고 합니다.

개체에는 사용할 수 있는 두 가지 주요 메서드가 있습니다. 예제에서는 두 가지 를 모두 사용했습니다. 예를 들어 Ajax 호출이 실패하거나 Ajax 요청을 수행해야 하지만 일정 시간 내에 검색된 경우에만 결과가 필요한 경우 수행할 작업을 지정하려고 합니다. 이러한 상황에서는 이 자습서의 주제인 $.ajax()라고 하는 jQuery에서 제공하는 다른 함수를 사용할 수 있습니다. GET 요청은 일반적으로 데이터베이스의 조작이나 변경이 필요하지 않은 서버에서 일종의 정보를 가져오거나 검색하는 데 사용됩니다(예: 용어에 따라 검색 결과 가져오기, ID 또는 이름에 따라 사용자 세부 정보 가져오기 등). Ajax는 인기가 있어 Ajax를 어느 정도 사용하지 않는 응용 프로그램을 거의 찾을 수 없습니다. 일부 대규모 아약스 기반 의 온라인 응용 프로그램의 예는 다음과 같습니다 Gmail, 구글지도, 구글 문서 도구, 유튜브, 페이스 북, 플리커, 그리고 너무 많은 다른 응용 프로그램. 논의할 두 번째 예제에서는 Joind.in 라는 서비스에서 일부 정보를 검색 하는 JSONP 요청을 만듭니다. 후자는 이벤트 참석자가 이벤트 및 세션에 대한 피드백을 남길 수 있는 웹 사이트입니다. 특히 , 나는 $.ajax() 함수를 사용하여 PHP 개발자의 눈으로 내 이야기 현대 프론트 엔드의 제목과 설명을 검색하는 코드 조각을 만들려고합니다.

방금 배운 모든 약어가 당신을 괴롭게하지 마십시오! 이 과정에서 지금까지 배운 많은 JavaScript 예제를 연습하는 간단한 AJAX 예제부터 시작하겠습니다. 당신이 당신의 필요에 $.ajax()를 구부리도록 지정할 수 있는 다양한 옵션이 많이 있습니다. 아래 목록에서 자신의 이름과 설명이 알파벳 순서로 정렬 된 것을 찾을 수 있습니다 : 나는 이것이 상당히 오래된 질문이라는 것을 알고 있지만 최신 브라우저에서 기본적으로 사용할 수있는 더 좋은 API가 있습니다. fetch() 메서드를 사용하면 웹 요청을 할 수 있습니다. 예를 들어, /get-data에서 일부 json을 요청하려면 : 아래 의 몇 가지 예에서 작은 조합이 간단한 조각을 만들었습니다 : Ajax는 비동기 자바 스크립트및 Xml. Ajax는 서버에서 데이터를로드하고 부품을 선택적으로 업데이트하는 수단일 뿐입니다. 전체 페이지를 다시 로드하지 않고 웹 페이지의 위의 스니펫에서, 나는 논의 된 속성의 몇 가지를 고용했다. 우선, 요청이 객체 리터럴의 속성 (URL)으로 전송되는 URL을 지정할 수있는 두 번째 형식의 $.ajax()를 사용하고 있음을 알 수 있습니다. Joind.in의 API는 JSONP 요청을 수락하기 때문에 위의 코드에서 dataType 속성을 지정하여 사용할 요청 유형을 설정합니다.


mid_admin