3

私はClojurescriptに比較的慣れておらず、問題が何であるかよくわからない何かに遭遇しました。clojurescriptに、スクリプトがロードしようとさえしないFBAPIをロードするための新しいスクリプト要素をドキュメントに追加する関数があります。そのリソースのアクティビティはありません。例をjavascriptで書き直しましたが、機能します。生成されたclojurescriptコードを確認しましたが、基本的には、作成したjavascriptコードと同じように見えます。私はいくつかのことを試しましたが、最終的にはブラウザがClojureScriptを使用して動的スクリプトをロードすることはできません。

私のコードは

(ns wearthisorthat.client.fblogin
  (:require  [goog.net.XhrIo :as xhr]
             [cljs.reader :as cljrdr]
             [clojure.browser.repl :as repl]
             [domina.events :as ev]
             [domina :as d]
             [domina.css :as css]))

(defn load-fb-sdk [debug?]
  (let [ id "facebook-jssdk"
        debug-str (if debug? "/debug" "")
        ref (d/by-id "fb-script")
        _ (.log js/console "ref = " ref)
        parent (.-parent ref)
        el-id (d/by-id id)
        element (d/string-to-dom (str "<script id=" id " async"
                                      " src=//connect.facebook.net/en_US/all"
                                      debug-str ".js></script>"))
        _ (.log js/console element)]
    (when-not el-id (d/insert-before! ref element))))

(defn ^:export fbcb []
  (let [data {:appId "<myappid>",
              :channelUrl "<my-channel>",
              :status true,
              :cookie true,
              :xfbml true}]
    (.log js/console "RRRRRRRRRRR")
    (js/FB.init (clj->js data))))

;; Load the SDK's source Asynchronously
(.log js/console "RIGHT HERE")
(aset js/window "fbAsyncInit" fbcb)

(load-fb-sdk true)

私のindex.html（上記の私のcljsからの更新前）

<!DOCTYPE html>
<html>
<head>
</head>
<body>
  <div id="fb-root"></div>
  <script id="fb-script"></script>
  <script type="text/javascript" src="js/wtot.js"></script>
</body>
</html>

cljsを実行すると、ドキュメントは次のようになります...

<!DOCTYPE html>
<!-- saved from url=(0037)http://localhost:3000/wtot/index.html -->
<html><head><meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
</head>
<body>
  <div id="fb-root"></div>
  <script id="facebook-jssdk" async src="//connect.facebook.net/en_US/all/debug.js"></script>
  <script id="fb-script"></script>
  <script type="text/javascript" src="./index_files/wtot.js"></script>

</body>
</html>

Googleネットワークトラフィックには、ロードされているindex.htmlとwtot.jsのみが表示され、debug.jsは表示されません（エラーはありませんが、デバッグを試行するための参照はログにありません）。上記の動的要素をコピーしてindex.htmlに貼り付けることにより、動的スクリプト要素を静的にすると、コードは期待どおりに機能します。そして、前述のように、スクリプト要素の動的な追加を含め、これをすべてjavascriptで作成すると、すべて機能します。私は何が欠けていますか？

4

1 に答える 1

3

ちょっとしたアイデア: スクリプトを動的に追加することに関するいくつかの ページを見てきましたが、それらはすべて新しいスクリプトを作成し、それを<HEAD>ではなく の子として追加し<BODY>ます。

  var head= document.getElementsByTagName('head')[0];
  var script= document.createElement('script');
  script.type= 'text/javascript';
  script.src= 'helper.js';
  head.appendChild(script);
于 2013-03-14T02:22:07.900 に答える