About the analysis that the video tag in HTML5 cannot play the video using an absolute path in webstorm

             In the new features of HTML 5 , there is a very 6 <video> tag, the function of this tag is to make multimedia files easy to play in web pages.

         HTML sample:

    < video src= "Kung Fu Yoga.mp4" controls width= "300" height= "300" > Your browser does not support this video! </ video >    only needs a video tag and very little code in html to play the specified video file on the web page.

         However, in actual operation, I encountered the problem that the video cannot be played when the browser is opened in webstorm.

The code first uses absolute paths:


Using an absolute URL, the effect in Google is:

The effect in Firefox is:

But I can play normally by finding the location of this file and clicking directly into the browser : . Effect picture:

Then I wanted to change it to a relative path in webstorm and try it. I put this video file in the root directory of my code and use the relative path to play it normally from webstorm . If I put it in the root directory, I still use the URL of the absolute path, but the video cannot be played like the above picture . This puzzled me as a beginner at the front end, and I finally figured out the problem after I asked the teacher.

Parse:

1. Find the file and open it directly to play.

The path to open the browser is file:///D:/webstorm/%E7%BB%83%E4%B9%A0/day_01/%E8%A7%86%E9%A2%91.html, this is because html According to the file protocol, there is no need to upload the server, just need to find the local file layer by layer to play.

2. Files cannot be played through absolute paths in webstorm .

The path to open the browser is http://localhost:63342/webstorm/%E7%BB%83%E4%B9%A0/day_01/%E8%A7%86%E9%A2%91.html?_ijt=89ip3d0ub9ma00b6sfih75n6ur, This is html based on the http protocol. First upload the files in the webstorm folder to the server, and then look for the video file in the server, but at this time the video file is in the d drive, so it cannot be found in the server, so the display cannot be played.

3. Put the file in the root directory and use the absolute pathto still not be able to play the file in webstorm.

Putting the video in the root directory and still using the absolute path still cannot be played because webstorm uploads the file to the server, but the upper-level path of webstorm cannot be accessed. Although the file has been uploaded to the server, the d drive of the local computer cannot be found in the server according to the path. So it can't be played.

Therefore, we will use the video tag to play multimedia files in webstorm in the future. It is best to put the multimedia files in the root directory of the code, and use a relative path, so there will be no errors.







      

Guess you like

Origin http://43.154.161.224:23101/article/api/json?id=324519099&siteId=291194637