我正在开发视频流使用剑道ui媒体播放器在HTML5。
对于后端,我使用javaspring框架、jpa和hibernate。首先,后端服务将发送一个web服务url列表(数组)来获取每个视频。之后,屏幕(网页)将显示视频播放列表,视频将根据用户点击的视频进行播放。
当用户单击播放列表中的视频时,屏幕将分配一个服务url以获取视频作为剑道ui媒体播放器的源。服务输出的内容类型是application/octet stream。下面的代码是在播放列表中的视频之间切换的javascript代码。
服务url示例:http://10.25.88.36:800/ns/listen/d03042020lnb000901\u ekyc01\u 20200304100308\u客户webm)
function toggleActiveVideo(dataItem) {
var mediaPlayer = $("#mediaplayer").data("kendoMediaPlayer");
// Data item is Web Service URL to get the video data as application/octet-stream
// Data item have structure like { title: "[File Name]" , poster: "/images/video.jpg" , source: "[Web Service to get Video Data]" }
mediaPlayer.media(dataItem);
$("li.k-state-selected").removeClass("k-state-selected");
$("li.k-state-default").eq(currentIndex).addClass("k-state-selected");
}
服务的响应头如下图所示。
服务中的java代码如下所示:
@RequestMapping(value="/ns/listen/{fileNm:.+}")
public StreamingResponseBody listenVoice( @PathVariable(value="fileNm") String fileNm, HttpServletRequest req, HttpServletResponse response ) throws Exception {
logger.debug("#### /ns/listenVoice [{}] start ####", fileNm);
if (StringUtil.isBlank( fileNm ))
{
throw new InoanException("999999999", "Not Input File Name");
}
File rtnFile = null;
if(StringUtil.endsWith(fileNm, ".mp4") || StringUtil.endsWith(fileNm, ".webm"))
{
rtnFile = cnccUtil.getVideoFile(fileNm);
if( rtnFile == null )
{
rtnFile = cnccUtil.getEkycVideoFile(fileNm);
}
//response.setContentType( "video/mp4" );
response.setContentType( MediaType.APPLICATION_OCTET_STREAM_VALUE );
response.setHeader("Content-Disposition", "attachment; filename="+fileNm);
}
else if( StringUtil.endsWith(fileNm, ".mp3") || StringUtil.endsWith(fileNm, ".wav") )
{
rtnFile = cnccUtil.getVoiceFile(fileNm);
//response.setContentType( "audio/mpeg3" );
}
//InputStream in = FileUtils.openInputStream(rtnFile);
final InputStream is = new FileInputStream(rtnFile);
return os -> {
readAndWrite(is, os);
};
}
private void readAndWrite(final InputStream is, OutputStream os) throws IOException {
byte[] data = new byte[2048];
int read = 0;
while ((read = is.read(data)) > 0) {
os.write(data, 0, read);
}
os.flush();
}
可以播放视频流,但不能前后移动视频时间。
我应该更改响应标头中的内容配置或内容类型吗?或者有另一种方法来做视频流使用剑道用户界面?
注:视频mime为video/webm;codecs=“vp8,opus”
暂无答案!
目前还没有任何答案,快来回答吧!