Guide de résolution des problèmes HTML et JavaScript

2025-06-10

Avertissement

Depuis le 1er juin 2020, la plateforme Microsoft Ad Monetization pour les applications Windows UWP sera arrêtée. En savoir plus

Cette rubrique contient des solutions aux problèmes de développement courants liés aux bibliothèques de publicités Microsoft dans les applications JavaScript/HTML.

HTML
JavaScript

HTML

AdControl n’apparaît pas

Vérifiez que la fonctionnalité Internet (Client) est sélectionnée dans Package.appxmanifest.
Vérifiez que la référence JavaScript est présente. Sans la référence ad.js dans la section principale de (après la référence default.js), le AdControl ne pourra pas s’afficher et une erreur se produira lors de la génération.
```
<head>
    ...
    <script src="//Microsoft.Advertising.JavaScript/ad.js"></script>
    ...
</head>
```
Vérifiez l’ID d’application et l’ID d’unité publicitaire. Ces ID doivent correspondre à l’ID d’application et à l’ID d’unité publicitaire que vous avez obtenus dans l’Espace partenaires. Pour plus d’informations, consultez Configurer des unités publicitaires dans votre application.
```
<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>
```

Vérifiez les propriétés de hauteur et de largeur . Ces paramètres doivent être fixés sur l'une des tailles d'annonces prises en charge pour les bannières.

<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>

Vérifiez le positionnement de l’élément. Le AdControl doit se trouver à l'intérieur de la zone visible.

Vérifiez la propriété de visibilité . Cette propriété ne doit pas être définie sur réduite ou masquée. Cette propriété peut être définie inline (comme indiqué ci-dessous) ou dans une feuille de style externe.

<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>

Vérifiez la propriété de la position . La propriété position doit être définie sur une valeur appropriée en fonction des autres propriétés de l’élément (par exemple, des marges dans l’élément parent et z-index). Cette propriété peut être définie inline (comme indiqué ci-dessous) ou dans une feuille de style externe.
```
<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>
```

Vérifiez la propriété z-index. La propriété z-index doit être suffisamment élevée pour que le AdControl s’affiche toujours sur d’autres éléments. Cette propriété peut être définie inline (comme indiqué ci-dessous) ou dans une feuille de style externe.

<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>

Vérifiez les feuilles de style externes. Si les propriétés sont définies sur l’élément AdControl via une feuille de style externe, vérifiez que toutes les propriétés ci-dessus sont correctement définies.

<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>

Vérifiez le parent de l'AdControl . Si le AdControl réside dans un élément parent, le parent doit être actif et 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>

Vérifiez que le AdControl n’est pas invisible dans la zone de visualisation. Le AdControl doit être visible pour que les publicités s’affichent correctement.
Les valeurs actives pour ApplicationId et AdUnitId ne doivent pas être testées dans l’émulateur. Pour vous assurer que le AdControl fonctionne comme prévu, utilisez les valeurs de test pour l'ApplicationId et le AdUnitId.

La boîte noire clignote et disparaît

Vérifiez toutes les étapes de la section précédente AdControl qui n’apparaît pas.

Gérez l’événement onErrorOccurred et utilisez le message transmis au gestionnaire d’événements pour déterminer si une erreur s’est produite et quel type d’erreur a été levée. Vous trouverez plus d'informations dans Gestion des erreurs dans le guide 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>

L’erreur la plus courante qui provoque une boîte noire est « Aucune publicité disponible ». Cette erreur signifie qu'aucune publicité n'est disponible à renvoyer suite à la demande.

Le AdControl se comporte normalement. Par défaut, le AdControl s’effondre lorsqu’il ne peut pas afficher une publicité. Si d’autres éléments sont des enfants du même parent, ils peuvent se déplacer pour combler l’écart laissé par le AdControl effondré et s’étendre lors de la prochaine requête.

Publicités non actualisées

Vérifiez la propriété isAutoRefreshEnabled. Par défaut, cette propriété facultative est définie sur true. Lorsque la valeur est false, la méthode de rafraîchissement doit être utilisée pour récupérer une autre annonce.

<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>

Vérifiez les appels à la méthode d'actualisation . Lors de l’utilisation de l’actualisation automatique, actualisation ne peut pas être utilisée pour récupérer une autre annonce. Lorsque vous utilisez l'actualisation manuelle, rafraîchissement doit être appelé uniquement après un minimum de 30 à 60 secondes selon la connexion de données actuelle de l'appareil.

