【发布时间】: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