[google-chrome] Chrome 개발자 도구를 사용하여 HTTP 요청
POSTER와 같은 플러그인을 사용하지 않고 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 인증을 사용하며 자주 실행하는 요청을 저장하는 등의 작업을 수행 할 수 있습니다.
답변
Chrome 개발자 도구의 네트워크 탭에서 캡처 한 요청을 수정하고 다시 발행하려면 다음 단계를 따르십시오.
Name요청을 마우스 오른쪽 버튼으로 클릭- 고르다
Copy > Copy as cURL - 명령 행에 붙여 넣기 (명령에는 쿠키 및 헤더 포함)
- 필요에 따라 요청을 편집하고 실행
답변
나는 오래된 게시물을 알고 있지만 여기에 두는 것이 도움이 될 수 있습니다.
최신 브라우저 는 이제 Fetch API를 지원합니다 .
다음과 같이 사용할 수 있습니다.
fetch("<url>")
.then(data => data.json()) // could be .text() or .blob() depending on the data you are expecting
.then(console.log); // print your data
추신 : 개선되었으므로 모든 CORS 검사를 수행합니다 XmlHttpRequest.
답변
웹 페이지에 페이지에 jquery가 있으면 크롬 개발자 콘솔에서 작성할 수 있습니다.
$.get(
"somepage.php",
{paramOne : 1, paramX : 'abc'},
function(data) {
alert('page content: ' + data);
}
);
그것을하는 jquery 방법!



