Google translate API를 사용하여 여러 번 반복 번역을 할 수 있습니까?

Question

현재로서는 onclick이 등록 될 때마다 api 요청을 첨부하는 스크립트 요소가 있으며 sourceText는 번역해야 할 텍스트입니다. 콜백 함수를 그냥 (처음 온 클릭) 최초의 번역 작업

source = 'https://www.googleapis.com/language/translate/v2?key=YOUR_API_KEY&source=en&target=de&callback=translateText&q=' + sourceText; 
    newScript.src = source; 
    document.getElementsByTagName('head')[0].appendChild(newScript); 

문제가 (전역 변수, 후 별도의 기능 출력 전역 변수를 변경) 웹 페이지에 뭔가를 출력하지만, 그 후 스크립트를 머리에 추가 한 후에는 번역이 변경되지 않습니다. 사실 콜백 함수는 첫 번째 호출 이후에 호출되지 않으며 새로운 출력은 단지 첫 번째 번역 된 문자열입니다. 이 문제를 해결할 방법이 있습니까?

google.load ("language")를 사용하면 누군가가 올바른 방향으로 나를 가리킬 수 있을까요?

Answer 1

지금은 스크립트를 호출하는 해킹 방법을 사용하고 있습니다. 스크립트가 일종의 '실행'이지만, 일종의 클래스를 작성하고 실제 아약스 요청을 실행하는 것이 좋습니다. 조금 더 편하게하기 위해 jQuery (또는 이와 비슷한 것)을 사용하고 maintanable 클래스를 작성합니다. 그것은 이런 식으로 보일 수 있습니다 (어떤 방식 으로든 테스트되지는 않았지만 당신에게 단서를줍니다.))

var Translate = function(translateHandler) { 
    this.endpoint = 'https://www.googleapis/language/translate/v2'; 
    this.apiKey = 'xyz'; 
    this.translateHandler = translateHandler; 
}; 

Translate.prototype.translate = function (text, source, target) { 
    $.get(this.endpoint, { 
     key: this.apiKey, 
     q: text, 
     source: source, 
     target: target 
    }, this.translateHandler.bind(this)); 
}; 

// usage 
var handler = function(result) { 
    // do something with the result 
}; 
var translater = new Translate(handler); 

$('#myButton').on('click', function(e) { 
    e.preventDefault(); 
    translater.translate($('#source').text(), 'en', 'de')); 
})