问ResponsiveVoice -避免将API密钥硬编码到index.html中
EN

Stack Overflow用户

提问于 2020-12-13 11:09:48

回答 1查看 163关注 0票数 0

根据我的页面必须包含的文档

<script src="https://code.responsivevoice.org/responsivevoice.js?key=YOUR_UNIQUE_KEY"></script>

我希望避免将我的API密钥硬编码到index.html中，并将其保存在一个单独的文件中。我尝试使用js添加responsivevoice脚本，例如：

const rvScript = document.createElement('script');
const api_key = "XXXXXXXX"
const src = 'https://code.responsivevoice.org/responsivevoice.js?key=' + api_key;
rvScript.setAttribute('src',src);
rvScript.onload = () => {
    console.log(responsiveVoice.getVoices());
    responsiveVoice.speak('Hello world')
}
document.body.appendChild(rvScript);

我在控制台上得到了一个声音列表，但是"Hello“没有回放。

有什么办法解决这个问题吗？

javascript

responsivevoice

回答 1

Stack Overflow用户

回答已采纳

发布于 2020-12-13 11:49:17

诀窍是创建标记，动态加载库，并仅在需要时将其注入DOM。这里的想法是，我们创建一个函数，我们可以在需要第三方库的页面上调用该函数，并动态地创建标记并将其注入应用程序。

const loadDynamicScript = (callback) => {
  const existingScript = document.getElementById('scriptId');

  if (!existingScript) {
    const script = document.createElement('script');
    script.src = 'url'; // URL for the third-party library being loaded.
    script.id = 'libraryName'; // e.g. responsivevoice or googleMaps
    document.body.appendChild(script);

    script.onload = () => {
      if (callback) callback();
    };
  }

  if (existingScript && callback) callback();
};

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/65274905

复制

相似问题

问ResponsiveVoice -避免将API密钥硬编码到index.html中
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问ResponsiveVoice -避免将API密钥硬编码到index.html中EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问ResponsiveVoice -避免将API密钥硬编码到index.html中
EN