Hi, I am developing a Google Chrome extension:
It is a dictionary that uses the Google translate API,
When the user selects a text on the page I would like a popup to appear and show the selected text definition,
I have this code in my js file :
var req = new XMLHttpRequest();
req.open(
"GET",
"https://www.googleapis.com/language/translate/v2?" +
"format=html" +
"q=" + get_text_selection() + // Source Text
"source=en&" + // Source Language
"target=fa&" + // Target Language
true);
req.send(null);
function get_text_selection() {
if (window.getSelection)
return window.getSelection();
if (document.getSelection)
return document.getSelection();
if (document.selection)
return document.selection.createRange().text;
return '';
}
and this code in my Manifest.json file :
{
"name": "Google Translator",
"version": "1.0",
"manifest_version": 2,
"description": "This Extention helps you to translate text in your page",
"browser_action": {
"default_icon": "Dictionary-Book-icon.png",
"default_popup": "popup.html"
},
"permissions": [ "http://*/*", "https://*/*", "tabs" ]
}
and this code in my html file :
<!doctype html>
<html>
<head>
<title>Getting Started Extension's Popup</title>
<style>
body {
min-width:357px;
overflow-x:hidden;
}
</style>
<!-- JavaScript and HTML must be in separate files for security. -->
<script src="popup.js"></script>
</head>
<body>
</body>
</html>
but it’s not working?
Where is my problem?
Thanks for your advice.
First of all
Google Translate APIis a paid service now. To useGoogle Translate APIyou need to get anAPI keyfromGoogle, you can get more information from here. After you get anAPI keyyoururlshould be likeWhich is in your case
Using following request (using my valid key from the browser address bar)
I’ve got this result
Google Translate API no longer free and Translate API FAQ.