2012-03-10 2 views
0

나는 HTTP를 통해 데이터베이스를 호출하고있다. 내 응용 프로그램과 동일한 서버에 있지 않기 때문에 JSONP를 사용하고 있습니다. 그래서 데이터베이스의 정보를 쿼리 할 때마다 JavaScript 함수가 DOM 트리에 다른 스크립트 태그를 추가합니다. 잠시 동안 내 응용 프로그램을 실행하면 소스 코드가 SCRIPT 태그로 넘치게됩니다.JSONP로 전화 할 때마다 새 SCRIPT 태그를 만들어야합니까?

JSONP로 작업하는 것을 받아 들여야하는 것이거나 다른 방법이 있습니까?

+0

이렇게하는 것이 더 좋은 방법입니다. 몇 가지 코드를 게시 할 수 있습니까? –

답변

1

예, JSONP의 문제입니다. 작업이 완료되면 onload 처리기를 script 요소에 첨부하여 정리할 수 있습니다 (IE의 경우 onreadystatechange).

두 서버를 모두 제어 할 수 있으므로 CORS을 사용할 수 있습니다. 이것은 JSONP보다 해킹이 적고 유연성이 XMLHttpRequest입니다.

1

브라우저에 따라 다르지만 일반적으로 예입니다. 새 스크립트 태그를 추가해야합니다. 그러나 스크립트가로드 된 후 스크립트 dom 요소를 제거 할 수 있습니다. jQuery를 사용하고 있다면 jQuery가이를 처리한다.이를 위해 사용해야하는 메서드는 브라우저에 따라 다소 다르다.

Visual Studio를 사용하는 경우 스크립트를 제거하더라도 디버거에서 스크립트에 대한 참조가 계속 표시됩니다. 내가 말할 수있는 한, 생산 모드에서 이것은 "누출"이 있음을 의미하지는 않습니다.

+0

예. jQuery가이를 처리하고 사용하기가 쉽습니다. –

0

JSONP 응답을 받으면 script 태그를 제거합니다. 예 :

function makeJSONPRequest() { 
    var script = document.createElement('script'); 
    var callbackName = 'callback' + (+new Date()) + '_' + Math.floor(Math.random() * 10000); 
    script.type = 'text/javascript'; 
    script.src = 'http://www.example.com/jsonp?callback=' + callbackName; 
    window[callbackName] = callback; 
    document.head.appendChild(script); 
    function callback(data) { 
     delete window[callbackName]; 
     document.head.removeChild(script), script = null; 
     console.log(data); 
    } 
} 
관련 문제