JQuery AJAX 요청에 대한 응답으로 스크립트 파일 다운로드를 차단하는 IE8의 정보 표시 줄

Question

사용자 입력 양식 데이터가 포함 된 XML을 JQuery의 AJAX 요청을 사용하여 백엔드 응용 프로그램에 보내어 다시 PDF를 생성하는 html/javascript 프론트 엔드가 있습니다. 그 정보. 프런트 엔드는 응답으로 UUID를받습니다. 그런 다음 다운로드 URL에서 생성 된 PDF를 다운로드합니다.

이것은 Firefox와 Safari에서 훌륭하게 작동하지만 스크립트 다운로드에 대한 Internet Explorer 8의 보호 기능에 의해 차단됩니다. 생성 된 정보 표시 줄을 통해 파일을 다운로드하도록 IE8에 지시하면 입력 된 모든 사용자 컨텐트를 비우는 페이지가 다시로드됩니다.

button-esque 요소의 단일 onMouseUp 이벤트가 전송할 XML 생성을 트리거하고 XML을 보내 응답을받은 다음 window.location 객체의 url 설정을 통해 다운로드를 시작합니다. 다운로드를 다른 버튼으로 분리하면 (XML을 생성하여 보내고 UUID를 가져오고 다른 하나는 UUID로 만든 URL을 사용하여 다운로드 만 시작 함) 정보 표시 줄을 우회하지만 인터페이스의 단순성과 직관성이 손상됩니다. 여기

는 관련 자바 스크립트 기능은 다음과 같습니다

function sendXml() 
{ 
    var documentXml = generateDocumentXml(); 
    var percentEncodedDocumentXml = escape(DocumentXml); 
    var url = "generate?document=" + percentEncodedDocumentXml; 
    $.ajax({ 
     url: url, 
     type: "GET", 
     dataType: "xml", 
     success: function (xml) 
     { 
      var uuid = $(xml).find('uuid').text(); 
      getPdf(uuid); 
     }, 
     error: function (xhr) 
     { 
      alert("There was an error creating your PDF template"); 
     } 
    }); 
} 

function getPdf(uuid) 
{ 
    var url = "generate?get-pdf=" + uuid; 
    window.location = url; 
} 

내가 가장이 문제를 처리하는 방법에 대한 제안을 낚시하고 있습니다. 나의 첫 번째 선호는 정보 표시 줄에 전혀 간섭하지 않는 것이지만, 그 피해를 최소화하는 것은 현 상황에 비해 극적인 개선이 될 것입니다. 프론트 엔드 인터페이스를 다시로드하고 지우지 못하고 정보 표시 줄의 메뉴를 통해 사용자가 "파일 다운로드 ..."를 선택하면 실제로 파일 다운로드를 진행하면 도움이 될 것입니다.

Answer 1

나는 그것을 테스트했고 바가 발생하는 이유는 사용자 행동 (마우스 오버)과 URL 로딩 (PDF 파일 추측) 사이에 직접적인 관계가 없다는 사실 인 것 같다. 문서 내부에 (숨겨져있을 수 있습니다)

가 iframe을 만들기 및 PDF를로드 ...

window.open(url,'nameAttributeOfTheIframe') 

사용

이 해결 방법이 문제를 해결합니다. 바도 표시되지만 사용자가 다운로드하도록 선택하면 현재 문서도 다시로드되지만 바가 상위 문서가 아닌 iframe에 속하기 때문에 사용자 콘텐츠 (양식 데이터를 의미하는 경우)가 그대로 유지됩니다.

숨겨진 iframe을 사용하면 사용자가 볼 수없는 내용이 있기 때문에 브라우저에서 볼 수 있도록 PDF와 함께 첨부 파일 헤더를 보내야합니다 (브라우저에서 볼 수있는 경우).

<iframe name="nameAttributeOfTheIframe" style="display:none"></iframe> 
<input type="button" value="click here" onclick="f1()"/> 
<input value="default value"> 
<script type="text/javascript"> 
<!-- 
function f1() 
{ 
    //simulate delayed download 
    setTimeout(f2,1000)  
} 

function f2() 
{ 
    window.open('http://www.ecma-international.org/publications/files/ECMA-ST/ECMA-262.pdf','nameAttributeOfTheIframe');  
} 

document.getElementsByTagName('input')[1].value='this is modified value, should remain'; 

//--> 
</script>