Как узнать эту информацию о файле и возможно ли это (во вложении)?

Question

[DadStreets]

Делаю аудиоплеер. Возник вопрос об отображении имя исполнителя и названии песни. Возможно ли вернуть эти данные с помощью JS?

Answer 1

[WapSter]

https://www.npmjs.com/package/music-metadata

Comments

[DadStreets]

Я правильно понимаю, что этот метод должен вернуть мне все метаданные о треке?
metadata.trackInfo

[WapSter]

DadStreets, да если правильно приготовишь) Пример

const mm = require('music-metadata');
async function parseFiles(audioFiles) {
 const metadata = await mm.parseFile(audioFile); 
 return metadata.trackInfo 
}

[DadStreets]

WapSter, Попробую. Заранее, спасибо

[DadStreets]

WapSter, Не могу понять. Это нужно где-то установить, или это встроенно в Node.js?

[DadStreets]

WapSter, Я установил папку через nmp, но консоль мне пишет, что метод require не найден. Не можешь помочь, пожалуйста? Очень прошу

[WapSter]

DadStreets, ты бы код дал, емое

[DadStreets]

WapSter, Вот полный:

const circle = document.querySelector('.progress-ring__circle');
const radius = circle.r.baseVal.value;
const circumference = Math.PI * radius;

circle.style.strokeDasharray = `${circumference} ${circumference}`;
circle.style.strokeDashoffset = circumference;
console.log(circumference);

function setOffset(percent) {
	let offset = circumference - percent / 100 * circumference;
	circle.style.strokeDashoffset = offset;
}

let songs = ["audio/song1.mp3", "audio/song2.mp3", "audio/song3.mp3"];

const fillBar = document.getElementById('fillBar'),
	  songTitle = document.getElementById('songTitle'),
	  handlePoint = document.getElementById('handle');

const pauseIcon = document.querySelector('.songStatus__pause'),
  	  playIcon  = document.querySelector('.songStatus__play');

let song = new Audio();
let currentSong = 0;

window.onload = function() {
	song.src = songs[currentSong];
	songTitle.textContent = songs[currentSong];
}

function playSong() {
	song.src = songs[currentSong];
	songTitle.textContent = songs[currentSong];
	song.play();
}

function playOrPauseButton() {
	currentVolume = song.volume;

	if (song.paused) {
		song.play();
		console.log('Yahoo!');

		let timerId = setTimeout(function tick() {
			if (currentVolume >= 1) {
				pauseIcon.classList.remove('hidden');
				playIcon.classList.add('hidden');
			} else {
				currentVolume += 0.01;
				console.log(currentVolume.toFixed(2));
				song.volume = currentVolume.toFixed(2);
				timerId = setTimeout(tick, 3);
			}
		}, 3);

	} else {
		let timerId = setTimeout(function tick() {
			if (currentVolume <= 0) {
				pauseIcon.classList.add('hidden');
				playIcon.classList.remove('hidden');
				song.pause();
				currentVolume = 1;
			} else {
				currentVolume -= 0.01;
				console.log(currentVolume.toFixed(2));
				song.volume = currentVolume.toFixed(2);
				timerId = setTimeout(tick, 3);
			}
		}, 3);
	}
}

song.addEventListener('timeupdate', function() {
	let position = song.currentTime / song.duration;
	setOffset(position * 100);
	handlePoint.style.transform = ' rotate(' + '-' + position * 180 + 'deg)' + ' translateY(50%) ';
	if (song.currentTime == song.duration) {
		playNextSong();
	}
});

song.addEventListener('volumechange', () => {

});


function playNextSong() {
	currentSong++;
	if (currentSong > songs.length - 1) {
		currentSong = 0;
	}
	playSong();
	playIcon.classList.add('hidden');
	pauseIcon.classList.remove('hidden');
}

function playPreviousSong() {
	currentSong--;
	if (currentSong < 0) {
		currentSong = songs.length - 1;
	}
	playSong();
	playIcon.classList.add('hidden');
	pauseIcon.classList.remove('hidden');
}

function audioRewind() {
	let currentRadius = (radius + 10)/100,
		audioCurrentPos = event.offsetX;

	song.currentTime = song.duration * (audioCurrentPos/circumference*currentRadius);
	console.log(audioCurrentPos/circumference*currentRadius);

	if ((audioCurrentPos/circumference*currentRadius) < 0.05) {
		song.currentTime = 0;
	}
}

const mm = require('node_modules/music-metadata');
async function parseFiles(audioFile) {
	const metadata = await mm.parseFile(audioFile); 
	return metadata.trackInfo;
}

console.log(parseFiles(song));

Вот без лишнего:

let songs = ["audio/song1.mp3", "audio/song2.mp3", "audio/song3.mp3"];

const pauseIcon = document.querySelector('.songStatus__pause'),
  	  playIcon  = document.querySelector('.songStatus__play');

let song = new Audio();
let currentSong = 0;

window.onload = function() {
	song.src = songs[currentSong];
	songTitle.textContent = songs[currentSong];
}

function playSong() {
	song.src = songs[currentSong];
	songTitle.textContent = songs[currentSong];
	song.play();
}

const mm = require('node_modules/music-metadata');
async function parseFiles(audioFile) {
	const metadata = await mm.parseFile(audioFile); 
	return metadata.trackInfo;
}

console.log(parseFiles(song));

[WapSter]

DadStreets, это плагин для ноды, в браузере ты его не запустишь.

[DadStreets]

WapSter, то есть, использовать этот код в веб-сайте не получится?

[WapSter]

DadStreets, получиться, но не напрямую. На бэк отправляешь файл обрабатывает его и отдаешь ответом распаршенные метаданные.