Develop a Google Chrome extension using Google Translate

google-chrome-extension, javascript, json, rest

Solution

First of all `Google Translate API` is a paid service now. To use `Google Translate API` you need to get an `API key` from `Google`, you can get more information from here. After you get an `API key` your `url` should be like

"https://www.googleapis.com/language/translate/v2?key=INSERT-YOUR-KEY&source=en&target=fa&q=Hello%20world" // "Hello world" is query here

Which is in your case

"https://www.googleapis.com/language/translate/v2?key=INSERT-YOUR-KEY" + "&format=html" + "&source=en" +"&target=fa" + "&q=" + get_text_selection()

Using following request (using my valid key from the browser address bar)

"https://www.googleapis.com/language/translate/v2?key=my_valid_key&format=html&q=home&source=en&target=fa" // I've replaced my key with my_valid_key

I've got this result

{  "error": {   "errors": [    {
    "domain": "usageLimits",
    "reason": "dailyLimitExceeded",
    "message": "Daily Limit Exceeded"    }   ],
    "code": 403,   
    "message": "Daily Limit Exceeded"  
  }
}

Google Translate API no longer free and Translate API FAQ.

Problem

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.

Original source

Related problems