Ajax 요청 응답에서 window.open을 사용하여 새 창을 여는 문제에 대한 해결 방법

1. 문제 설명

비동기식 비동기 요청이 성공한 후, url을 열기 위해서는 새로운 창을 열어야 하는데, window.open() 메소드를 사용하게 됩니다. 브라우저에 의해 가로채기 때문에 사용자는 Down을 클릭해야 합니다.

2. 문제 분석

브라우저가 새 창을 차단하는 이유는 해당 작업이 사용자에 의해 적극적으로 실행되지 않아 안전하지 않다고 판단하기 때문입니다. , 클릭이나 제출 등의 사용자 행위를 ajax 콜백 함수(trigger('click'))에서 시뮬레이션하더라도 브라우저는 사용자에 의해 능동적으로 트리거되지 않아 안전하게 실행할 수 없다고 생각하게 되므로, 차단됩니다.

지침:

1. 0cccd343ebcf339b582ab20b8ce6e78f/인 경우 a> 여기에 지정된 fun 메소드에서 window.open()을 호출하면 브라우저가 활성화된 것으로 간주하므로 차단되지 않습니다. 그러나 Ajax 요청에 대한 응답으로 창을 여는 것은 차단됩니다.

2.새 창을 열지 않고 원래 웹 주소를 변경하는 경우에는 window.location = newurl을 사용하여 가로채지 않도록 할 수 있습니다.

3. 해결 방법

ajax 요청 전에 window.open을 사용하여 빈 창을 연 다음 ajax 응답 함수에서 창의 위치 속성을 설정합니다. 새 URL의 경우.

코드예:

function fun(){
var tmpWin =window.open()
ajax(xxx, handle(){
//回调函数。这是伪代码，语法不准。
var newurl = xxxx
tmpWin.location = newurl;
})
}

위 방법은 먼저 빈 창이 열리므로 문제가 있습니다. Ajax 요청이 실패한 후(네트워크 또는 비즈니스 로직 문제) 새 창에 정상적인 결과가 표시되지 않아 사용자에게 혼란을 줄 수 있습니다.
한 가지 해결책은 ajax에 문제가 있을 때 tmpWin.document.write("ServerprocessingException");

Ajax를 방지하기 위해서라도 프롬프트를 제공하는 것을 고려할 수 있다는 것입니다. 응답 시간이 너무 깁니다. 창이 생성되면 tmpWin.document.write("서버가 처리 중입니다. 잠시 기다려 주십시오.") 메시지가 즉시 표시됩니다.

나중에 ajax가 정상적으로 반환되면 위치는 설정된 값이므로 원래 인쇄된 정보는 새 페이지 정보로 덮어쓰여집니다.

또 다른 방법이 있지만 결함도 있습니다.

ajax는 동기 요청으로 설정할 수 있으므로 window.open을 사용하여 새 창을 열 수 있습니다. 아약스 요청 후. 예를 들면 다음과 같습니다.

function fun(){
var result;
ajax({ //需要设置同步请求
.....
result = xxx
.......
})
if(result){
window.open(xxxx)
}
}

위 접근 방식은 ajax 요청 결과를 판단한 후 새 창을 열기 때문에 위에서 언급한 문제를 방지합니다.
그러나 동기식 요청이기 때문에 테스트 중에 문제를 발견했습니다. 서버 응답 시간이 너무 길면 먼저 인터페이스가 일시 중지되고(사용자 경험이 좋지 않음) 두 번째로 새 창이 나타납니다. 차단됩니다.

서버가 빨리 복귀해야만 문제 없습니다. 테스트 도중 서버 코드 처리 중에 1초 동안 잠을 자다가 새 창이 차단된 것을 발견했습니다.

4. 요약

요약하자면 Ajax 반환 후 새 창을 여는 데 특별히 완벽한 방법은 없다는 것을 알 수 있습니다. 구체적으로는 자사 시스템의 업무 특성에 따라 적절한 조치를 취해야 합니다.

위는 Ajax 요청 응답에서 window.open을 사용하여 새 창을 열 때 편집자가 소개한 해결 방법입니다. 도움이 되셨으면 좋겠습니다. 질문이 있으시면 연락해 주세요. 메시지를 남겨주시면 편집자가 제때에 답변해 드리겠습니다. 또한 PHP 중국어 웹사이트를 지원해 주신 모든 분들께 감사드립니다!

window.open을 사용하여 Ajax 요청 응답에서 새 창을 여는 문제를 해결하는 방법에 대한 자세한 관련 기사를 보려면 PHP 중국어 웹사이트에 주목하세요!