Cet exemple démontre comment utiliser la méthode d'actualisation . Le code HTML suivant montre un exemple de la manière d'instancier le AdControl avec isAutoRefreshEnabled défini à 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>
```
Cet exemple montre comment utiliser la fonction d’actualisation .
```
args.setPromise(WinJS.UI.processAll()
    .then(function (args) {
        window.setInterval(function()
        {
            document.getElementById("myAd").winControl.refresh();
        }, 60000)
    })
);
```
Le AdControl se comporte normalement. Parfois, la même publicité apparaît plusieurs fois de suite, donnant l'impression que les publicités ne sont pas rafraîchies.

JavaScript

AdControl n’apparaît pas

Vérifiez que la fonctionnalité Internet (Client) est sélectionnée dans Package.appxmanifest.

Vérifiez que le AdControl est instancié. Si le AdControl n’est pas instancié. elle ne sera pas disponible.

Les extraits de code suivants montrent un exemple d’instanciation du AdControl. Ce code HTML montre un exemple de configuration de l’interface utilisateur pour le 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>

Le code JavaScript suivant montre un exemple d’instanciation du 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 {
            ...
        }
    }
}

Vérifiez l’élément parent. Le div parent <> doit être correctement affecté, actif et visible.

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

Vérifiez l’ID d’application et l’ID d’unité publicitaire. Ces ID doivent correspondre à l’ID d’application et à l’ID d’unité publicitaire que vous avez obtenus dans l’Espace partenaires. Pour plus d’informations, consultez Configurer des unités publicitaires dans votre application.
```
var myAdControl = new MicrosoftNSJS.Advertising.AdControl(adDiv, {
    applicationId: "{ApplicationID}",
    adUnitId: "{AdUnitID}"
});  
```
Vérifiez l’élément parent de l'AdControl. Le parent doit être actif et visible.
Les valeurs actives pour ApplicationId et AdUnitId ne doivent pas être testées dans l’émulateur. Pour vous assurer que le AdControl fonctionne comme prévu, utilisez les valeurs de test pour l'ApplicationId et le AdUnitId.

La boîte noire clignote et disparaît

Vérifiez toutes les étapes de la AdControl qui n’apparaissent pas section.
Gérez l’événement onErrorOccurred et utilisez le message transmis au gestionnaire d’événements pour déterminer si une erreur s’est produite et quel type d’erreur a été levée. Vous trouverez plus d'informations dans Gestion des erreurs dans le guide JavaScript.

Cet exemple montre comment implémenter un gestionnaire d’erreurs qui signale des messages d’erreur. Cet extrait de code HTML fournit un exemple de configuration de l’interface utilisateur pour afficher les messages d’erreur.
```
<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>
```
Cet exemple démontre comment instancier le AdControl. Cette fonction est insérée dans le fichier app.onactivated.
```
var myAdControl = new MicrosoftNSJS.Advertising.AdControl(adDiv,
{
    applicationId: "{ApplicationID}",
    adUnitId: "{AdUnitID}"
});                
myAdControl.onErrorOccurred = myAdError;
```
Cet exemple montre comment signaler des erreurs. Cette fonction est insérée sous la fonction en cours d’exécution dans le fichier 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;
    }
);
```
L’erreur la plus courante qui provoque une boîte noire est « Aucune publicité disponible ». Cette erreur signifie qu'aucune publicité n'est disponible à renvoyer suite à la demande.
Le AdControl se comporte normalement. Parfois, la même publicité apparaît plusieurs fois de suite, donnant l'impression que les publicités ne sont pas rafraîchies.

Publicités non actualisées

Vérifiez si la propriété IsAutoRefreshEnabled de votre AdControl a la valeur false. Par défaut, cette propriété facultative est définie sur true. Lorsqu’elle est définie sur false, la méthode Refresh doit être utilisée pour récupérer une autre publicité.

Vérifiez les appels à la méthode Refresh. Lorsque vous utilisez l’actualisation automatique (IsAutoRefreshEnabled est true), Actualiser ne peut pas être utilisé pour récupérer une autre publicité. Lors de l’utilisation de l’actualisation manuelle (IsAutoRefreshEnabled est false), Actualiser doit être appelée uniquement après un délai d'au moins 30 à 60 secondes en fonction de la connexion de données actuelle de l’appareil.

Cet exemple montre comment créer le div pour le 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>

Cet exemple montre comment utiliser la fonction Actualiser

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)
    })
);

Le AdControl se comporte normalement. Parfois, la même publicité apparaît plusieurs fois de suite, donnant l'impression que les publicités ne sont pas rafraîchies.

Partager via

Guide de résolution des problèmes HTML et JavaScript

HTML

AdControl n’apparaît pas

La boîte noire clignote et disparaît

Publicités non actualisées

JavaScript

AdControl n’apparaît pas

La boîte noire clignote et disparaît

Publicités non actualisées

Commentaires

Ressources supplémentaires