JavaScript post request like a form submit</p>JavaScript 포스트 요청을 form submit처럼하기

브라우저를 다른 페이지로 이동시키려고 합니다. GET 요청을 하고 싶다면

document.location.href = 'http://example.com/q=a';

하지만 접근하려는 리소스는 POST 요청을 사용하지 않으면 제대로 응답하지 않습니다. 이것을 동적으로 생성하지 않았다면, HTML로 다음을 사용할 수 있습니다.

<form action=http://example.com/ method=POST>
    <input type=hidden name=q value=a>
</form>

그러면 DOM에서 양식을 제출할 수 있습니다.

하지만 사실은 JavaScript 코드로 다음과 같이 말할 수 있는 코드가 있으면 좋겠습니다.

post_to_url('http://example.com/', {'q':'a'});

가장 좋은 크로스 브라우저 구현은 무엇인가요?

브라우저의 위치를 변경하는 솔루션이 필요합니다. 마치 양식을 제출하는 것처럼요. 이것이 XMLHttpRequest로 가능하다면 명확하지 않습니다. 그리고 이것은 비동기적이어서는 안 되며 XML을 사용해서도 안 되므로 Ajax는 답이 아닙니다.

답변 1

/**
 * 지정된 URL로 form에서 요청을 보냅니다. 이는 창의 위치를 변경시킵니다.
 * @param {string} path post 요청을 보낼 경로
 * @param {object} params URL에 추가 할 매개 변수
 * @param {string} [method=post] 폼에서 사용할 메소드
 */
function post(path, params, method='post') {
  // 이 코드의 나머지 부분은 라이브러리를 사용하지 않는다고 가정합니다.
  // 라이브러리를 사용하면 더 간결하게 코드를 작성 할 수 있습니다.
  const form = document.createElement('form');
  form.method = method;
  form.action = path;
  for (const key in params) {
    if (params.hasOwnProperty(key)) {
      const hiddenField = document.createElement('input');
      hiddenField.type = 'hidden';
      hiddenField.name = key;
      hiddenField.value = params[key];
      form.appendChild(hiddenField);
    }
  }
  document.body.appendChild(form);
  form.submit();
}

예시:

post('/contact/', {name: 'Johnny Bravo'});

편집: 이 글이 많이 추천을 받았으므로, 사람들이 이를 자주 복사하여 붙일 것으로 생각됩니다. 그래서 의도치 않은 버그를 수정하기 위해 hasOwnProperty 체크를 추가했습니다.

답변 2

자바스크립트를 사용하여 post 요청을 보내는 것은 웹 개발에서 매우 중요한 요소 중 하나입니다. 폼을 제출하는 것과 마찬가지로 post 요청을 보내는 것은 웹 사이트에서 사용자와 상호작용하는 데 필수적입니다. 예를 들어, 사용자가 로그인 정보를 제출하거나 새로운 정보를 서버에 저장할 때 post 요청을 사용할 수 있습니다.
자바스크립트를 사용하여 post 요청을 보내는 것은 간단하지만 강력합니다. 사용자가 서버에 데이터를 보내는 것뿐만 아니라 서버로부터 데이터를 받아올 수도 있습니다. 이를 통해 웹 애플리케이션은 동적이고 상호작용적인 요소를 포함할 수 있습니다.
post 요청을 보내는 것은 검색 엔진 최적화(SEO)에도 영향을 줍니다. 웹 사이트가 사용자와 상호작용하는 데 더욱 용이해지면 검색 엔진이 해당 사이트를 더욱 높은 순위에 표시할 수 있습니다. 또한, post 요청을 보내는 것은 사용자 경험을 향상시키는 데 도움이 되며, 이는 마케팅 및 검색 엔진 최적화에도 긍정적인 영향을 미칠 수 있습니다.
따라서, 자바스크립트를 사용하여 post 요청을 보내는 것은 웹 개발과 SEO에 모두 중요한 부분이며, 웹 사이트의 성능을 향상시키는 데 도움이 될 수 있습니다. 만약 여러분이 웹 개발을 하고 있다면, post 요청에 대해 알아두고 적절히 활용해야 할 것입니다.