2017-01-12 10 views
0

外部サービスからの製品仕様を表示したい。これを行うには、JSの文字列をWebviewに渡す必要があります。webview UWPで動的コンテンツを表示

<!DOCTYPE html> 
<html> 
<body> 

    <div id="flix-minisite"></div> 
<div id="flix-inpage"></div> 
<script 
type="text/javascript" 
src="http://media.flixfacts.com/js/loader.js" 
data-flix-distributor="12612" 
data-flix-language="id" 
data-flix-brand="Samsung" 
data-flix-mpn="UA55JU6600KPXD" 
data-flix-ean="" 
data-flix-sku="" 
data-flix-button="flix-minisite" 
data-flix-inpage="flix-inpage" 
data-flix-button-image="" 
data-flix-fallback-language="e2" 
data-flix-price="" 
async> 
</script> 
</body>   </html> 

私は以下のメソッドを追加しました:これを追加する

webview.NavigateToString("htmlString"); 

はただサービスからテキストを表示しますが、画像や動画が表示され取得されていません。

期待される結果:私は私が間違ってやっている何 http://media.flixcar.com/delivery/minisite/show/12612/id/957752

+0

私はあなたのコードに簡単なHTMLページを作成し、Chromeでそれをテストしてきました。いくつかのtxtファイルを読み込んでいるときにいくつかのエラーが発生します。 WebViewに統合する前に、実行可能なWebページを作成する必要があります。 –

+0

このHTMLをオンラインツール(http://www.onlinehtmleditor.net/)で試してみると、画像を含むすべてが表示されます。 – Prince

答えて

0

私にとって、それは動作しませんので、正しくHTMLページに追加されていないで、次のスクリプト:

<script type="text/javascript" src="//media.flixcar.com/delivery/static/inpage/9/js/lazy.js"></script> 

これは、動的スクリプトhttp://media.flixcar.com/delivery/static/inpage/9/js/append.jsによって追加されます。

URLはhttp://media.flixcar.com/delivery/static/inpage/9/js/lazy.jsである必要があります。これは、webview(これはEdgeブラウザ以外のもの)によって正しく読み込まれるためです。

私はあなたも各画像の属性を更新する必要があると思います。現在のところ、それらはすべてのブラウザでサポートされていないプロトコルなしで追加されています(私にとってはChromeでのみ動作します)。

プロトコルは、問題を修正する追加
<div class="flix-feature-image"> 
    <img src="//media.flixcar.com/delivery/static/mobile/standard/img/loading_icon.gif" 
     data-srcset="//media.flixcar.com/f360cdn/Samsung-1601328499-id-feature-uhd-ju6600-ua65ju6600kpxd-52938564 2x, //media.flixcar.com/f360cdn/Samsung-1601328499-id-feature-uhd-ju6600-ua65ju6600kpxd-52938564 770w"> 
</div> 

<div class="flix-feature-image"> 
    <img src="http://media.flixcar.com/delivery/static/mobile/standard/img/loading_icon.gif" 
     data-srcset="http://media.flixcar.com/f360cdn/Samsung-1601328499-id-feature-uhd-ju6600-ua65ju6600kpxd-52938564 2x, http://media.flixcar.com/f360cdn/Samsung-1601328499-id-feature-uhd-ju6600-ua65ju6600kpxd-52938564 770w"> 
</div> 
+0

ありがとうございます@Arnaud。私たちがすべての要求にプロトコルを挿入するのと同じようにこれを修正することは可能でしょうか、それを修正するように依頼する方が良いでしょうか? – Prince

+0

私はあなたのHTMLコンテンツに直接lazy.jsをインポートすることでページを修正できると思います。また、テストに基づいてjquery.jsを組み込む必要があります。次に、すべての画像をループして、すべての 'src'と' data-srcset'属性にhttp://プレフィックスを追加する関数を作成することができます。その後、 'img'要素のイベント' lazyshow'(lazy.jsで宣言された)を呼び出すようにしてください。このすべてのステップで、私はそれが動作すると思う:) –

関連する問題