IT이야기

사용자에게 POST 데이터를 다시 보내라는 메시지를 표시하지 않고 POST 후 브라우저 창 다시 로드

cyworld 2021. 10. 21. 21:24
반응형

사용자에게 POST 데이터를 다시 보내라는 메시지를 표시하지 않고 POST 후 브라우저 창 다시 로드


사용자가 내 웹사이트를 방문하면 모든 페이지에 "로그인" 링크가 있습니다. 이것을 클릭하면 일부 JavaScript를 사용하여 사용자에게 자격 증명을 묻는 오버레이 창을 표시합니다. 이러한 자격 증명을 입력한 후 웹 서버에 대한 Ajax 호출이 수행되어 유효성을 검사합니다. 유효한 경우 인증 티켓 쿠키가 다시 전송되고 페이지가 다시 로드되어 인증된 사용자 또는 (현재) 현재 로그인한 사용자와 관련된 페이지 콘텐츠가 표시됩니다.

다음을 사용하여 스크립트를 통해 페이지 다시 로드를 수행하고 있습니다.

window.location.reload();

이것은 GET 요청(대부분)을 통해 로드된 페이지에서 훌륭하게 작동하지만 일부 페이지는 포스트백 양식을 사용합니다. 따라서 사용자가 이러한 페이지 중 하나로 이동하여 포스트백을 수행한 다음 로그인을 선택하면 window.location.reload()스크립트가 실행될 때 POST 본문을 다시 제출할 것인지 묻는 대화 상자가 표시됩니다.

POST 본문 다시 제출 대화 상자

이 문제를 해결하기 위해 브라우저에 페이지를 다시 로드하도록 지시할 수 있다고 생각하여 다음을 시도했습니다.

window.location.href = window.location.href;

그러나 브라우저는 위의 명령문에 대해 아무런 조치도 취하지 않습니다. 새 URL이 이전 URL과 동일하다고 생각하기 때문인 것으로 추정됩니다. 위의 내용을 다음과 같이 변경하면

window.location.href = window.location.pathname;

페이지를 다시 로드하지만 쿼리 문자열 매개변수를 잃게 됩니다.

현재 해결 방법은 충분하지만 예쁘지는 않습니다. 간단히 말해서 쿼리 문자열 매개 변수를 현재 window.location.href값에 고정한 다음 window.location.href를 호출 하여 다시 할당합니다 reloadPage("justLoggedIn"). 여기서 reloadPage함수는 다음과 같습니다.

function reloadPage(querystringTackon) {
    var currentUrl = window.location.href;

    if (querystringTackon != null && querystringTackon.length > 0 && currentUrl.indexOf(querystringTackon) < 0) {
        if (currentUrl.indexOf("?") < 0)
            currentUrl += "?" + querystringTackon;
        else
            currentUrl += "&" + querystringTackon;
    }

    window.location.href = currentUrl;
}

이것은 작동하지만 그 결과 URL이 www.example.com/SomeFolder/SomePage.aspx?justLoggedIn엉성하게 보입니다.

JavaScript에 GET 다시 로드를 수행하고 사용자에게 POST 데이터를 다시 제출하라는 메시지를 표시하지 않는 방법이 있습니까? 기존 쿼리 문자열 매개 변수가 손실되지 않았는지 확인해야 합니다.


window.location.href = window.location.href;

그것이 작동하는 이유를 묻지 마십시오. 하지만 작동합니다 :). js 엔진이 내가 생각하는 논리를 해석하는 방식입니다.


아마도 해야 할 일은 POST / Form Handler 스크립트가 실행된 후 사용자를 리디렉션하는 것입니다.

PHP에서 이것은 다음과 같이 수행됩니다 ...

<?php
// ... Handle $_POST data, maybe insert it into a database.
// Ok, $_POST data has been handled, redirect the user
header('Location:success.php');
die();
?>

...이 해야 당신이 "데이터 다시 보내기"경고를받지 않고 페이지를 새로 고침 할 수 있습니다.

POST 변수가 헤더로 전송되지 않으므로 동일한 페이지(게시 대상인 경우)로 리디렉션할 수도 있습니다(따라서 새로 고침 시 다시 게시할 수 없음).


이것도 작동합니다:

window.location.href = window.location.pathname + window.location.search

사용하다

RefreshForm.submit(); 

대신에

document.location.reload(true); 

이것은 나를 위해 일했습니다.

