[google-chrome] Chrome 개발자 도구를 사용하여 HTTP 요청

때문에 가져 오기 API가 크롬 (대부분의 다른 브라우저) 지원, 그것은 아주 쉽게 HTTP를 DevTools로 콘솔에서 요청을 할 지금이다.

예를 들어 JSON 파일 을 얻는 방법 :

fetch('https://jsonplaceholder.typicode.com/posts/1')
  .then(res => res.json())
  .then(console.log)

또는 새로운 리소스 를 게시 하려면 :

fetch('https://jsonplaceholder.typicode.com/posts', {
  method: 'POST',
  body: JSON.stringify({
    title: 'foo',
    body: 'bar',
    userId: 1
  }),
  headers: {
    'Content-type': 'application/json; charset=UTF-8'
  }
})
.then(res => res.json())
.then(console.log)

Chrome Devtools는 실제로 새로운 async / await 구문도 지원합니다 (비록 async는 비동기 함수 내에서만 사용할 수 있음).

const response = await fetch('https://jsonplaceholder.typicode.com/posts/1')
console.log(await response.json())

브라우저의 다른 HTTP 요청과 마찬가지로 요청에 동일한 출처 정책 이 적용 되므로 출처 간 요청을 피하거나 서버가 요청을 허용하는 CORS 헤더를 설정했는지 확인하십시오.

플러그인 사용 (이전 답변)

이전에 게시 한 제안 외에도 Chrome 용 Postman 플러그인이 잘 작동한다는 것을 알았습니다 . 헤더 및 URL 매개 변수를 설정하고 HTTP 인증을 사용하며 자주 실행하는 요청을 저장하는 등의 작업을 수행 할 수 있습니다.

답변

fetch("<url>")
    .then(data => data.json()) // could be .text() or .blob() depending on the data you are expecting
    .then(console.log); // print your data

$.get(
    "somepage.php",
    {paramOne : 1, paramX : 'abc'},
    function(data) {
       alert('page content: ' + data);
    }
);