<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-language" content="ja">
<meta charset="UTF-8">
<title>音楽の再生</title>
<meta name="viewport" content="width=device-width,initial-scale=1">
</head>
<body onload ="init()">
<audio controls>
<source src="../sound/Yesterday.mp3">
<source src="../sound/Yesterday.ogg"> </audio><br>
<br>
<br>
<button onclick="ply();">先頭から再生</button>
<button onclick="pus();">一時停止</button>
<button onclick="rst();">再生</button>
<button onclick="stp();">停止</button>
<SCRIPT>
//<!--
function init() {
ad = new Audio("");
if(ad.canPlayType){
var canPlayOgg = ("" != ad.canPlayType("audio/ogg"));
var canPlayMp3 = ("" != ad.canPlayType("audio/mpeg"));
if(canPlayOgg && canPlayMp3){
window.alert("ogg/mp3をサポートしています。") ;
ad.src = "../sound/Yesterday.ogg" ;
}else if(canPlayOgg){
window.alert("oggをサポートしています。") ;
ad.src = "../sound/Yesterday.ogg" ;
}else if(canPlayMp3){
window.alert("mp3をサポートしています。") ;
ad.src = "../sound/Yesterday.mp3" ;
}else{
window.alert("oggもmp3もサポートしていません") ;
}
}else{
window.alert("canPlayTypeメソッドが存在しません") ;
}
}
function rst(){ ad.play(); } // 再生(一時停止中は一時停止箇所から再生)
function ply(){ // 先頭から再生
ad.load(); // ロードを実行して初期状態に戻す
ad.play();
}
function pus(){ad.pause();} // 一時停止
function stp(){ // 停止
if(!ad.ended){ // ended属性で終了判定する
ad.pause();
ad.currentTime = 0; // 再生位置を0秒にする
}
}
//-->
</script></body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-language" content="ja">
<meta charset="UTF-8">
<TITLE>テキスト読上げ</TITLE>
<meta name="viewport" content="width=device-width,initial-scale=1">
</head>
<body>
<input type="button" onclick="speak('おはようございます','ja-JP')" value="日本語">
<input type="button" onclick="speak('Good Morning','en-US')" value="English">
<SCRIPT>
function speak(text,lang) {
var synthes = new SpeechSynthesisUtterance();
synthes.volume = 1; //音量
synthes.rate = 1; //スピード
synthes.pitch = 0; //ピッチ
synthes.text = text;
synthes.lang = lang ; //言語
speechSynthesis.speak(synthes);
}
</script>
</body>
</html>
音声認識開始ボタンで開始します。プラウザはGoogle Chromeで動作致します。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>音声認識</title>
<meta name="viewport" content="width=device-width,initial-scale=1">
</head>
<body>
<button onclick="recognition.start();">音声認識開始</button>
<button onclick="recognition.stop();">停止</button>
<div id="resultdiv"></div>
<script>
SpeechRecognition = webkitSpeechRecognition || SpeechRecognition ;
recognition = new SpeechRecognition() ;
recognition.lang = 'ja-JP' ;
recognition.interimResults = true ;
recognition.continuous = true ;
finalTranscript = '' ; // 確定した認識結果
recognition.onresult = function (e) {
interimTranscript = '' ; // 暫定の認識結果
for (i = e.resultIndex; i < e.results.length ; i++) {
transcript = e.results[i][0].transcript ;
if (e.results[i].isFinal) {
finalTranscript += transcript + '<br>' ;
} else {
interimTranscript = transcript ;
}
}
resultdiv.innerHTML = finalTranscript + '<i style="color:#f00;">' + interimTranscript + '</i>' ;
}
</script>
</body>
</html>