Guía de solución de problemas de HTML y JavaScript

Artículo
07/05/2024

Advertencia

A partir del 1 de junio de 2020, se cerrará la plataforma de monetización de anuncios de Microsoft para aplicaciones para UWP de Windows. Más información

Este tema contiene soluciones a problemas comunes de desarrollo con las bibliotecas de Microsoft Advertising en aplicaciones JavaScript/HTML.

HTML
JavaScript

HTML

AdControl no aparece

Asegúrese de que la funcionalidad internet (cliente) está seleccionada en Package.appxmanifest.
Asegúrese de que la referencia de JavaScript está presente. Sin la referencia ad.js en la <sección principal> (después de la referencia de default.js), AdControl no podrá mostrarse y se producirá un error durante la compilación.
```
<head>
    ...
    <script src="//Microsoft.Advertising.JavaScript/ad.js"></script>
    ...
</head>
```
Compruebe el identificador de la aplicación y el identificador de unidad de anuncios. Estos identificadores deben coincidir con el identificador de aplicación y el identificador de unidad de anuncio que obtuvo en el Centro de partners. Para obtener más información, consulta Configurar unidades de anuncios en la aplicación.
```
<div id="myAd" style="position: absolute; top: 50px; left: 0px;
                      width: 250px; height: 250px; z-index: 1"
     data-win-control="MicrosoftNSJS.Advertising.AdControl"
     data-win-options="{applicationId: 'ApplicationID',
                        adUnitId: 'AdUnitID'}">
</div>
```

Compruebe las propiedades de alto y ancho . Deben establecerse en uno de los tamaños de anuncios admitidos para los anuncios de banner.

<div id="myAd" style="position: absolute; top: 50px; left: 0px;
                      width: 250px; height: 250px; z-index: 1"
     data-win-control="MicrosoftNSJS.Advertising.AdControl"
     data-win-options="{applicationId: 'ApplicationID',
                        adUnitId: 'AdUnitID'}">
</div>

Compruebe el posicionamiento del elemento. AdControl debe estar dentro del área visible.

Compruebe la propiedad visibility . Esta propiedad no debe establecerse en contraída o oculta. Esta propiedad se puede establecer insertada (como se muestra a continuación) o en una hoja de estilos externa.

<div id="myAd" style="visibility: visible; position: absolute; top: 1025px;
                      left: 500px; width: 250px; height: 250px; z-index: 1"
     data-win-control="MicrosoftNSJS.Advertising.AdControl"
     data-win-options="{applicationId: 'ApplicationID',
                        adUnitId: 'AdUnitID'}">
</div>

Compruebe la propiedad position . La propiedad position debe establecerse en un valor adecuado en función de las demás propiedades del elemento (por ejemplo, los márgenes del elemento primario y el índice z). Esta propiedad se puede establecer insertada (como se muestra a continuación) o en una hoja de estilos externa.

<div id="myAd" style="visibility: visible; position: absolute; top: 1025px;
                      left: 500px; width: 250px; height: 250px; z-index: 1"
     data-win-control="MicrosoftNSJS.Advertising.AdControl"
     data-win-options="{applicationId: 'ApplicationID',
                        adUnitId: 'AdUnitID'}">
</div>

Compruebe la propiedad z-index . La propiedad z-index debe establecerse lo suficientemente alta como para que AdControl siempre aparezca encima de otros elementos. Esta propiedad se puede establecer insertada (como se muestra a continuación) o en una hoja de estilos externa.

<div id="myAd" style="visibility: visible; position: absolute; top: 1025px;
                      left: 500px; width: 250px; height: 250px; z-index: 1"
     data-win-control="MicrosoftNSJS.Advertising.AdControl"
     data-win-options="{applicationId: 'ApplicationID',
                        adUnitId: 'AdUnitID'}">
</div>

Compruebe las hojas de estilos externas. Si las propiedades se establecen en el elemento AdControl a través de una hoja de estilos externa, asegúrese de que todas las propiedades anteriores se establecen correctamente.

<div id="myAd" style="visibility: visible; position: absolute; top: 1025px;
                      left: 500px; width: 250px; height: 250px; z-index: 1"
     data-win-control="MicrosoftNSJS.Advertising.AdControl"
     data-win-options="{applicationId: 'ApplicationID',
                        adUnitId: 'AdUnitID'}">
</div>

Compruebe el elemento primario de AdControl. Si AdControl reside en un elemento primario, el elemento primario debe estar activo y visible.

<div style="position: absolute; width: 500px; height: 500px;">
    <div id="myAd" style="position: relative; top: 0px; left: 100px;
                          width: 250px; height: 250px; z-index: 1"
         data-win-control="MicrosoftNSJS.Advertising.AdControl"
         data-win-options="{applicationId: 'ApplicationID',
                            adUnitId: 'AdUnitID'}">
    </div>
