Problemen met speechSynthesis

Status
Niet open voor verdere reacties.
L

luc99

Gebruiker
Lid geworden
10 nov 2015
Berichten
98
Bij een test bestandje heb ik onderstaande code. Hiermee wordt de tekst 'dit is een test ' gesproken. Dit zowel op een chrome browser op een windows computer als met safari op een Ipad.

Nu heb ik deze code willen integreren in een andere toepassing waar de browser een berichtje spreekt ipv dat dit in een popup getoond wordt.
Vreemd is dat als ik de toepassing start in de chrome browser op de windows computer dat het berichtje inderdaad gesproken wordt maar in safari op een ipad wordt dit niet gesproken.

Wat kan hier de reden voor zijn ?

Code: 
<button>dit is een test</button>

<script>
function spreek (result) {
    const say = text => speechSynthesis.speak(new SpeechSynthesisUtterance(text));
    say(result);
}

document.querySelector('button').addEventListener('click', () => {
    spreek('dit is een test');
})
</script>
 
Laatst bewerkt door een moderator:
Het probleem zit niet in de code volgens mij maar in het cache geheugen. Hoe kan ik er voor zorgen dat het cache geheugen van de site telkens gerefreshed wordt ?
 
Vanwaar die redenatie?
 
De ene keer dat ik het probeer lukt het wel en de andere keer niet.
 
Tja, het is een experimentele feature. Dus dan kan je verwachten dat het nog niet lekker werkt.
Ik zou eerder aanraden een bugmelding bij Webkit indienen, die over Safari gaat.
Je zou mogen verwachten dat het onder alle omstandigheden zou moeten werken.
 
Of een andere reden zou ook kunnen dat 2 spraakopdrachten na elkaar een probleem opleveren, zodat mogelijks het ene commando nog niet uitgevoerd is als er een tweede gesproken moet worden. Zou hier een oplossing voor bestaan ?
 
Laatst bewerkt:
Ok, bedankt. Het is wel leuk in mijn toepassing dat de gebruiker een gesproken berichtje krijgt ipv een popup melding. Het is maar een beetje Spielerei :)
 
Hieronder in een andere vorm. Zou hetzelfde resultaat geven denk ik.
Code: 
<button type="button" class="btn">Spreek</button>

<script>
function spreek (utter, tekst) {
    utter.lang = 'nl-NL';
    utter.text = tekst;
    utter.volume = 0.5;
    utter.onend = function() {
        // je kan hier iets doen na de spraak
    }
    window.speechSynthesis.speak(utter);
}

document.querySelector('.btn').addEventListener("click", function(event) {
    let utter = new SpeechSynthesisUtterance();
    spreek (utter, 'Allemaal een goedenavond');
});
</script>

Controleer bij elke speech optie even bij "welke browsers (klik)" of het werkt. Tja, het is bijna 4 jaar experimenteel, het wordt tijd dat ze er een standaard van maken.
 
Laatst bewerkt:
Bedankt, maar er blijft iets vreemds bij mij gebeuren.
Met onderstaande code wordt er een functie uitgevoerd om gegevens via submit.php te bewaren in de database.
Als het resultaat hiervan gelukt is dient de melding gesproken te worden dat het goed is aangepast.

Als ik de pagina via een Windows computer met Chrome uitvoer lukt dit. Bij een Ipad lukt dit echter niet.

Code: 
 function button_save() {
 
 	  var txtNaam = document.getElementById("txtNaam").value;
 	  var txtEdit = document.getElementById("txtEdit").value;
 	  var txtOrigineel = document.getElementById("txtOrigineel").value;

      $.ajax({
        url : 'submit.php',
        type : 'POST',
        data: jQuery.param({ field1: txtNaam, field2 : txtEdit, field3 : txtOrigineel }) ,
        contentType: 'application/x-www-form-urlencoded; charset=UTF-8',
        success : function (result) { 
         
        let utter = new SpeechSynthesisUtterance();        
        spreek (utter, txtEdit + '   is goed aangepast');
        
        window.location.href = "http://xxx.xxx.xxx.xxx/lvs_labels/index.php";
      },
        error : function () {
        console.log ('error');
      }
    });  
    
 }

Als ik de code aanpas door een extra 'hallo' te laten spreken voor de submit.php aangeroepen wordt gaat de Ipad zeggen 'hallo, xxxx is goed aangepast'.
De windows computer gaat nu enkel 'hallo' zeggen.

Code: 
function button_save() {
 
      let utter = new SpeechSynthesisUtterance();        
      spreek (utter, 'hallo');
        
 	  var txtNaam = document.getElementById("txtNaam").value;
 	  var txtEdit = document.getElementById("txtEdit").value;
 	  var txtOrigineel = document.getElementById("txtOrigineel").value;

      $.ajax({
        url : 'submit.php',
        type : 'POST',
        data: jQuery.param({ field1: txtNaam, field2 : txtEdit, field3 : txtOrigineel }) ,
        contentType: 'application/x-www-form-urlencoded; charset=UTF-8',
        success : function (result) { 
         
        let utter = new SpeechSynthesisUtterance();        
        spreek (utter, txtEdit + '   is goed aangepast');
        
        window.location.href = "http://xxx.xxx.xxx.xxx/lvs_labels/index.php";
      },
        error : function () {
        console.log ('error');
      }
    });  
    
 }
 
..... om gegevens via submit.php te bewaren in de database.
Als het resultaat hiervan gelukt is dient de melding gesproken te worden dat het goed is aangepast.
Klik om te vergroten...
De nieuwe policy in browsers is dat een webpagina geen video of audio kan afspelen tenzij de bezoeker bewust op afspelen klikt. Dit wordt gedaan omdat de advertenties hier teveel gebruik van gingen maken en op de meest ongelegen momenten uit de luidprekers knalden. Er waren zoveel klachten dat deze policy ingevoerd gaat worden. Met andere woorden, als de ajax een success melding krijgt dan kan je binnen de nieuwe policy niet automatisch een tekst / speech starten.
 
Dat is jammer, toch wel vreemd dat op de wijze zoals ik het heb aangepast met voorafgaand 'hallo' te laten zeggen dat het bij de Ipad dan toch wel lukt.
 
Hangt van de browser versie af. Bijvoorbeeld voor Chrome deze info

Update. De feature "SpeechSynthesis.speak met autoplay" is/wordt uit Javascript gehaald. Status
 
Laatst bewerkt:
Status
Niet open voor verdere reacties.
Steun Ons

Nieuwste berichten

Terug
Bovenaan Onderaan