【问题标题】:Google API won't translate foreign letters.Google API 不会翻译外文字母。
【发布时间】:2018-11-29 15:13:28
【问题描述】:

我正在构建一个使用 Google API 翻译文本的应用。该应用程序运行良好,但是如果我尝试翻译一个使用外键 På 的单词,例如 API 请求似乎省略了“å”并以 P 的答案进行响应。所有带有非英文字母的单词都会发生这种情况.

为了让事情变得更奇怪,我构建了一个小型网络扩展程序,它使用 window.addEventListener 从网页中抓取单词。使用这种方法将单词发送到 API 不会导致问题。

这是有效的代码。内容脚本选择一个单词并将其发送到 background.js。后台脚本获取该单词并将其发送到弹出窗口。在按钮上单击选定的单词会被发送到 Google API,然后翻译会被发回。

内容脚本:

window.addEventListener('mouseup', checkWord);

function checkWord() {

    let word = window.getSelection().toString();
    console.log(word);
    if(word.length > 0) {
        let message = {
            text: word,
        }
        chrome.runtime.sendMessage(word)
    }

}

后台脚本:

chrome.runtime.onMessage.addListener(receiver);

function receiver(request, sender, sendResponse) {

    console.log(request);
    word = request;
}

最后我的弹出页面函数在按钮点击时被调用:

function sendToAPI() {
    let bgpage = chrome.extension.getBackgroundPage();
    let word = bgpage.word;
    console.log(word)
    if(word.length> 0 && word.length< 100){
    $.ajax({
        type: 'GET',
        url: `https://translation.googleapis.com/language/translate/v2?q=${word}&target=en&source=no&key=${API_KEY}`,       
    }).then(function(response) {      
            translated =response.data.translations[0].translatedText;
            $('.word').empty();
            $('.word').append(`${word}  |  ${translated}`);

            return translated;

        }).catch(function(err) {

            sendReverse();
        })
    }  
}

这是其他代码中不起作用的部分。 req.query.q 是粘贴到输入字段中的单词。此外,我可以删除 `req.query.q 并将单词直接粘贴到该空间中,API 调用仍然不起作用。

//GET request to Google Translate API
router.get('/', (req,res)=>{
    console.log(req.query);
    axios.get(`https://translation.googleapis.com/language/translate/v2?q=${req.query.q}&target=${req.query.target}&source=${req.query.source}&key=${process.env.GOOGLE_API_KEY}`)
    .then(response => {
        if(req.query.q == response.data.data.translations[0].translatedText){
            res.send('reverse')
        } else {
            console.log(response.data.data)
            res.send(response.data)
        }    
    }).catch(err=> {
        console.log(err)
    })
})

【问题讨论】:

    标签: javascript reactjs api google-api


    【解决方案1】:

    您需要使用encodeURIComponent() 正确编码特殊字符,如下所示:

    ....?q=${encodeURIComponent(word)}....
    

    或分开:

    var encodedWord = encodeURIComponent(word);
    //
    ....?q=${encodedWord}....
    

    【讨论】:

    • 感谢这是正确的解决方案。你知道为什么复制粘贴后需要对单词进行编码,而我使用window.getSelection获取单词时不需要编码吗?
    • URL 参数需要编码,所有不是常规的可打印/可见 ASCII 字符(包括空格)。您对getSelection 所做的操作不涉及 URL,它是对函数的直接调用。
    猜你喜欢
    • 2016-02-17
    • 2020-11-30
    • 2021-09-09
    • 1970-01-01
    • 1970-01-01
    • 2019-02-27
    • 2015-07-25
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多