javascript - 如何通过html或javascript在chrome中打开翻译对话框

Question

问题是:是否有可能以更优雅的方式替换旧的“已弃用”https://translate.google.com/intl/en/about/website/

“我们不再提供对 Google 翻译网站翻译器的新访问权限。此更改不会影响网站翻译器的现有使用。我们鼓励希望翻译网页的用户使用原生支持翻译的浏览器。”

••• 这段代码带来了一种“选择”的旧风格(对手机来说不是很好)

<div id="google_translate_element"></div>
<script src="https://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
<script type="text/javascript"> function googleTranslateElementInit() {  new google.translate.TranslateElement({pageLanguage: "en",multilanguagePage: true,layout: google.translate.TranslateElement.InlineLayout.SIMPLE,autoDisplay: false}, "google_translate_element");}</script>

问题是如何创建一个 html 按钮(或可点击的 img)来“询问”谷歌以某种语言打开翻译对话框？？

我希望有几个代表不同语言的标志，当用户单击西类牙语标志时，它会触发 chrome 询问用户是否要将页面翻译成西类牙语？有没有 javascript 或 html5 的方式来做到这一点？

问候

Answer 1

答案很长，我做一个简短的总结

1. 您需要一个 google API key 和可用的翻译(这里有一个 google 分步教程:https://neliosoftware.com/blog/how-to-generate-an-api-key-for-google-translate/)

2. 创建一个包含所需语言列表的数组，请参阅 https://cloud.google.com/translate/docs/languages了解更多详情

3. 从此列表中选择选项

4. 在每个选项上附加一个触发 ajax 函数的 onclick 并将翻译后的文本返回到所需的 div

php 函数看起来像这样

$cgoog = 'https://translation.googleapis.com/language/translate/v2?target='.strtolower($langCode).'&key='.GOOGLE_API_KEY_PHP.'&q='.urlencode($text);

$ch = curl_init();
curl_setopt($ch, CURLOPT_HTTPGET,true);
curl_setopt($ch, CURLOPT_URL, $cgoog);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
$execurl = curl_exec($ch);
$response = json_decode($execurl, true);

return $response['data']['translations'][0]['translatedText'] ?? '';

请注意，双 ??是 php 7 空合并运算符(简而言之，它是 if !isset or else in 1 运算符...)https://www.php.net/manual/en/language.operators.comparison.php#language.operators.comparison.coalesce