Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/411.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 如何在同构的JS应用程序中加载第三方库?_Javascript_Reactjs_Redux_Stripe Payments_Mern - Fatal编程技术网

Javascript 如何在同构的JS应用程序中加载第三方库?

Javascript 如何在同构的JS应用程序中加载第三方库?,javascript,reactjs,redux,stripe-payments,mern,Javascript,Reactjs,Redux,Stripe Payments,Mern,我正在尝试使用条带库专门用于条带元素,以便我可以设置一个用于支付处理的自定义表单。我正在server.js文件中使用mern starter,我有以下代码。您可以看到,在底部,我添加了一个脚本标记来导入条带。但是,在我的客户机文件夹中,有一个组件试图使用stripe,它似乎无法访问它。我的猜测是,它还不知道它的存在,但我怎样才能绕过这个问题呢?我看过专门处理加载脚本的react组件,但它似乎不是一个很好的解决方案。我只是想知道是否还有其他人知道更好的方法。我知道我可以使用回调,并在加载完成后进行

我正在尝试使用条带库专门用于条带元素,以便我可以设置一个用于支付处理的自定义表单。我正在server.js文件中使用mern starter,我有以下代码。您可以看到,在底部,我添加了一个脚本标记来导入条带。但是,在我的客户机文件夹中,有一个组件试图使用stripe,它似乎无法访问它。我的猜测是,它还不知道它的存在,但我怎样才能绕过这个问题呢?我看过专门处理加载脚本的react组件,但它似乎不是一个很好的解决方案。我只是想知道是否还有其他人知道更好的方法。我知道我可以使用回调,并在加载完成后进行调度和操作(使用REDUX),然后才允许执行我的条带代码,但这同样看起来很烦人。对此问题的任何见解都将不胜感激

return `
<!doctype html>
<html>
  <head>
    ${head.base.toString()}
    ${head.title.toString()}
    ${head.meta.toString()}
    ${head.link.toString()}
    ${head.script.toString()}

    ${process.env.NODE_ENV === 'production' ? `<link rel='stylesheet' href='${assetsManifest['/app.css']}' />` : ''}
    <link href='https://fonts.googleapis.com/css?family=Lato:400,300,700' rel='stylesheet' type='text/css'/>
    <link rel="shortcut icon" href="http://res.cloudinary.com/hashnode/image/upload/v1455629445/static_imgs/mern/mern-favicon-circle-fill.png" type="image/png" />
  </head>
  <body>
    <div id="root">${html}</div>
    <script>
      window.__INITIAL_STATE__ = ${JSON.stringify(initialState)};
      ${process.env.NODE_ENV === 'production' ?
      `//<![CDATA[
      window.webpackManifest = ${JSON.stringify(chunkManifest)};
      //]]>` : ''}
    </script>
    <script src='${process.env.NODE_ENV === 'production' ? assetsManifest['/vendor.js'] : '/vendor.js'}'></script>
    <script src='${process.env.NODE_ENV === 'production' ? assetsManifest['/app.js'] : '/app.js'}'></script>
    <script src='https://js.stripe.com/v3/'></script>
  </body>
</html>`;
返回`
${head.base.toString()}
${head.title.toString()}
${head.meta.toString()}
${head.link.toString()}
${head.script.toString()}
${process.env.NODE_env==='production'?``:''}
${html}
window.\uuuu INITIAL\u STATE\uuuu=${JSON.stringify(initialState)};
${process.env.NODE_env==='production'?
`//` : ''}
`;

您的问题是,在加载
stripe.js
之前,应用程序脚本正在运行


放在头上,或者至少放在你的应用程序之前(
app.js

放在头上,或者至少放在你的应用程序之前(
app.js
)。这是漫长的一天。谢谢你指出这一点。我会写一个正确的答案,如果我的解决方案有效,你可以接受。