Home > Article > Backend Development > javascript - What should I do if the server of PHP video website is very stuck? ?
Environment:
php5.3.9
Apache 22
mysql5.6.x
windows
Several problems encountered when using the video website (local environment test):
A. Dozens of videos. Use canvas to capture the first frame of the video to make the cover.
<code> // 视频源列表 var vSrcList = [src1 , src2 , src3 ....]; // 队列方式截取视频第一帧(如果不采取队列方式截取的话,基本上所有的都会截取失败....) // 即使采取队列的方式获取视频第一帧,照样有很高的几率会导致视频第一帧截取失败 // 打开控制台network来看的话,大量的请求显示 pending... var dequeue = function(){ var curItem = vSrcList.shift(); if (curItem) { // 这边添加到节点到页面上.. dequeue(); } }; dequeue(); // 获取视频第一帧画面 function getVShowPic(src , fn , opt){ var v = document.createElement('video'); var cav = document.createElement('canvas'); var ctx = cav.getContext('2d'); v.currentTime = 1; v.addEventListener('canplay' , function(){ if (opt === undefined) { opt = { w: v.videoWidth , h: v.videoHeight }; } ctx.drawImage(this , 0 , 0 , opt['w'] , opt['h']); var src = cav.toDataURL('image/jpeg' , 1); fn(src); } , false); v.src = src; }</code>
B. Because there has been a lot of lag in the first question. As the video plays, it becomes even more exaggerated. The main video always shows loading, and all related video list covers failed to be captured
Question 1: Is PHP not suitable for video websites? ?
Question 2: What is the reason why video websites like Youku and iQiyi run so smoothly?
Question 3: Similar to Youku, are their video covers uploaded manually or are they automatically intercepted from the first frame of the video? ? , because if I simply play a video, there will be no lag. I just need to remove the code that automatically captures the first frame of the video, and there will be no lag...
By the way, share the URL: www.lysqdx.com
Environment:
php5.3.9
Apache 22
mysql5.6.x
windows
Several problems encountered when using the video website (local environment test):
A. Dozens of videos. Use canvas to capture the first frame of the video to make the cover.
<code> // 视频源列表 var vSrcList = [src1 , src2 , src3 ....]; // 队列方式截取视频第一帧(如果不采取队列方式截取的话,基本上所有的都会截取失败....) // 即使采取队列的方式获取视频第一帧,照样有很高的几率会导致视频第一帧截取失败 // 打开控制台network来看的话,大量的请求显示 pending... var dequeue = function(){ var curItem = vSrcList.shift(); if (curItem) { // 这边添加到节点到页面上.. dequeue(); } }; dequeue(); // 获取视频第一帧画面 function getVShowPic(src , fn , opt){ var v = document.createElement('video'); var cav = document.createElement('canvas'); var ctx = cav.getContext('2d'); v.currentTime = 1; v.addEventListener('canplay' , function(){ if (opt === undefined) { opt = { w: v.videoWidth , h: v.videoHeight }; } ctx.drawImage(this , 0 , 0 , opt['w'] , opt['h']); var src = cav.toDataURL('image/jpeg' , 1); fn(src); } , false); v.src = src; }</code>
B. Because there has been a lot of lag in the first question. As the video plays, it becomes even more exaggerated. The main video always shows loading, and all related video list covers failed to be captured
Question 1: Is PHP not suitable for video websites? ?
Question 2: What is the reason why video websites like Youku and iQiyi run so smoothly?
Question 3: Similar to Youku, are their video covers uploaded manually or are they automatically intercepted from the first frame of the video? ? , because if I simply play a video, there will be no lag. I just need to remove the code that automatically captures the first frame of the video, and there will be no lag...
By the way, share the URL: www.lysqdx.com
The focus of video websites is the CDN cache and bandwidth of the video, it has nothing to do with the language used
Others are using a CDN. After looking at your screenshot, it seems to be nothing more than an exercise. How can you compare it with others
After reading your description, I speculate that the cover you call is read from the video every time. It would be strange if it is not stuck. A mature video website system will have offline video processing after the video is uploaded, including but not limited to the following Jobs (in no particular order):
Standardize video formats (sometimes non-standard formats cannot buffer videos on the browser side)
Compress into multiple quality video formats (such as low, medium and high, or 240p, 360p, 480p, 720p, 1080p, etc.)
Capture certain frames as previews (you can capture n frames and then manually intervene in the background)
Add watermark (optional)
Upload to CDN
Video websites have high bandwidth requirements. Not a server configuration. Live streaming has high server requirements!
The operation of your screenshot
is run in local js
It’s weird if it doesn’t get stuck