Librosaで分析した音声ファイルの音響信号をJSON形式で表示したい

Question

実現したいこと

Pythonの音声分析ライブラリLibrosaを用いて分析した音響信号データをJSON形式でまとめて返すWebアプリケーションを作りたいです

発生している問題・分からないこと

データをjson形式に変換する過程でエラーが発生してしまいます

エラーメッセージ

Traceback (most recent call last):
  File "/**/anaconda3/envs/flask_env/lib/python3.10/site-packages/flask/app.py", line 2190, in wsgi_app
    response = self.full_dispatch_request()
  File "/**/anaconda3/envs/flask_env/lib/python3.10/site-packages/flask/app.py", line 1486, in full_dispatch_request
    rv = self.handle_user_exception(e)
  File "/**/anaconda3/envs/flask_env/lib/python3.10/site-packages/flask/app.py", line 1484, in full_dispatch_request
    rv = self.dispatch_request()
  File "/**/anaconda3/envs/flask_env/lib/python3.10/site-packages/flask/app.py", line 1469, in dispatch_request
    return self.ensure_sync(self.view_functions[rule.endpoint])(**view_args)
  File "/**/test.py", line 76, in top
    return render_template("view_test.html", sign=sign)
  File "/**/anaconda3/envs/flask_env/lib/python3.10/site-packages/flask/templating.py", line 151, in render_template
    return _render(app, template, context)
  File "/**/anaconda3/envs/flask_env/lib/python3.10/site-packages/flask/templating.py", line 132, in _render
    rv = template.render(context)
  File "/**/anaconda3/envs/flask_env/lib/python3.10/site-packages/jinja2/environment.py", line 1301, in render
    self.environment.handle_exception()
  File "/**/anaconda3/envs/flask_env/lib/python3.10/site-packages/jinja2/environment.py", line 936, in handle_exception
    raise rewrite_traceback_stack(source=source)
  File "/**/flask_workspace/卒研/templates/view_test.html", line 1, in top-level template code
    {% extends "base.html" %}
  File "/**/flask_workspace/卒研/templates/base.html", line 10, in top-level template code
    {% block content %} 内容 {% endblock %}
  File "/**/flask_workspace/卒研/templates/view_test.html", line 9, in block 'content'
    {{content|tojson|safe}}
  File "/**/anaconda3/envs/flask_env/lib/python3.10/site-packages/jinja2/filters.py", line 1688, in do_tojson
    return htmlsafe_json_dumps(value, dumps=dumps, **kwargs)
  File "/**/anaconda3/envs/flask_env/lib/python3.10/site-packages/jinja2/utils.py", line 658, in htmlsafe_json_dumps
    dumps(obj, **kwargs)
  File "/**/anaconda3/envs/flask_env/lib/python3.10/site-packages/flask/json/provider.py", line 180, in dumps
    return json.dumps(obj, **kwargs)
  File "/**/anaconda3/envs/flask_env/lib/python3.10/json/__init__.py", line 238, in dumps
    **kw).encode(obj)
  File "/**/anaconda3/envs/flask_env/lib/python3.10/json/encoder.py", line 199, in encode
    chunks = self.iterencode(o, _one_shot=True)
  File "/**/anaconda3/envs/flask_env/lib/python3.10/json/encoder.py", line 257, in iterencode
    return _iterencode(o, 0)
  File "/**/anaconda3/envs/flask_env/lib/python3.10/site-packages/flask/json/provider.py", line 120, in _default
    raise TypeError(f"Object of type {type(o).__name__} is not JSON serializable")
TypeError: Object of type Undefined is not JSON serializable

該当のソースコード

from flask import Flask
from flask_wtf import FlaskForm
from wtforms.fields import FileField, SubmitField
from flask_wtf.file import FileRequired, FileAllowed
from flask import Flask, render_template, request
#from flask_migrate import Migrate
from audio import convert_to_wav, load_audio
from werkzeug.utils import secure_filename
import librosa
import numpy as np
import json

ALLOWED_EXTENSIONS = {"mp3", "wav", "flac", "ogg", "aac", "m4a"}

class InputForm(FlaskForm):
    file = FileField("音楽ファイル(wav,mp3など)", validators=[
        FileRequired(), 
        FileAllowed(ALLOWED_EXTENSIONS, "対応していないファイル形式です．対応形式: "+",".join(ALLOWED_EXTENSIONS))
    ])
    submit = SubmitField("生成")

app=Flask(__name__)

import os
upload_folder = "./uploads"
if not os.path.exists(upload_folder):
    os.makedirs(upload_folder)
app.config["UPLOAD_FOLDER"] = "./uploads"
app.config["SECRET_KEY"]=os.urandom(24)

