Condividi tramite


Guida alla risoluzione dei problemi relativi a HTML e JavaScript

Avviso

A partire dal 1° giugno 2020, la piattaforma Microsoft Ad Monetization per le app Windows UWP verrà arrestata. Ulteriori informazioni

Questo argomento contiene soluzioni ai problemi di sviluppo comuni relativi alle librerie Microsoft Advertising nelle app JavaScript/HTML.

HTML

AdControl non viene visualizzato

  1. Verificare che la funzionalità Internet (Client) sia selezionata in Package.appxmanifest.

  2. Verificare che il riferimento a JavaScript sia presente. Senza il riferimento ad.js reference nella sezione <head> (dopo il riferimento default.js), AdControl non può essere visualizzato e durante la compilazione si verifica un errore.

    <head>
        ...
        <script src="//Microsoft.Advertising.JavaScript/ad.js"></script>
        ...
    </head>
    
  3. Controllare l'ID applicazione e l'ID unità annunci. Questi ID devono corrispondere all'ID applicazione e all'ID unità annunci ottenuti nel Centro per i partner. Per ulteriori informazioni, vedere Impostare le unità pubblicitarie nell'app.

    <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>
    
  4. Verificare le proprietà height e width. Questi elementi devono essere impostati su una delle dimensioni degli annunci supportate per i banner pubblicitari.

    <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>
    
  5. Controllare il posizionamento dell'elemento. AdControl deve trovarsi all'interno dell'area visualizzabile.

  6. Controllare la proprietà visibility. Questa proprietà non deve essere impostata come compressa o nascosta. Questa proprietà può essere impostata inline (come illustrato di seguito) o in un foglio di stile esterno.

    <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>
    
  7. Controllare la proprietà position. La proprietà position deve essere impostata su un valore appropriato in base alle altre proprietà dell'elemento (ad esempio, i margini nell'elemento padre e z index). Questa proprietà può essere impostata inline (come illustrato di seguito) o in un foglio di stile esterno.

    <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>
    
  8. Controllare la proprietà z-index. La proprietà z-index deve essere impostata a un'altezza sufficiente affinché AdControl sia sempre visualizzato sopra gli altri elementi. Questa proprietà può essere impostata inline (come illustrato di seguito) o in un foglio di stile esterno.

    <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>
    
  9. Controllare i fogli di stile esterni. Se le proprietà dell'elemento AdControl sono impostate tramite un foglio di stile esterno, assicurarsi che tutte le proprietà sopraindicate siano impostate correttamente.

    <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>
    
  10. Controllare l'elemento padre di AdControl. Se AdControl si trova in un elemento padre, l'elemento padre deve essere attivo e visibile.

    <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>
    
  11. Verificare che AdControl non sia nascosto dal riquadro di visualizzazione. Per la corretta visualizzazione degli annunci, è necessario che AdControl sia visibile.

  12. I valori live per ApplicationId e AdUnitId non devono essere testati nell'emulatore. Per assicurarsi che AdControl funzioni come previsto, usare i valori di test per ApplicationId e AdUnitId.

  1. Verificare attentamente tutti i passaggi riportati nella sezione AdControl non viene visualizzato precedente.

  2. Gestire l'evento onErrorOccurred e usare il messaggio passato al gestore eventi per determinare se si è verificato un errore e quale tipo di errore è stato generato. Ulteriori dettagli sono disponibili nella Procedura dettagliata di gestione degli errori in 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'errore più comune che causa un riquadro nero è "Nessun annuncio disponibile". Questo errore indica che non è disponibile alcun annuncio da restituire dalla richiesta.

  3. AdControl si comporta normalmente. Per impostazione predefinita, AdControl si comprimerà quando non può visualizzare un annuncio. Se altri elementi sono elementi figlio dello stesso elemento padre, potrebbero spostarsi per riempire lo spazio dell'oggetto AdControl ed espandersi quando viene effettuata la richiesta successiva.

