MPEG 4 video cannot display in html

Question

I think it is not a duplicate of previous problem.

The background is i am doing web development. I used opencv to gnerate video and put the video on website.

Before i try it can it worked. But recently the video suddenly cannot be display in browser

Opencv code

video = cv2.VideoCapture("./this.mp4")     
ret, frame = video.read()
fps, w, h = 30, frame.shape[1], frame.shape[0]                     
result = cv2.VideoWriter('this.mp4',cv2.VideoWriter_fourcc(*'mp4v'),fps, (w,h))
        
while(True):
    ret, frame = video.read()
    if ret == True:
        fps, w, h = 30, frame.shape[1], frame.shape[0]                     
        result = cv2.VideoWriter('this.mp4',cv2.VideoWriter_fourcc(*'mp4v'),fps, (w,h))
 
        result.write(frame)
        if cv2.waitKey(1) & 0xFF == ord('s'):
            break

    # Break the loop
    else:
        break



print("The video was successfully saved")

Html code:

<video controls>
  <source src="this.mp4" type="video/mp4">
  Your browser does not support the video tag.
</video>

It is not the path problem i have checked it. I place the orginal file and the generated file in the smae folder and display them, only the generated video fails to be displayed.

Does it the html standard change recently? Or the encoding problem. but i think both of them are not true since i have tested it sucessully 1 month ago

Answer 1

One option is to rencode the mp4 file you got using ffmpeg

I'd recommend using webm container compactable with html. Change below line and let me know if it's works.

result = cv2.VideoWriter('file.webm',cv2.VideoWriter_fourcc(*'vp80'),fps, (w,h))

in html

<video controls>
  <source src="file.webm" type="video/webm">
  Your browser does not support the video tag.
</video>