2

PhoneGap (Cordova 1.6) と ChildBrowser で Xcode 4 を使用しています。OSX で SiteCrawler を使用して、Web サイトを正常にダウンロードしてローカライズしました。画像、PDF などをローカルで完全に参照できます。すべてのローカライズされたサイト ファイルを PhoneGap www フォルダーに移動しました。アプリのテストは問題なくビルドされます。サイトは完全に閲覧可能です。

サイト上の PDF を独自のウィンドウで開くようにしたいのですが、ChildBrowser は私のニーズに合わせてこれを完璧に行います。http://blog.digitalbackcountry.com/2012/03/installing-the-childbrowser-plugin-for-ios-with-phonegapcordova-1-5/を使用して、ChildBrowser をインストールして動作させることができました - PDF ファイルを開いていますChildBrowser で。

私の問題は、上記のリンクを使用して、 ontouchstart="loadChildBrowser('/path/to/file.pdf'); return false;" を追加する必要があることです。サイト上のすべての PDF リンクに。CMS を使用しているため、これは大きな問題ではありません。大量の PDF は、CMS からデータが入力されたテンプレートから呼び出され、問題ありません。しかし、クライアントがアップロードされた PDF へのリンクをページのコンテンツに追加したサイトのページがいくつかあります。この場合、上記のコードをインライン リンクに簡単に追加する方法はありません。

jQueryを使用して、クリックするとページ上の各タグを確認し、クリックするとChildBroswerインスタンスを実行できると考えました。これは両方のタイプのPDFリンクをカバーしますが、うまくいかないようです。ここに私が持っているものがあります:

    <script type="text/javascript" src="/a/js/cordova-1.6.0.js"></script>
    <script type="text/javascript" src="/a/js/ChildBrowser.js"></script>
    <script>

    // install ChildBrowser
    var cb = ChildBrowser.install();

    //loading a web page in ChildBrowser 
    $('a[href$=pdf]').click(function() {
        var href = $(this).attr('href');
        cb.showWebPage(encodeURI(href));
        return false;
    });
    </script>

インライン リンク JavaScript を使用せずに上記を使用すると、子ブラウザーなしで PDF が単独で開きます。

以下を ontouchstart="loadChildBrowser('/path/to/file.pdf'); return false;" と共に使用すると、子ブラウザーが開き、一部のリンクでは PDF が表示され、他のリンクでは単に読み込み中と表示されます。これはパスの微調整にすぎないと思いますが、機能させることができれば、上記が最も普遍的だと思います。

    <script type="text/javascript" src="/a/js/cordova-1.6.0.js"></script>
    <script type="text/javascript" src="/a/js/ChildBrowser.js"></script>
    <script>

    // install ChildBrowser
    var cb = ChildBrowser.install();

    //loading a web page in ChildBrowser 
    function loadChildBrowser(file) { 
        cb.showWebPage(encodeURI(file)); 
    }
    </script>
4

1 に答える 1

3

試行錯誤の結果、ほとんどの部分でこれを機能させることができました。私はまだいくつかの無関係なバグに遭遇しています (Childbrowser に関連していますが、ローカル PDF ファイルの読み込みには関連していません)。

したがって、ontouchstart="loadChildBrowser('/path/to/file.pdf'); return false;" を使用します。サイト上の PDF へのすべてのリンクは、まだ道のりです。変更されたのは、PDF へのパスを特定して ChildBrowser を起動するために使用している JS 関数です。私はこれをしなければなりませんでした：

<script type="text/javascript" src="/a/js/cordova-1.6.0.js"></script>
<script type="text/javascript" src="/a/js/ChildBrowser.js"></script>
<script>

    // install ChildBrowser
    var cb = ChildBrowser.install();

    //loading a web page in ChildBrowser 
    function loadChildBrowser(file) {
        var path = location.pathname+file;
        var len = path.length;
        var locleft = path.indexOf('/www/')+4;
        var trim = len-locleft;
        var left = path.slice(0,-trim);
        var locright = path.indexOf('/assets/');
        var trim = len-locright;
        var right = path.slice(-trim);
        var finalPath = left+right;
        cb.showWebPage(encodeURI(finalPath)); 
    } 

</script>

インクルードされたヘッダー ファイル (サイトのすべてのページの先頭に存在します)。問題は、ChildBrowser がファイルへのパスをプルアップしたときに、通常のサイトの Web ルート (/assets/documents/xxx.pdf) の下の部分を、その時点でアプリで表示されているページへのフル パスに追加していたことです。 、だから私は次のようになりました：

/var/users/name/blah/blah/www/page.html/assets/documents/xxx.pdf

私たちが望んでいたとき：

/var/users/name/blah/blah/www/assets/documents/xxx.pdf

上記のスクリプトは、ChildBrowser を呼び出す関数 (ontouch start) から渡されたファイル var の先頭に location.pathname を追加して、最終的に次のようにします。

/var/users/name/blah/blah/www/page.html/assets/documents/xxx.pdf (不正解)

次に、それを左側のセクション (/www の前のすべて) と右側のセクション (/assets/ を含む以降のすべて) に分割し、それらを連結して (すべてのサイト ディレクトリと html ファイル情報を効果的に削除します)、その finalPath で ChildBrowser を呼び出します。 . 私のために働いています。

于 2012-04-27T06:12:31.557 に答える