Python如何实现本地音乐播放并在Web页面展示

pip install playsound

from playsound import playsound

# 替换为实际绝对或相对路径
audio_file = "path/to/your/audio.mp3"
playsound(audio_file)

pip install Flask

from flask import Flask, render_template, jsonify, request
import os

app = Flask(__name__)

# 记录可用的音频文件名（去扩展名），便于后续搜索
MUSIC_DIR = os.path.join(app.root_path, 'static', 'music')
os.makedirs(MUSIC_DIR, exist_ok=True)
music_files = {
    os.path.splitext(f)[0]: f 
    for f in os.listdir(MUSIC_DIR) 
    if f.lower().endswith(('.mp3', '.wav', '.ogg'))
}

@app.route('/')
def index():
    return render_template('index.html')

@app.route('/search_song', methods=['POST'])
def search_song():
    data = request.get_json()
    query = (data or {}).get('query', '').strip()
    # 模糊匹配歌曲名或歌词关键字
    found = next((k for k in music_files.keys() if query.lower() in k.lower()), None)
    if found:
        return jsonify({'status': 'success', 'song': found})
    return jsonify({'status': 'not_found', 'message': '未找到匹配曲目'})

if __name__ == '__main__':
    app.run(debug=True, port=5000)

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>本地音乐播放器</title>
</head>
<body>
    <h1>Web音频播放面板</h1>
    <button id="btnPlay">点击播放示例音频</button>
    <audio id="player" controls style="width:100%; margin-top:20px;">
        您的浏览器不支持 audio 元素。
    </audio>
    
    <script>
        const player = document.getElementById('player');
        // 初始化播放第一个可用曲目
        window.addEventListener('DOMContentLoaded', () => {
            const keys = Object.keys({% for k in music_files %}'{{ k }}',{% endfor %});
            if(keys.length > 0) {
                player.src = "{{ url_for('static', filename='music/' + keys[0] + '.mp3') }}";
            }
        });
    </script>
</body>
</html>

const SpeechRecognition = window.SpeechRecognition || window.webkitSpeechRecognition;
if (!SpeechRecognition) {
    alert('当前浏览器不支持语音识别，请使用 Chrome 或 Edge。');
} else {
    const recognition = new SpeechRecognition();
    recognition.lang = 'zh-CN';
    recognition.continuous = false;
    recognition.interimResults = false;

    async function handleVoiceInput() {
        try {
            await recognition.start();
        } catch(e) {
            console.warn('麦克风权限被拒绝或已被占用', e);
        }
    }

    recognition.onresult = async (event) => {
        const transcript = event.results[0][0].transcript.trim();
        console.log('识别文本:', transcript);
        
        // 将语音文本发送至后端查询匹配曲目
        const res = await fetch('/search_song', {
            method: 'POST',
            headers: {'Content-Type': 'application/json'},
            body: JSON.stringify({query: transcript})
        });
        const result = await res.json();
        
        if(result.status === 'success' && result.song) {
            const safeName = encodeURIComponent(result.song);
            player.src = `/static/music/${safeName}.mp3`;
            player.play();
        } else {
            alert('未找到匹配歌曲，请更换名称重试。');
        }
    };

    recognition.onerror = (e) => console.error('识别出错:', e.error);
    
    // 绑定到按钮（页面内添加 语音点歌）
    document.getElementById('voiceBtn').addEventListener('click', handleVoiceInput);
}