MeteorでTwitterウィジェットのような外部スクリプトをロードする方法は?

ダニエルフィッシャー

私は次のような流星にTwitterウィジェットをロードしようとしています:

<blockquote class="twitter-tweet" lang="en"><p>&quot;Curiosity Finds Iron Meteorite on Mars&quot; <a href="http://t.co/qh6f1ITd7b">http://t.co/qh6f1ITd7b</a></p>&mdash; Daniel Fischer (@dfischer) <a href="https://twitter.com/dfischer/statuses/489240003927887872">July 16, 2014</a></blockquote>
<script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>

しかし、これは平文としてロードされます。

パッケージを作成してみました:

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

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

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

widget.htmlには次のものがあります。

<head><script type="text/javascript" src="//platform.twitter.com/widgets.js"></script></head>

しかし、運がありません。これを機能させる方法について何かアイデアはありますか?

アンドレアス・フルス

テンプレート(widgetTemplateと呼びましょう)で、ウィジェットをレンダリングする必要がある場所で、次の関数を使用します(安全のためにtry / catch)。

Template.widgetTemplate.rendered = function () {
    try {
        twttr.widgets.load();
    } catch (e) {}
}

同じことがFacebookウィジェットにも使用できます(共有など)- FB.XFBML.parse()

ヘッドにwidgets.jsがロードされていることを確認してください-syncまたはasync。

非同期ロードの場合は、「head」で次のコードを使用します。

<script>
    ! function (d, s, id) {
        var js, fjs = d.getElementsByTagName(s)[0];
        if (!d.getElementById(id)) {
            js = d.createElement(s);
            js.id = id;
            js.src = "https://platform.twitter.com/widgets.js";
            fjs.parentNode.insertBefore(js, fjs);
        }
    }(document, "script", "twitter-wjs");
</script>

この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。

侵害の場合は、連絡してください[email protected]

編集
0

コメントを追加

0

関連記事

分類Dev

クリックハンドラーをカスタムjQueryUIウィジェットに追加し、ハンドラーでウィジェットのプロパティを使用するにはどうすればよいですか?

分類Dev

アイテムのドラッグアンドドロップでリストのようなウィジェットを作成する最も簡単な方法は?

分類Dev

AndroidでTwitterプロフィールページのようなレイアウトを作成する方法

分類Dev

Qt C ++アプリで、かなりの量のウィジェットを含むスクロール可能なリストをアイテムとして表示するにはどうすればよいですか?

分類Dev

Meteorアプリ:グローバルウィンドウオブジェクトにアクセスする方法

分類Dev

このような異なるサイズの子ウィジェットでグリッドビューを実現する方法はありますか?

分類Dev

Spring Bootプロジェクトにメソッドベースのセキュリティを追加するにはどうすればよいですか?

分類Dev

VBAで特定の外部アプリウィンドウ(オブジェクト)を参照するにはどうすればよいですか?

分類Dev

外部JavaScriptコードを使用してBokehプロットまたはウィジェットにアクセスして更新する方法は?

分類Dev

ソリューションテストのコードカバレッジ結果ファイルを、テストプロジェクトディレクトリではなくソリューションディレクトリに出力する方法

分類Dev

ウィジェットの外部にブロックイベントをディスパッチする方法は?

分類Dev

プロバイダーを使用して、画面上のすべてのウィジェットではなく、1つのウィジェットにテキストを同時にナビゲートするにはどうすればよいですか?

分類Dev

Eclipseプロジェクトで外部コードの変更を自動リロードする方法は?

分類Dev

画像やその他のアセットをロードするときに、Xcodeプロジェクトでディレクトリ/グループ化パスをシミュレートするにはどうすればよいですか?

分類Dev

ウィジェットのリストをラップするにはどうすればよいですか?

分類Dev

ダウンロード済みのプロジェクトをチェックアウトするにはどうすればよいですか?

分類Dev

Qtウィジェット; QTCreatorプロジェクトピッカーのようなデザインを作成する方法

分類Dev

php mysqlプロジェクトを無料のウェブホスティングサイトにアップロードするときにdbconnファイルのエラーを修正するにはどうすればよいですか?

分類Dev

ダウンストリームオブジェクトのサブセットから関与する複雑なアクティブレコードhas_manyからリストを取得するにはどうすればよいですか

分類Dev

CQ5カスタムウィジェットの開発-ハードコードされた値をウィジェットスクリプトの外部に保持する-グローバル変数を使用する

分類Dev

リストボックスが空のときにプロジェクトのプロパティで「スタートアップオブジェクト」を選択するにはどうすればよいですか?

分類Dev

シーンのあるプロジェクトでAppDelegateのウィンドウ== nilを修正する方法は?