</div>

Asegúrese de que AdControl no está oculto en la ventanilla. AdControl debe estar visible para que los anuncios se muestren correctamente.
Los valores dinámicos de ApplicationId y AdUnitId no deben probarse en el emulador. Para asegurarse de que AdControl funciona según lo previsto, use los valores de prueba para ApplicationId y AdUnitId.

La caja negra parpadea y desaparece

Compruebe todos los pasos de la sección anterior de AdControl que no aparece .

Controle el evento onErrorOccurred y use el mensaje que se pasa al controlador de eventos para determinar si se produjo un error y qué tipo de error se produjo. Puede encontrar más detalles en Control de errores en el tutorial de JavaScript.

<div id="myAd" style="position: absolute; top: 0px; left: 0px;
                      width: 728px; height: 90px; z-index: 1"
     data-win-control="MicrosoftNSJS.Advertising.AdControl"
     data-win-options="{applicationId: 'ApplicationID',
                        adUnitId: 'AdUnitID',
                        onErrorOccurred: errorLogger}">
</div>
<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>

El error más común que provoca una caja negra es "No hay anuncios disponibles". Este error significa que no hay ningún anuncio disponible para devolver desde la solicitud.

El AdControl se comporta normalmente. De forma predeterminada, AdControl se contraerá cuando no pueda mostrar un anuncio. Si otros elementos son elementos secundarios del mismo elemento primario, pueden desplazarse para rellenar el espacio del AdControl contraído y expandirse cuando se realiza la siguiente solicitud.

Anuncios que no se actualizan

Compruebe la propiedad isAutoRefreshEnabled . De forma predeterminada, esta propiedad opcional se establece en true. Cuando se establece en false, el método refresh debe usarse para recuperar otro anuncio.

<div id="myAd" style="position: absolute; top: 0px; left: 0px;
                      width: 250px; height: 250px; z-index: 1"
     data-win-control="MicrosoftNSJS.Advertising.AdControl"
     data-win-options="{ applicationId: 'ApplicationID',
                        adUnitId: 'AdUnitID',
                        onErrorOccurred: errorLogger,
                        isAutoRefreshEnabled: true}">
</div>

Compruebe las llamadas al método refresh . Al usar la actualización automática, no se puede usar la actualización para recuperar otro anuncio. Al usar la actualización manual, solo se debe llamar a la actualización después de un mínimo de 30 a 60 segundos en función de la conexión de datos actual del dispositivo.

En este ejemplo se muestra cómo usar el método refresh . El código HTML siguiente muestra un ejemplo de cómo crear una instancia del AdControl con isAutoRefreshEnabled establecido en false.

<div id="myAd" style="position: absolute; top: 0px; left: 0px;
                      width: 250px; height: 250px; z-index: 1"
     data-win-control="MicrosoftNSJS.Advertising.AdControl"
     data-win-options="{ applicationId: 'ApplicationID',
                        adUnitId: 'AdUnitID',
                        onErrorOccurred: errorLogger,
                        isAutoRefreshEnabled: false}">
</div>

En el ejemplo se muestra cómo usar la función refresh .

args.setPromise(WinJS.UI.processAll()
    .then(function (args) {
        window.setInterval(function()
        {
            document.getElementById("myAd").winControl.refresh();
        }, 60000)
    })
);

El AdControl se comporta normalmente. A veces, el mismo anuncio aparecerá más de una vez en una fila dando la apariencia de que los anuncios no se actualizan.

JavaScript

AdControl no aparece

Asegúrese de que la funcionalidad internet (cliente) está seleccionada en Package.appxmanifest.

Asegúrese de que se crea una instancia de AdControl . Si no se crea una instancia de AdControl . no estará disponible.

Los fragmentos de código siguientes muestran un ejemplo de creación de instancias de AdControl. Este código HTML muestra un ejemplo de configuración de la interfaz de usuario para AdControl

<div id="myAd" style="position: absolute; top: 0px; left: 0px;
                      width: 250px; height: 250px; z-index: 1"
     data-win-control="MicrosoftNSJS.Advertising.AdControl">
</div>

En el código JavaScript siguiente se muestra un ejemplo de creación de instancias de AdControl

app.onactivated = function (args) {
    if (args.detail.kind === activation.ActivationKind.launch) {
        if (args.detail.previousExecutionState !==
                activation.ApplicationExecutionState.terminated)
        {
            var adDiv = document.getElementById("myAd");
            var myAdControl = new MicrosoftNSJS.Advertising.AdControl(adDiv,
            {
                applicationId: "{ApplicationID}",
                adUnitId: "{AdUnitID}"
             });                
             myAdControl.onErrorOccurred = myAdError;
        } else {
            ...
        }
    }
}