@app.route("/",methods=["GET","POST"])
def top():
    form=InputForm()
    
    if request.method == "POST":
        #音楽ファイル入力
        file = form.file.data
        filename = secure_filename(file.filename)
        input_file_path = os.path.join(app.config["UPLOAD_FOLDER"], filename)
        file.save(input_file_path)
        
        # output_wav_path = os.path.join(app.config["UPLOAD_FOLDER"], "converted.wav")
        # wav_file = convert_to_wav(input_file_path, output_wav_path)
        
        # audio_data, sample_rate = load_audio(wav_file)
        audio_data, sample_rate = load_audio(input_file_path)

        if os.path.exists(input_file_path):
            os.remove(input_file_path)
        # if os.path.exists(output_wav_path):
        #     os.remove(output_wav_path)
        
        #BPMの計算
        tempo, beat_frames = librosa.beat.beat_track(y=audio_data, sr=sample_rate)
        beat_times = librosa.frames_to_time(beat_frames, sr=sample_rate)
        
        #周波数スペクトルの計算
        stft = librosa.stft(audio_data)
        spectrogram = np.abs(stft)
        
        #メロディやピッチ(クロマ特長量)を取得
        chroma = librosa.feature.chroma_stft(y=audio_data, sr=sample_rate)
        
        #音圧
        rms = librosa.feature.rms(y=audio_data)
        

        acoustic_sign = {
            "tempo":tempo,
            "beat_frames":beat_frames.tolist(),
            "spectrogram":spectrogram.tolist(),
            "rms":rms.tolist()
        }
        
        sign = json.dumps(acoustic_sign, indent=2)
        return render_template("view_test.html", sign=sign)
    
    return render_template("input_test.html",form=form)


if __name__=="__main__":
    app.run()

import subprocess
import librosa

def convert_to_wav(input_file_path, output_file="output.wav"):
    """
    任意の音声ファイルをWAV形式に変換する関数
    Args:
        input_file_path (str): 入力音声ファイルのパス
        output_file (str): 出力WAVファイルのパス (デフォルト: "output.wav")
    Returns:
        str: 変換後のWAVファイルのパス
    """
    try:
        # FFmpegコマンドを実行
        subprocess.run(
            ["ffmpeg", "-i", input_file_path, "-ar", "44100", "-ac", "2", output_file],
            check=True
        )
        print(f"WAV形式に変換されました: {output_file}")
        return output_file
    except subprocess.CalledProcessError as e:
        print("エラー: FFmpegによる変換に失敗しました。")
        raise e

def load_audio(file_path):
    """
    librosaで音声ファイルを読み込む関数
    Args:
        file_path (str): 音声ファイルのパス
    Returns:
        tuple: (音声データ, サンプルレート)
    """
    y, sr = librosa.load(file_path)  # オリジナルのサンプルレートを維持
    print(f"音声データが読み込まれました: {file_path}")
    return y, sr

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="utf-8" />
    <title>WTForm</title>
</head>
<body>
    {% block title %} タイトル {% endblock %}
    <hr />
    {% block content %} 内容 {% endblock %}
</body>
</html>

{% extends "base.html" %}

{% block title %}
    <h1>テスト</h1>
{% endblock %}

{% block content %}
    {% from "_formhelpers.html" import render_field %}
    <form method="POST", enctype ="multipart/form-data">
        {{ render_field(form.file) }}
        {{ form.submit() }}
    </form>
{% endblock %}

{% extends "base.html" %}

{% block title %}
    <h1>分析結果</h1>
{% endblock %}

{% block content %}
    <pre><code>
        {{content|tojson|safe}}
    </code></pre>

{% endblock %}

試したこと・調べたこと

• teratailやGoogle等で検索した
• ソースコードを自分なりに変更した
• 知人に聞いた
• その他

上記の詳細・結果

json.dumpsに渡す値の型numpyだと良くないのかと思いtolist()でリスト型に変えてみたりしましたが同じエラーが出てしまいました

補足

実行したパソコン: Macbook Air
OS: macOS Sequoia 15.2

Comments

[meg_]

> json.dumpsに渡す値の型numpyだと良くないのかと思いtolist()でリスト型に変えてみたりしましたが同じエラーが出てしまいました
エラー発生個所は「sign = json.dumps(acoustic_sign, indent=2)」なのですか？

[Kurimeshi]

TypeError: Object of type Undefined is not JSON serializable
このエラーはjson.dumpsが対応していない型をjson形式に変換しようとした際に起こるエラーのようなのでおそらくエラー発生箇所は合っていると思うのですが，エラーログを見てみると
return render_template("view_test.html", sign=sign)
の部分でエラーが出ているとなっているのでもしかしたら違うかもしれません．．．

[teamikl]

質問を詳細まで読めてなかった。
エラーコードは {{content|tojson|safe}} の方かな？
tempo が ndarray なのも別問題として残りますが。

Answer 1

見た感じですけど、tempoが ndarry のままになってます。
他のデータと合わせて

-             "tempo":tempo,
+             "tempo":tempo.tolist(),

※ librosa 0.10.2post1 で上記の変更で json化を確認

但し、ndarray の場合は Undefined とはならないかもしれないので、
tempoに期待する値が入ってない場合は別のエラーになるかもしれません。
その場合は問題を再現する wavデータの詳細が必要になります。
⇒ 他のデータ（別経路で入手もしくは作成）でも同様のエラーが起こるかどうかをテスト

デバッグの方法としては、flask とは一旦問題切り分けて、
ローカル環境で librosa 部分のみのテストを行いましょう。

print(repr(tempo))

で確認してみてください。
print(tempo)だとリストとの区別がつかない場合があります。

---

あと、オフトピだけど、WTForm の使い方。設定したvalidator が使われてません。

-    if request.method == "POST":
+    if form.validate_on_submit():

---

追記:

環境がなくて試せないけど、render_template に sign で渡してるので

-        {{content|tojson|safe}}
+        {{sign|tojson|safe}}

問題個所の検出方法は、
テンプレートエンジンの jinja2 の StrictUndefined で flask での設定方法を調べてみてください。
未定義の変数としてエラーが得られると思います。

Comments

[Kurimeshi]

値の特徴的にてっきりtempoは一次元のものだと思ってたので全く気にしてませんでした
無事解決しました
ありがとうございました