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 事件添加一个值，可在其中为 AdControl 定义 div 中的数据-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 ，以便你可以看到正在生成的消息。 为此，请在 div for myAd 后面添加以下代码。

    <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 对象只能有一个应用程序 ID。 因此，创建具有不同应用程序 ID 的其他应用程序 ID 会在运行时触发错误。 为此，请在添加的上 一个 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. 生成并运行该文件。 你将看到前面生成的示例应用的原始广告以及描述错误的广告下的文本。 不会看到 ID 为 liveAd 的广告。