window.location = window.location.pathname;

테스트 날짜

  • 크롬 44.0.2403
  • IE 에지
  • 파이어폭스 39.0

이것은 POST/REDIRECT/GET 패턴으로도 해결할 수 있습니다.
어느 것이 더 우아
합니까? Javascript에서 POSTDATA 경고 없이 페이지를 다시 로드하려면 어떻게 해야 합니까?


나는 당신과 같은 문제가있었습니다.

다음은 내가 한 작업(작업이 location.href로 설정된 동적으로 생성된 GET 양식, 새로운 값으로 숨겨진 입력)이며 모든 브라우저에서 작동하는 것 같습니다.

var elForm=document.createElement("form");
elForm.setAttribute("method", "get");
elForm.setAttribute("action", window.location.href);

var elInputHidden=document.createElement("input");
elInputHidden.setAttribute("type", "hidden");
elInputHidden.setAttribute("name", "r");
elInputHidden.setAttribute("value", new Date().getTime());
elForm.appendChild(elInputHidden);

if(window.location.href.indexOf("?")>=0)
{
    var _arrNameValue;
    var strRequestVars=window.location.href.substr(window.location.href.indexOf("?")+1);
    var _arrRequestVariablePairs=strRequestVars.split("&");
    for(var i=0; i<_arrRequestVariablePairs.length; i++)
    {
        _arrNameValue=_arrRequestVariablePairs[i].split("=");

        elInputHidden=document.createElement("input");
        elInputHidden.setAttribute("type", "hidden");
        elInputHidden.setAttribute("name", decodeURIComponent(_arrNameValue.shift()));
        elInputHidden.setAttribute("value", decodeURIComponent(_arrNameValue.join("=")));
        elForm.appendChild(elInputHidden);
    }
}

document.body.appendChild(elForm);
elForm.submit();

이것은 오래된 게시물이지만 더 나은 솔루션이 있습니다. 모든 게시물 값을 숨김 필드로 포함하는 양식을 만들고 양식에 다음과 같은 이름을 지정합니다.

<form name="RefreshForm" method="post" action="http://yoursite/yourscript">
    <input type="hidden" name="postVariable" value="PostData">
</form>

그런 다음 당신이해야 할 일은 당신의 것 setTimeout입니다.RefreshForm.submit();

건배!


빈 양식(method=get)을 만들고 제출할 수 있습니다.

<form id='reloader' method='get' action="enter url here"> </form>
<script>
// to reload the page, try
document.getElementById('reloader').submit();
</script>

URL에 해시 '#'가 있는 경우 여기에 있는 모든 솔루션이 작동하지 않습니다. 이것은 나를 위해 일한 유일한 솔루션입니다.

var hrefa = window.location.href.split("#")[1];
var hrefb = window.location.href.split("#")[2];
window.location.href  = window.location.pathname +  window.location.search + '&x=x#' + hrefa + '#' + hrefb;

해시가 있는 경우 URL을 다시 로드하려면 URL이 달라야 합니다. &x=x는 여기에서 수행합니다. 무시할 수 있는 것으로 대체하십시오. 이것은 약간의 해킹이며 더 나은 솔루션을 찾을 수 없습니다.

Firefox에서 테스트되었습니다.


모든 매개변수를 사용하여 오프너 창을 다시 로드하려면(모두 window.location.href 메서드로 전송되지 않고 form.submit() 메서드를 사용하는 것이 한 단계 늦을 수 있음) 나는 window.history 메서드를 사용하는 것을 선호합니다.

window.opener.history.go(0);

언로드 핸들러를 지정하지 않음으로써 언로드 메커니즘 에 대한 HTML 프롬프트를 활용할 수 있습니다 .

window.onbeforeunload = null;
window.location.replace(URL);

노트 섹션을 참조하십시오 의를 WindowEventHandlers.onbeforeunload자세한 내용은.


이것은 효과가 있었다

<button onclick="window.location.href=window.location.href; return false;">Continue</button>

가없이 작동하지 않는 이유는 return false;버튼 클릭이 양식을 제출 실행할 것입니다. 명시적 반환 false를 사용하면 양식 제출을 수행하지 않고 해당 페이지에 대한 이전 POST의 결과였던 동일한 페이지를 다시 로드합니다.

ReferenceURL : https://stackoverflow.com/questions/4869721/reload-browser-window-after-post-without-prompting-user-to-resend-post-data

반응형