47

有一些服务（如 FB like 或 AddThis）提供代码片段。看起来像

<div class="service-name" data-something="x"></div>
<script type="text/javascript" src="http://service-domain.com/service-name.js"></script>

好的，很酷，所以通常你将它粘贴到你的 HTML 中并且它可以工作。不是流星。

这是我看到的：

  • <script>模板/正文内部没有加载——我在资源中没有看到它，Meteor 中的某些东西实际上阻止了浏览器将其识别为 JS 文件
  • 它的工作原理<head>

现在这里有问题和疑问：

  1. 我不想加载它<head>——因为速度
  2. 即使我从那里加载它——我们也有 QA 和 PROD 环境。他们必须从不同的域（如 service-domain-qa.com 与 service-domain.com）加载此脚本

令人惊讶的是，您不能在<head>.

使用传统框架，这根本不是问题——你可以在任何地方包含脚本，它们只是加载；您可以在服务器模板的任何部分使用逻辑/变量。

那么，我应该如何在 Meteor 中做到这一点？让我重复一遍：

  • 我需要将一些外部脚本（托管在第 3 方域上）加载到我的应用页面中
  • 将此脚本保存到我的项目文件夹中不是一种选择
  • 脚本路径取决于环境（我们已经有设置系统），所以渲染它的模板的位置应该从代码中传递一些数据

我知道如何通过 Template.created 上的代码（使用 LAB.js 或其他）加载动态脚本来实现这一点，但这太过分了......

4

7 回答 7

25

My solution is use packages. See https://github.com/meteor/meteor/tree/master/packages/spiderable for more details.

Package.describe({
  summary: "External script"
});

Package.on_use(function (api) {
  api.use(['templating'], 'client');

  api.add_files('external_script.html', 'client');
});



<head><script type="text/javascript" src=""//mc.yandex.ru/metrika/watch.js""></script></head>
于 2013-07-06T19:27:16.533 回答
25

<script>正文或模板中的标签不由 Meteor 执行，它们被解析然后由 Meteor 的模板系统处理。您不能期望其中任何一个中的脚本标记都能像普通 HTML 页面那样工作。

解决方案是使用模板事件（您可以手动将脚本标签附加到正文或其他内容）或像您说的那样动态加载它。这不是矫枉过正，这就是 Meteor 的工作方式——记住，没有传统的 HTML 页面或正文，只有 Meteor API，而且 Meteor API 规定，为了加载和执行外部脚本，您必须使用适当的 API 方法。

于 2013-01-17T23:10:26.463 回答
11

如果您使用 IronRouter，您可以使用此包加载外部 scipt： https ://github.com/DerMambo/wait-on-lib

Router.map( function () {
  this.route('codeEditor',{
    waitOn: IRLibLoader.load('https://some-external.com/javascript.js')
  });
});
于 2013-11-06T18:49:30.910 回答
8

为什么不使用 jQuery 的 getscript？

http://api.jquery.com/jquery.getscript/

您可以添加回调函数

于 2014-01-06T08:13:34.910 回答
3

您可以使用类似yepnope的东西 来异步加载脚本。我在需要时使用它来加载传单。我开始转向通过 yepnope 加载更多脚本，以便我的应用程序在初始页面加载时呈现最低限度。我将 yepnope 的东西放在 Template.created 中。

于 2013-02-14T01:48:26.230 回答
2

使用 iframe 和公共目录是我用来嵌入脚本代码的一种技巧。这是针对谷歌广告代码的，我这样做是我的主要 html 模板：

<iframe src="/gads.html?v={{{unique}}}" seamless width="160" height="600"
 scrolling="no" frameborder="0" marginheight="0" marginwidth="0"
 style="margin:0;padding:0;border:none;width:160px;height:600px"></iframe>

然后在公共目录中放置一个带有我的 google adwords 代码的 gads.html 文件，如下所示：

<html>
<head>
<style type="text/css">
* {
margin: 0;
padding: 0;
}
</style>
</head>
<body>
<div>
<script type="text/javascript"><!--
google_ad_client = "ca-pub-54*********";
google_ad_slot = "66******";
google_ad_width = 160;
google_ad_height = 600;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</div>
</body>
</html>

这有助于在页面上获取代码，尽管它远非理想（一方面，我认为它违反了谷歌的服务条款）。

于 2013-05-20T19:07:09.297 回答
1

我正在使用流星 1.0。我已将所有外部 SCRIPT 标签放在布局模板中标签之前的 DIV 元素中。Meteor 可以毫无问题地识别它们，并且它们是由浏览器加载的。

于 2014-12-31T16:25:09.237 回答