axios와 ajax의 차이점은 무엇입니까?

axios와 ajax의 차이점: 1. axios는 Promise 기반 HTTP 라이브러리인 반면 ajax는 기본 XHR의 캡슐화입니다. 2. ajax 기술은 로컬 데이터 새로 고침을 실현하는 반면 axios는 ajax의 캡슐화를 실현합니다.

이 문서의 운영 환경: Windows 7 시스템, ECMAScript 버전 6, Dell G3 컴퓨터.

Ajax와 Ajax의 차이점은 무엇인가요?

Axios와 Ajax의 차이점, 장점 및 단점:

ajax:

1.

아약스 기본 XHR 캡슐화로, 도약이라는 목표를 달성하기 위해 JSONP에 대한 지원을 추가합니다.

　

Asynchronous javascript 및 xml, ajax는 새로운 기술이 아니라 여러 기술의 조합으로, 동적 페이지를 빠르게 생성하는 데 사용되며 새로 고침 없이 데이터를 업데이트하여 사용자 경험을 향상시킬 수 있습니다.

2. 아약스의 원리는 무엇인가요?

　클라이언트가 ajax 엔진을 요청하면, ajax 엔진이 서버에 요청하고, 서버는 일련의 응답을 하고 ajax 엔진으로 결과를 클라이언트에 쓸 위치를 결정합니다. 페이지 새로 고침 없이 데이터 업데이트를 달성합니다.

3. 핵심 객체?

　XMLHttpReques

4. Ajax의 장점과 단점은 무엇인가요?

장점

1. 새로 고침 없이 데이터 업데이트

2. 서버와의 비동기 통신

3. 프런트엔드 및 백엔드 로드 밸런싱

4. 표준 기반 폭넓은 지원

5. 인터페이스 분리 및 애플리케이션

단점 ：

　 1. Ajax는 뒤로 및 기록 기능을 사용할 수 없으므로 브라우저 메커니즘이 손상됩니다.

　　2. 보안 문제 Ajax는 서버와의 상호 작용 세부 정보를 노출합니다

　　3. 검색 엔진에 대한 지원이 상대적으로 약합니다

　　4. 프로그램의 예외 처리 메커니즘을 파괴합니다

　　5. URL의 원래 의도를 위반하고 리소스 포지셔닝

　　6, Ajax는 모바일 장치를 제대로 지원하지 못합니다

　　7. 클라이언트 코드가 너무 많으면 개발 비용이 발생합니다

5. Ajax 적용 시나리오

　　<1>. 트리 탐색 　　<3>. 빠른 사용자 간 통신 응답　　　　4>. 투표, 예/아니요 등의 중요하지 않은 시나리오
　　　<5> 관련 데이터 필터링 및 조작 시나리오
　　<6> ;. 일반 텍스트 입력 프롬프트 및 자동 완성 시나리오

6. Ajax가 적용되지 않는 시나리오

　　<1>. 몇 가지 간단한 형식
　　<2>.기본 탐색　　<4>. 대량의 텍스트 바꾸기　　<5>. 프레젠테이션 조작


7, 코드

$.ajax({
  type: 'POST',
  url: url,
  data: data,
  dataType: dataType,
  success: function () {},
  error: function () {}
});

8, ajax 요청 5단계

　1. XMLHttpRequest 비동기 객체 생성

　 2. 콜백 함수 설정

3. open 메소드를 사용하여 서버와의 연결 설정

4. 서버에 데이터 전송

5. 콜백 함수에서 다양한 응답 상태 처리

axios:

1.

Axios는

Promise

기반의 HTTP 라이브러리로, 브라우저와 node.js에서 사용할 수 있습니다. 2. Axios에는 어떤 기능이 있나요?

　1. 브라우저에서 XMLHttpRequests 생성

　2. node.js에서 http 요청 생성
　3. Promise API 지원

　4. 요청 및 응답 차단 지원

　5. 요청 및 변환 응답 데이터

　6. 요청 취소

　7. JSON 데이터 형식으로 자동 변환

　8. 클라이언트는 XSRF에 대한 방어를 지원합니다

3. get 요청을 실행하는 방법에는 두 가지가 있습니다

// 第一种方式  将参数直接写在url中axios.get('/getMainInfo?id=123')
.then((res) => {
  console.log(res)
})
.catch((err) => {
  console.log(err)
})// 第二种方式  将参数直接写在params中axios.get('/getMainInfo', {  params: {
    id: 123
  }
})
.then((res) => {
  console.log(res)
})
.catch((err) => {
  console.log(err)
})

4. post 요청을 실행하려면 params 필드에 작성할 필요가 없는 post 요청의 입력 매개변수에 주의하세요. 이 부분은 get 요청의 두 번째 방법과 구별되어야 합니다.

axios.post('/getMainInfo', {
  id: 123})
.then((res) => {
  console.log(res)
})
.catch((err) => {
  console.log(err)
})

ajax와 ajax의 차이점:

axios는 jquery의 ajax 캡슐화와 마찬가지로 Promise를 통한 ajax 기술의 캡슐화입니다. 간단히 말해서, ajax 기술은 로컬 데이터 새로 고침을 실현하고 axios는 캡슐화를 구현합니다. 일부 axios에는 axios가 있지만 일부 ajax에는 반드시 axios가 있는 것은 아닙니다. 요약하면 axios는 ajax이고 ajax는 axios 그 이상입니다. 참고: 기존 Ajax는 XMLHttpRequest(XHR)를 참조하며, 　axios 및 jQuer ajax는 모두 Ajax를 캡슐화한 것입니다

추천 학습: "ajax 비디오 튜토리얼"

위 내용은 axios와 ajax의 차이점은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!