在webview中顯示動態內容UWP

我想顯示來自外部服務的產品規格。爲此，我必須將下面的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

什麼，我哪裏做錯了？

來源

2017-01-12 Prince

我創建了一個簡單的HTML頁面與您的代碼，並在Chrome測試。加載一些txt文件時會引發一些錯誤。在嘗試將其集成到WebView之前，您應該創建一個可用的網頁。 –

如果我在在線工具（http://www.onlinehtmleditor.net/）中嘗試使用此HTML，所有內容都會顯示出來，包括圖片 – Prince

對於我來說，這是行不通的，因爲下面的腳本中不正確添加到您的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>

來源

2017-01-16 12:25:12

謝謝@Arnaud。我們是否有可能像插入協議那樣解決這個問題，還是要求他們修復它？ – Prince

我認爲你可以通過直接在html內容中導入lazy.js來修改你的頁面。根據我的測試，您還必須包含jquery.js。然後，你可以創建一個循環遍歷所有圖像的函數，在所有的'src'和'data-srcset'屬性中添加http：//前綴。之後，嘗試在'img'元素上調用lazyshow事件（在lazy.js中聲明）。通過所有這些步驟，我認爲它可以工作:) –

在webview中顯示動態內容UWP

回答

相關問題