2012-07-26 42 views
1

我試圖將MS Bing Translator的當前版本轉換爲新的Azure版本。Microsoft Azure Translator AJAX API不能正常工作

我創建接入令牌作爲新的文檔中,雖然由Microsoft提供下面的例子(爲天青)所述正常工作:

function translate() { 

    var from = "en", to = "es", text = "hello world"; 
    var s = document.createElement("script"); 
    s.src = "http://api.microsofttranslator.com/V2/Ajax.svc/Translate" + 
      "?appId=" + settings.appID + 
      "&from=" + encodeURIComponent(from) + 
      "&to=" + encodeURIComponent(to) + 
      "&text=" + encodeURIComponent(text) + 
      "&oncomplete=mycallback"; 
    document.body.appendChild(s); 
} 

function mycallback(response) { 
    alert(response); 
} 

我想上述代碼轉換爲一個jQuery呼叫。

我修改從工作的以前版本的類似jQuery的AJAX調用,但parseerror-jQuery17206897480448242277_1343343577741 was not called發出:

function jqueryTranslate() { 
    var p = {}; 
    p.appid = settings.appID; 
    p.to = "es"; 
    p.from = "en"; 
    p.text = "Goodbye Cruel World"; 
    p.contentType = 'text/html'; 
    $.ajax({ 
     url: 'http://api.microsofttranslator.com/V2/Ajax.svc/Translate', 
     data: p, 
     dataType: 'jsonp', 
     jsonp: 'oncomplete', 
     complete: function (request, status) { 
     }, 
     success: function (result, status) { 
     alert(result); 
     }, 
     error: function (a, b, c) { 
     alert(b + '-' + c); 
     } 
    }); 
    } 

我非常欣賞和什麼錯誤,所以TIA你的時間的理解。

回答

1

另一個問題是Bing AppID機制用於驗證轉換器已被棄用。

微軟有一個博客帖子,詳細說明獲得訪問翻譯在Windows Azure市場這裏的過程:

http://blogs.msdn.com/b/translation/p/gettingstarted1.aspx

有ASP.NET中的例子在這裏: http://blogs.msdn.com/b/translation/p/gettingstarted2.aspx

推薦(至少)是把你的代碼放到ASP.NET,PHP,Node或類似的東西中,這樣你的客戶端ID和客戶端祕密就不會暴露。

獲取訪問令牌後,需要將其寫入服務調用的HTTP頭中。 ASP.NET示例顯示,它適應JQuery應該相對容易。

+0

我沒有在C#中實現新的訪問令牌機制。你提供的第二個鏈接似乎是一個值得追求的策略。謝謝! – 2012-07-27 16:00:05

0

您可以嘗試在您的呼叫中添加jsonpCallback併爲其定義新的功能。當我比較你的jQuery代碼和來自微軟的例子時,這似乎是缺少的。

function jqueryTranslate() { 
    var p = {}; 
    p.appid = settings.appID; 
    p.to = "es"; 
    p.from = "en"; 
    p.text = "Goodbye Cruel World"; 
    p.contentType = 'text/html'; 
    $.ajax({ 
     url: 'http://api.microsofttranslator.com/V2/Ajax.svc/Translate', 
     data: p, 
     dataType: 'jsonp', 
     jsonp: 'oncomplete', 
     jsonpCallback: 'onCompleteCallback', <------------------ THIS LINE 
     complete: function (request, status) { 
     }, 
     success: function (result, status) { 
     alert(result); 
     }, 
     error: function (a, b, c) { 
     alert(b + '-' + c); 
     } 
    }); 
    } 

    function onCompleteCallback(response) { <------------------- THIS FUNCTION 
    alert('callback!'); 
    } 
4

要將Bing翻譯器與認證令牌一起使用,首先需要一個服務器端腳本,如此PHP腳本token.php。它將從您的網頁上的JavaScript每隔9分鐘被調用一次。

<?php 
$ClientID="your client id"; 
$ClientSecret="your client secret"; 

$ClientSecret = urlencode ($ClientSecret); 
$ClientID = urlencode($ClientID); 

// Get a 10-minute access token for Microsoft Translator API. 
$url = "https://datamarket.accesscontrol.windows.net/v2/OAuth2-13"; 
$postParams = "grant_type=client_credentials&client_id=$ClientID&client_secret=$ClientSecret&scope=http://api.microsofttranslator.com"; 

$ch = curl_init(); 
curl_setopt($ch, CURLOPT_URL, $url); 
curl_setopt($ch, CURLOPT_POSTFIELDS, $postParams); 
curl_setopt($ch, CURLOPT_RETURNTRANSFER, TRUE); 
$rsp = curl_exec($ch); 

print $rsp; 
?> 

然後,這個html頁面將顯示一個從英文翻譯成法文的雙盒界面。

注意:此文章的早期版本缺少前5行,因此無法加載jQuery。 (很抱歉,@ DB1)工作腳本是在這裏在線:

http://www.johndimm.com/bingtrans/

<html> 

<head> 
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 

    <script language="javascript"> 
    var g_token = ''; 

    function onLoad() { 
     // Get an access token now. Good for 10 minutes. 
     getToken(); 
     // Get a new one every 9 minutes. 
     setInterval(getToken, 9 * 60 * 1000); 
    } 

    function getToken() { 
     var requestStr = "/bingtrans/token.php"; 

     $.ajax({ 
     url: requestStr, 
     type: "GET", 
     cache: true, 
     dataType: 'json', 
     success: function (data) { 
      g_token = data.access_token; 
     } 
     }); 
    } 

    function translate(text, from, to) { 
     var p = new Object; 
     p.text = text; 
     p.from = from; 
     p.to = to; 
     p.oncomplete = 'ajaxTranslateCallback'; // <-- a major puzzle solved. Who would have guessed you register the jsonp callback as oncomplete? 
     p.appId = "Bearer " + g_token; // <-- another major puzzle. Instead of using the header, we stuff the token into the deprecated appId. 
     var requestStr = "http://api.microsofttranslator.com/V2/Ajax.svc/Translate"; 

     window.ajaxTranslateCallback = function (response) { 
     // Display translated text in the right textarea. 
     $("#target").text(response); 
     } 

     $.ajax({ 
     url: requestStr, 
     type: "GET", 
     data: p, 
     dataType: 'jsonp', 
     cache: true 
     }); 
    } 


    function translateSourceTarget() { 
     // Translate the text typed by the user into the left textarea. 
     var src = $("#source").val(); 
     translate(src, "en", "fr"); 
    } 
    </script> 
    <style> 
    #source, 
    #target { 
     float: left; 
     width: 400px; 
     height: 50px; 
     padding: 10px; 
     margin: 10px; 
     border: 1px solid black; 
    } 
    #translateButton { 
     float: left; 
     margin: 10px; 
     height: 50px; 
    } 
    </style> 
</head> 

<body onload="onLoad();"> 

    <textarea id="source">Text typed here will be translated.</textarea> 
    <button id="translateButton" onclick="translateSourceTarget();">Translate English to French</button> 
    <textarea id="target"></textarea> 

</body> 

</html>