JavaScript 錯誤處理的逐步解說

警告

自 2020 年 6 月 1 日起,Windows UWP 應用程式的 Microsoft 廣告收益平台將會關閉。 深入了解

本逐步解說示範如何在 JavaScript 應用程式中攔截廣告相關錯誤。 本逐步解說使用 AdControl 來顯示橫幅廣告,但其中的一般概念也適用於插播式廣告和原生廣告。

這些範例假設您有包含 AdControl的 JavaScript 應用程式。 如需示範如何將 AdControl 新增至應用程式的逐步指示,請參閱 HTML 5 和 JavaScript 中的 AdControl。 如需示範如何將橫幅廣告新增至 JavaScript/HTML 應用程式的完整範例專案,請參閱 [GitHub 上的廣告範例]https://github.com/microsoft/Windows-universal-samples/tree/b1cb20f191d3fd99ce89df50c5b7d1a6e2382c01/archived/Advertising).

  1. 在 default.html 檔案中,新增 onErrorOccurred 事件的值,您可以在此為 AdControldiv 中定義 data-win-options。 在 default.html 檔案中尋找下列程式碼。
    <div id="myAd" style="position: absolute; top: 53px; left: 0px; width: 300px; height: 250px; z-index: 1"
      data-win-control="MicrosoftNSJS.Advertising.AdControl"
      data-win-options="{applicationId: '3f83fe91-d6be-434d-a0ae-7351c5a997f1', adUnitId: 'test'}">
    </div>
    
    adUnitId 屬性之後,新增 onErrorOccurred 事件的值。
    <div id="myAd" style="position: absolute; top: 53px; left: 0px; width: 300px; height: 250px; z-index: 1"
      data-win-control="MicrosoftNSJS.Advertising.AdControl"
      data-win-options="{applicationId: '3f83fe91-d6be-434d-a0ae-7351c5a997f1', adUnitId: 'test', onErrorOccurred: errorLogger}">
    
```
  1. 建立 div,這將顯示文字讓您可以看到產生的訊息。 若要這麼做,請在 myAddiv for 之後新增下列程式碼。

    <div style="position:absolute; width:100%; height:130px; top:300px; left:0px">
        <b>Ad Events</b><br />
        <div id="adEvents" style="width:100%; height:110px; overflow:auto"></div>
    </div>
    
  2. 建立 AdControl,這將觸發錯誤事件。 應用程式中所有 AdControl 物件只能有一個應用程式識別碼。 因此,另外建立具有不同應用程式識別碼的物件將會在執行階段觸發錯誤。 若要這麼做,請在先前新增的 div 區段之後,將下列程式碼新增至 default.html 頁面的本文。

    <!-- Because only one applicationId can be used, the following ad control will fire an error event. -->
    <div id="liveAd" style="position: absolute; top:500px; left:0px; width:480px; height:80px"
      data-win-control="MicrosoftNSJS.Advertising.AdControl"
      data-win-options="{applicationId: '00000000-0000-0000-0000-000000000000', adUnitId: 'test', onErrorOccurred: errorLogger }" >
    </div>
    
  3. 在專案的 default.js 檔案中,在預設初始化函式之後,您將新增 errorLogger 的事件處理常式。 捲動至檔案結尾,並在最後一個分號之後放置下列程序碼。

    WinJS.Utilities.markSupportedForProcessing(
    window.errorLogger = function (sender, evt) {
        adEvents.innerHTML = (new Date()).toLocaleTimeString() + ": " +
        sender.element.id + " error: " + evt.errorMessage + " error code: " +
        evt.errorCode + "<br>" + adEvents.innerHTML;
        console.log("errorhandler hit. \n");
    });
    
  4. 建置和執行檔案。 您會看到您先前建置的範例應用程式的原始廣告,以及該廣告底下描述錯誤的文字。 您不會看到具有 liveAd 識別碼的廣告。