Javascript 将Google translate API函数放入外部JS文件

Javascript 将Google translate API函数放入外部JS文件,javascript,xss,Javascript,Xss,我看到了这个页面,它解释了如何使用GoogleAPI翻译你的页面。 这里的问题是所解释的Javascript都是内联的 <div id="google_translate_element"></div> <script type="text/javascript"> function googleTranslateElementInit() { new google.translate.TranslateEleme

我看到了这个页面,它解释了如何使用GoogleAPI翻译你的页面。 这里的问题是所解释的Javascript都是内联的

<div id="google_translate_element"></div>

<script type="text/javascript">
function googleTranslateElementInit() {
  new google.translate.TranslateElement({pageLanguage: 'en'}, 'google_translate_element');
}
</script>

<script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>

函数googleTranslateElementInit(){
新的google.translate.TranslateElement({pageLanguage'en'},'google_translate_element');
}

为了避免XSS问题,我想将其作为一个函数或两个函数放在外部JS文件中,并将其加载到页脚中。由于有两个脚本被调用,而第二个脚本似乎就是被调用的API,那么如何将它们放在JS文件中呢?

经过一些研究,我找到了解决方案。这个解决方案意味着Google Translate API只有在用户确认他们对被调用的API没有问题后才会被调用,而不是在页面加载时

 //call Google translate api
 function google_translate_api(){
    var script = document.createElement("script");
    script.type = "text/javascript";
    script.src = "//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit";
    document.body.appendChild(script);
}
将另一个Google函数添加到JS文件:

  function googleTranslateElementInit() {
  new google.translate.TranslateElement({pageLanguage: 'de'}, 'google_translate_element');
}
然后将单击事件添加到按钮
I agree to Google API

document.getElementById("google_consent").onclick = function(){
google_translate_api();
}

当然,我还添加了一个cookie部分,这样,如果用户稍后回来,Google API将自动加载,不会再次被要求确认。

您认为XSS的风险在哪里?我在这里没有看到任何明显的东西。任何内联脚本都对XXS开放。正如我最近被告知的那样,最佳实践是将任何JS脚本放在外部文件中。内联脚本本身并不是XSS风险。很好。例如,当您将不受信任和未经转移的用户输入注入属性或动态生成标记或脚本时,您可能会面临风险。我在你的帖子中没有看到任何东西表明你在听取任何意见。如果这是恶意代码,那么将其放在另一个文件中而不是将其内联到html中可以提供零保护。首先,我想通过一个对话框隐藏这一点,该对话框显示“您现在将使用Google的API,请注意此处的数据隐私政策。”url。。。。“。因此,我将添加一个furhter功能,只显示Google translate按钮,只有一个他们确认的按钮。不过,您有解决方案吗?