这篇是在上一篇的基础上写的,这篇负责抖音作者详情页的视频转声音提取,这篇需要用到后端。
本地启动后端后,在控制台输入对应代码,即可实现hover在封面上,按d一键下载音频
- 控制台代码
// 获取作者的视频列表
var liElements = document.querySelectorAll('ul[data-e2e="scroll-list"] li');
// 添加鼠标悬停事件监听器
liElements.forEach(function(li) {
li.addEventListener('mouseenter', function() {
// 添加键盘按下事件监听器
document.addEventListener('keydown', keydownHandler);
});
li.addEventListener('mouseleave', function() {
// 移除键盘按下事件监听器
document.removeEventListener('keydown', keydownHandler);
});
});
// 处理键盘按下事件
function keydownHandler(event) {
// 判断按下的键是否为 'D' 键,keyCode为 '68'
if (event.keyCode === 68) {
// 获取下载链接
var sourceTag = document.querySelector('.basePlayerContainer xg-video-container > video > source:nth-child(1)');
const alt = document.querySelector('.basePlayerContainer').previousElementSibling.querySelector('img').getAttribute('alt');
// 找到第一个冒号并截取之后的部分
let contentAfterColon = alt.includes(':') ?
alt.split(':').slice(1).join(':'):
alt;
// 去除所有的.和空格
let resultString = contentAfterColon.replace(/[.\s]/g, '');
// 如果最终结果为空,替换为'空'
const name = resultString === '' ? '空' : resultString;
// 提取src属性值
var url = sourceTag.getAttribute('src');
// 执行下载操作,这里使用一个假设的下载函数
downloadFile(url, name);
}
}
function downloadFile(url, name) {
// 发送POST请求到后台接口
fetch('http://localhost:3000/convert', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},