I have generated the m3u8 file (index.m3u8) from a video and I want to play it on HTML. Basically, I have a golang server which will send the index.m3u8 to the video tag in html5 to play it when http://127.0.0.1:8200/play is called.
my golang file :
package main
import(
"fmt"
"net/http"
"html/template"
)
func serveHandler(w http.ResponseWriter, r *http.Request){
tmpl := template.Must(template.ParseFiles("index.html"))
tmpl.Execute(w, "videosource/index.m3u8")
}
func main(){
fmt.Println("begin listening to port 8200")
server := http.Server{
Addr: "127.0.0.1:8200",
}
http.HandleFunc("/play",serveHandler)
server.ListenAndServe()
}
this is my html file:
<html>
<body>
<script src="https://cdn.jsdelivr.net/npm/hls.js@canary"></script>
<video id="video" controls autoplay></video>
<script>
if(Hls.isSupported())
{
var video = document.getElementById('video');
var hls = new Hls();
hls.loadSource('{{.}}');
hls.attachMedia(video);
hls.on(Hls.Events.MANIFEST_PARSED,function()
{
video.play();
});
}
else if (video.canPlayType('application/vnd.apple.mpegurl'))
{
video.src = '{{.}}';
video.addEventListener('canplay',function()
{
video.play();
});
}
</script>
the error i get in console when i go to the url (http://127.0.0.1:8200/play) is
videosource/index.m3u8:1 Failed to load resource: the server responded with a status of 404 (Not Found)
To check that the error is not caused by path error, I tried to replace the '{{.}}'
in HTML with the full path ('videosource/index.m3u8') and it works perfectly.
Please guide me and show me what's wrong with my code.
Thank you.