我在一个有很多视频的网站上工作。
为了使用它们,我创建了一个单独的页面,可以嵌入到我的网站上,但创建太多的页面似乎太难了。所以我想要这样一个带有jw播放器视频的页面,我可以使用url参数(如(来定义视频的来源?url=使用javascript或jquery。
我的意思是,我可以使用的最后一个url应该像下面这样https://example.com/pages/embed.html?url=https://www.w3schools.com/html/mov_bbb.mp4
我的页面代码是:
<!DOCTYPE html>
<html>
<head>
<title>My Site</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
<link rel="stylesheet" href="/css/style.css">
</head>
<body>
<!-- JW Player -->
<script src='/jwplayer.js' type='text/javascript'></script>
<div id="myVideo"></div>
<script>
// Setup the player
const player = jwplayer('myVideo').setup({
file: '[video-source]',
type: "mp4",
mute: 'false',
autostart: 'false',
nextupoffset: '-10',
repeat: 'false',
playbackRateControls: 'false',
controls: 'true',
streching: 'uniform',
preload: 'metadata',
width: '100%',
height: '100%',
abouttext: 'My Site',
aboutlink: 'https://example.com/',
});
jwplayer().addButton(
"https://freepikpsd.com/media/2019/11/download-icon-png-white-8-Transparent-Images.gif",
"Download Video",
function() {
window.location.href = 'https://example.com';
},
"download"
);
</script>
</body>
</html>
还有一件事,如果可以的话,文件的url可以像下面这样以64为基础编码吗。https://example.com/pages/embed.html?url=aHR0cHM6Ly93d3cudzNzY2hvb2xzLmNvbS9odG1sL21vdl9iYmIubXA0
如果有什么不对劲,请随时纠正我。
您可以使用location.search
和get('value')
方法找到您的URL参数值,如下所示:
const qString = window.location.search;
const urlParams = new URLSearchParams(qString);
const URL = urlParams.get('url');
console.log(URL); // For test
在传递URL之前,可以使用参数URL的base64转换。Javascript有内置的函数来实现这一点。
console.log(btoa("https://www.w3schools.com/html/mov_bbb.mp4")); //Return aHR0cHM6Ly93d3cudzNzY2hvb2xzLmNvbS9odG1sL21vdl9iYmIubXA0
//and to get orginal form :
console.log(atob("aHR0cHM6Ly93d3cudzNzY2hvb2xzLmNvbS9odG1sL21vdl9iYmIubXA0"))
示例:
//const qString = window.location.search; // Get your URL. I comment this line and give static value for test with base64 param
const urlparaam = btoa("https://www.w3schools.com/html/mov_bbb.mp4");
const qString = "https://stackoverflow.com?url=" + urlparaam; // Create URL with query string.
//Get your URL
const getParam = new URLSearchParams(qString);
const dparam = (getParam.get('url'));
// Now create your url for player
const playerURL = "https://stackoverflow.com?url=" + atob("aHR0cHM6Ly93d3cudzNzY2hvb2xzLmNvbS9odG1sL21vdl9iYmIubXA0")
console.log(playerURL); // your url for player