分類Dev

シーンのあるプロジェクトでAppDelegateのウィンドウ== nilを修正する方法は?

分類Dev

Chromeアプリで新しいハングアウトウィジェットのような円形のフレームレスウィンドウを取得する方法

分類Dev

HoloViews / Bokehのプロット間にウィジェット(セレクター)とインタラクティブ機能(タップストリーム)を備えたダッシュボードを作成するにはどうすればよいですか?

分類Dev

Jekyllページの外部スクリプトをロードする方法は?

分類Dev

カスタムスクリプトを使用してTwitterフィードウィジェットを自動的に更新する方法

分類Dev

リストにジェネリックオブジェクトのプロパティを設定するにはどうすればよいですか?

分類Dev

ファイルエクスプローラー/プロジェクトウィンドウのphpstormライトイエローのハイライト、それは何ですか?色を変更するにはどうすればよいですか?

Related 関連記事

  1. 1

    クリックハンドラーをカスタムjQueryUIウィジェットに追加し、ハンドラーでウィジェットのプロパティを使用するにはどうすればよいですか?

  2. 2

    アイテムのドラッグアンドドロップでリストのようなウィジェットを作成する最も簡単な方法は?

  3. 3

    AndroidでTwitterプロフィールページのようなレイアウトを作成する方法

  4. 4

    Qt C ++アプリで、かなりの量のウィジェットを含むスクロール可能なリストをアイテムとして表示するにはどうすればよいですか?

  5. 5

    Meteorアプリ:グローバルウィンドウオブジェクトにアクセスする方法

  6. 6

    このような異なるサイズの子ウィジェットでグリッドビューを実現する方法はありますか?

  7. 7

    Spring Bootプロジェクトにメソッドベースのセキュリティを追加するにはどうすればよいですか?

  8. 8

    VBAで特定の外部アプリウィンドウ(オブジェクト)を参照するにはどうすればよいですか?

  9. 9

    外部JavaScriptコードを使用してBokehプロットまたはウィジェットにアクセスして更新する方法は?

  10. 10

    ソリューションテストのコードカバレッジ結果ファイルを、テストプロジェクトディレクトリではなくソリューションディレクトリに出力する方法

  11. 11

    ウィジェットの外部にブロックイベントをディスパッチする方法は?

  12. 12

    プロバイダーを使用して、画面上のすべてのウィジェットではなく、1つのウィジェットにテキストを同時にナビゲートするにはどうすればよいですか?

  13. 13

    Eclipseプロジェクトで外部コードの変更を自動リロードする方法は?

  14. 14

    画像やその他のアセットをロードするときに、Xcodeプロジェクトでディレクトリ/グループ化パスをシミュレートするにはどうすればよいですか?

  15. 15

    ウィジェットのリストをラップするにはどうすればよいですか?

  16. 16

    ダウンロード済みのプロジェクトをチェックアウトするにはどうすればよいですか?

  17. 17

    Qtウィジェット; QTCreatorプロジェクトピッカーのようなデザインを作成する方法

  18. 18

    php mysqlプロジェクトを無料のウェブホスティングサイトにアップロードするときにdbconnファイルのエラーを修正するにはどうすればよいですか?

  19. 19

    ダウンストリームオブジェクトのサブセットから関与する複雑なアクティブレコードhas_manyからリストを取得するにはどうすればよいですか

  20. 20

    CQ5カスタムウィジェットの開発-ハードコードされた値をウィジェットスクリプトの外部に保持する-グローバル変数を使用する

  21. 21

    リストボックスが空のときにプロジェクトのプロパティで「スタートアップオブジェクト」を選択するにはどうすればよいですか?

  22. 22

    シーンのあるプロジェクトでAppDelegateのウィンドウ== nilを修正する方法は?

  23. 23

    シーンのあるプロジェクトでAppDelegateのウィンドウ== nilを修正する方法は?

  24. 24

    Chromeアプリで新しいハングアウトウィジェットのような円形のフレームレスウィンドウを取得する方法

  25. 25

    HoloViews / Bokehのプロット間にウィジェット(セレクター)とインタラクティブ機能(タップストリーム)を備えたダッシュボードを作成するにはどうすればよいですか?

  26. 26

    Jekyllページの外部スクリプトをロードする方法は?

  27. 27

    カスタムスクリプトを使用してTwitterフィードウィジェットを自動的に更新する方法

  28. 28

    リストにジェネリックオブジェクトのプロパティを設定するにはどうすればよいですか?

  29. 29

    ファイルエクスプローラー/プロジェクトウィンドウのphpstormライトイエローのハイライト、それは何ですか?色を変更するにはどうすればよいですか?

ホットタグ

アーカイブ