Gli annunci non si aggiornano

  1. Controllare la proprietà isAutoRefreshEnabled. Per impostazione predefinita, questa proprietà è impostata su true. Se è impostata su false, è necessario usare il metodo refresh per recuperare un altro annuncio.

    <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>
    
  2. Controllare le chiamate al metodo refresh. Quando si usa l'aggiornamento automatico, non è possibile usare refresh per recuperare un altro annuncio. Quando si usa l'aggiornamento manuale, refresh deve essere chiamato solo dopo almeno 30-60 secondi a seconda della connessione dati corrente del dispositivo.

    Questo esempio illustra come usare il metodo refresh. Il codice HTML seguente mostra un esempio di come creare un'istanza di di AdControl con isAutoRefreshEnabled impostato su 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>
    

    Questo esempio illustra come usare la funzione refresh.

    args.setPromise(WinJS.UI.processAll()
        .then(function (args) {
            window.setInterval(function()
            {
                document.getElementById("myAd").winControl.refresh();
            }, 60000)
        })
    );
    
  3. AdControl si comporta normalmente. È possibile che lo stesso annuncio venga visualizzato più volte di seguito dando l'impressione che gli annunci non si aggiornino.

JavaScript

AdControl non viene visualizzato

  1. Verificare che la funzionalità Internet (Client) sia selezionata in Package.appxmanifest.

  2. Assicurarsi che venga creata un'istanza di AdControl. Se non viene creata un'istanza di AdControl, non sarà disponibile.

    I frammenti di codice seguenti mostrano un esempio di creazione di un'istanza di AdControl. Questo codice HTML mostra un esempio di impostazione dell'interfaccia utente per 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>
    

    Il codice JavaScript seguente mostra un esempio di creazione di un'istanza di 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 {
                ...
            }
        }
    }
    
  3. Controllare l'elemento padre. L'elemento padre <div> deve essere assegnato correttamente, attivo e visibile.

    var adDiv = document.getElementById("myAd");
    var myAdControl = new MicrosoftNSJS.Advertising.AdControl(adDiv, {
        applicationId: "{ApplicationID}",
        adUnitId: "{AdUnitID}"
    });  
    
  4. Controllare l'ID applicazione e l'ID unità annunci. Questi ID devono corrispondere all'ID applicazione e all'ID unità annunci ottenuti nel Centro per i partner. Per ulteriori informazioni, vedere Impostare le unità pubblicitarie nell'app.

    var myAdControl = new MicrosoftNSJS.Advertising.AdControl(adDiv, {
        applicationId: "{ApplicationID}",
        adUnitId: "{AdUnitID}"
    });  
    
  5. Controllare l'elemento padre di AdControl. L'elemento padre deve essere attivo e visibile.

  6. I valori live per ApplicationId e AdUnitId non devono essere testati nell'emulatore. Per assicurarsi che AdControl funzioni come previsto, usare i valori di test per ApplicationId e AdUnitId.

  1. Verificare attentamente tutti i passaggi riportati nella sezione AdControl non viene visualizzato.

  2. Gestire l'evento onErrorOccurred e usare il messaggio passato al gestore eventi per determinare se si è verificato un errore e quale tipo di errore è stato generato. Ulteriori dettagli sono disponibili nella Procedura dettagliata di gestione degli errori in JavaScript.

    Questo esempio illustra come implementare un gestore errori che segnala i messaggi di errore. Questo frammento di codice HTML fornisce un esempio di come impostare l'interfaccia utente per visualizzare i messaggi di errore.

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

    Questo esempio illustra come creare un'istanza di AdControl. Questa funzione verrà inserita nel file app.onactivated.

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

    Questo esempio illustra come segnalare gli errori. Questa funzione verrà inserita sotto la funzione di esecuzione automatica nel file 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'errore più comune che causa un riquadro nero è "Nessun annuncio disponibile". Questo errore indica che non è disponibile alcun annuncio da restituire dalla richiesta.

  3. AdControl si comporta normalmente. È possibile che lo stesso annuncio venga visualizzato più volte di seguito dando l'impressione che gli annunci non si aggiornino.

Gli annunci non si aggiornano

  1. Controllare se la proprietà IsAutoRefreshEnabled di AdControl è impostata su false. Per impostazione predefinita, questa proprietà è impostata su true. Se è impostata su false, è necessario usare il metodo Refresh per recuperare un altro annuncio.

  2. Controllare le chiamate al metodo Refresh. Quando di usa l'aggiornamento automatico (IsAutoRefreshEnabled è true), non è possibile usare Refresh per recuperare un altro annuncio. Quando si usa l'aggiornamento manuale (IsAutoRefreshEnabled è false), Refresh deve essere chiamato solo dopo almeno 30-60 secondi a seconda della connessione dati corrente del dispositivo.

    Questo esempio illustra come creare div per 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>
    

    Questo esempio illustra come usare la funzione 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)
        })
    );
    
  3. AdControl si comporta normalmente. È possibile che lo stesso annuncio venga visualizzato più volte di seguito dando l'impressione che gli annunci non si aggiornino.