繁体   English   中英

在脚本标签中使用 Promise 不起作用?

[英]Using Promises in script tag not working?

我下面的代码用于使用承诺在 DOM 中附加脚本。 (以下所有代码都在 iframe 内执行,用于 A 帧技术,我的代码是使用 Google Blockly[Block-based coding] 生成的)

 export const appendScript = async({ src, aframeWindow, code, id }, doc, callback, ) => new Promise(resolve => { const startDate = new Date(); const script = doc.createElement('script'); if (src) script.src = src; if (code) { script.text = code; } if (id) { script.id = id; } doc.head.appendChild(script); if (callback) callback(); if (code) { if (callback) { callback(); } console.log(aframeWindow.onGreenPlayButtonClicked, "===="); // undefined when code string contains await outside ongreenplaybuttonclicked fn resolve('resolved'); } else { script.addEventListener('load', () => { const endDate = new Date(); const seconds = (endDate.getTime() - startDate.getTime()) / 1000; console.log('script loaded: ', src, `took ${seconds} to load`); resolve('resolve2'); }); } });

下面的脚本是我调用 appendscript 的函数。

 const callAppendScript = async code => { const CODE_VERSION = aframeWindow.CODE_VERSION; code = ` async function main(inPlayMode) { let CURRENT_CODE_VERSION = CODE_VERSION; ${code}; } main(); `; let x = await appendScript({ code, aframeWindow, id: 'code' }, aframeWindow.document, ); } callAppendScript(code);

我的代码字符串 1 生成:(不起作用)

 async function main(inPlayMode) { let CURRENT_CODE_VERSION = !inPlayMode ? 0 : window.CODE_VERSION; var greeting; greeting = await HatchTranslateEngine.translate(`Hello`, 'en'); //async window.onGreenPlayButtonClicked = async function onGreenPlayButtonClicked() { await MinecraftAvatar.speakSound(greeting, true) }; } main();

我的代码字符串 2 生成:(有效)

 async function main(inPlayMode) { let CURRENT_CODE_VERSION = !inPlayMode ? 0 : window.CODE_VERSION; var greeting; greeting = Hatch.convert(`Hello`, 'jp'); //syncrhonous window.onGreenPlayButtonClicked = async function onGreenPlayButtonClicked() { await MinecraftAvatar.speakSound(greeting, true) }; } main();

我生成的代码字符串 3:(仍然有效)

 async function main(inPlayMode) { let CURRENT_CODE_VERSION = !inPlayMode ? 0 : window.CODE_VERSION; var greeting; window.onGreenPlayButtonClicked = async function onGreenPlayButtonClicked() { greeting = await HatchTranslateEngine.translate(`Hello`, 'en'); //async this still works (inside playbtn) await MinecraftAvatar.speakSound(greeting, true) }; } main();

每当我点击播放按钮时, callAppendScript(code)就会被执行,当它这样做时,

对于代码字符串 1 ,它在aframeWindow.onGreenPlayButtonClicked给了我未定义(不正确)对于代码字符串 2 ,它给了我在 aframeWindow.onGreenPlayButtonClicked中的aframeWindow.onGreenPlayButtonClicked函数签名(正确)

那么,为什么它不适用于 case 1 ,我尝试了所有方法但无法弄清楚。 我只发现对于 onGreenPlayButtonClicked 之外的任何await关键字,我都会得到aframeWindow.onGreenPlayButtonClicked ,它在appendScript函数内。

谢谢

appendScript没有任何appendScript等待main()调用返回的承诺。 如果您异步初始化onGreenPlayButtonClicked ,则在附加脚本元素后它不会立即可用。

我建议你试试

const callAppendScript = async code => {
  const CODE_VERSION = aframeWindow.CODE_VERSION;
  code = `
    async function main(inPlayMode) {
      let CURRENT_CODE_VERSION = CODE_VERSION;
      ${code};
    }
    // no main() call here
  `;
  await appendScript({
    code,
    aframeWindow,
    id: 'code'
  }, aframeWindow.document);

  console.log(aframeWindow.onGreenPlayButtonClicked, "before");
  await main();
//^^^^^^^^^^^^
  console.log(aframeWindow.onGreenPlayButtonClicked, "after");
}

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM