Videos play in localhost but not official website

In localhost, the video plays perfectly.

However, after uploading all my files to CPanel and running my website, all the videos become still images, as they are not playing at all.

No related console error I guess, except for “Uncaught (in promise) DOMException”. It may actually be related, as I have five “Uncaught (in promise) DOMException”, and I have five videos in total. If so, why would the videos cause errors in promise requests, as the videos are all stored within my server?

Anyone knows how to tackle this issue? It will be super helpful.

Functions used:

Constructor:
this.gameVid;

OnLoad:
this.game.load.video(this.gameName,this.vidFile);

Create:
this.gameVid = this.game.add.video(this.gameName);
this.gameVid.volume = 0;
this.gameVid.play(true);
this.gameVid.addToWorld(x,y,1,1,0.2,0.2);
this.gameVid.loop = true;

Update #1:
I knew it… friggin COG web security blocked the autoplay functionality. Fortunately, my vids can use inputs to disable it. But then, I would still like to figure out the appropriate way to enable autoplay without ‘hardcoding’ the autoplay.

Only Chrome as of now will block auto play videos as far as I am aware of.

Chrome blocks autoplayed video with sounds, so mute them before playing. Once a video is unlocked, you can change the source and play the video without having the user to unlock the video for you again, afaik.