Compruebe el elemento primario. El div> primario <debe estar asignado, activo y visible correctamente.

var adDiv = document.getElementById("myAd");
var myAdControl = new MicrosoftNSJS.Advertising.AdControl(adDiv, {
    applicationId: "{ApplicationID}",
    adUnitId: "{AdUnitID}"
});

Compruebe el identificador de la aplicación y el identificador de unidad de anuncios. Estos identificadores deben coincidir con el identificador de aplicación y el identificador de unidad de anuncio que obtuvo en el Centro de partners. Para obtener más información, consulta Configurar unidades de anuncios en la aplicación.
```
var myAdControl = new MicrosoftNSJS.Advertising.AdControl(adDiv, {
    applicationId: "{ApplicationID}",
    adUnitId: "{AdUnitID}"
});  
```
Compruebe el elemento primario de AdControl. El elemento primario debe estar activo y visible.
Los valores dinámicos de ApplicationId y AdUnitId no deben probarse en el emulador. Para asegurarse de que AdControl funciona según lo previsto, use los valores de prueba para ApplicationId y AdUnitId.

La caja negra parpadea y desaparece

Compruebe todos los pasos de la sección AdControl que no aparece .
Controle el evento onErrorOccurred y use el mensaje que se pasa al controlador de eventos para determinar si se produjo un error y qué tipo de error se produjo. Puede encontrar más detalles en Control de errores en el tutorial de JavaScript.

En este ejemplo se muestra cómo implementar un controlador de errores que notifica mensajes de error. Este fragmento de código HTML proporciona un ejemplo de cómo configurar la interfaz de usuario para mostrar mensajes de error.
```
<div style="position:absolute; width:100%; height:130px; top:300px">
    <b>Ad Events</b><br />
    <div id="adEvents" style="width:100%; height:110px; overflow:auto"></div>
</div>
```
En este ejemplo se muestra cómo crear una instancia de AdControl. Esta función se insertaría en el archivo app.onactivated.
```
var myAdControl = new MicrosoftNSJS.Advertising.AdControl(adDiv,
{
    applicationId: "{ApplicationID}",
    adUnitId: "{AdUnitID}"
});                
myAdControl.onErrorOccurred = myAdError;
```
En este ejemplo se muestra cómo notificar errores. Esta función se insertaría debajo de la función de ejecución automática en el archivo default.js.
```
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;
    }
);
```
El error más común que provoca una caja negra es "No hay anuncios disponibles". Este error significa que no hay ningún anuncio disponible para devolver desde la solicitud.
El AdControl se comporta normalmente. A veces, el mismo anuncio aparecerá más de una vez en una fila dando la apariencia de que los anuncios no se actualizan.

Anuncios que no se actualizan

Compruebe si la propiedad IsAutoRefreshEnabled de su AdControl está establecida en false. De forma predeterminada, esta propiedad opcional se establece en true. Cuando se establece en false, el método Refresh debe usarse para recuperar otro anuncio.

Compruebe las llamadas al método Refresh . Cuando se usa la actualización automática (IsAutoRefreshEnabled es true), no se puede usar Refresh para recuperar otro anuncio. Cuando se usa la actualización manual (IsAutoRefreshEnabled es false), solo se debe llamar a Refresh después de un mínimo de 30 a 60 segundos en función de la conexión de datos actual del dispositivo.

En este ejemplo se muestra cómo crear el div para AdControl.

<div id="myAd" style="position: absolute; top: 0px; left: 0px;
                      width: 250px; height: 250px; z-index: 1"
     data-win-control="MicrosoftNSJS.Advertising.AdControl">
</div>

En este ejemplo se muestra cómo usar la función Refresh .

var myAdControl = new MicrosoftNSJS.Advertising.AdControl(adDiv,
{
  applicationId: "{ApplicationID}",
  adUnitId: "{AdUnitID}",
  isAutoRefreshEnabled: false
});
...
args.setPromise(WinJS.UI.processAll()
    .then(function (args) {
        window.setInterval(function()
        {
            document.getElementById("myAd").winControl.refresh();
        }, 60000)
    })
);

El AdControl se comporta normalmente. A veces, el mismo anuncio aparecerá más de una vez en una fila dando la apariencia de que los anuncios no se actualizan.

Compartir a través de

Guía de solución de problemas de HTML y JavaScript

HTML

AdControl no aparece

La caja negra parpadea y desaparece

Anuncios que no se actualizan

JavaScript

AdControl no aparece

La caja negra parpadea y desaparece

Anuncios que no se actualizan

Comentarios

Recursos adicionales