dify - 💡(How to fix) Fix TTS audio fails to play in the browser [1 pull requests]

Self Checks

• I have read the Contributing Guide and Language Policy.
• This is only for bug report, if you would like to ask a question, please head to Discussions.
• I have searched for existing issues search for existing issues, including closed ones.
• I confirm that I am using English to submit this report, otherwise it will be closed.
• 【中文用户 & Non English User】请使用英语提交，否则会被关闭 ：）
• Please do not modify this template :) and fill in all the required fields.

Dify version

1.14.0

Cloud or Self Hosted

Self Hosted (Docker)

Steps to reproduce

Thank you again to all the authors in the open-source community.

Today I tried to configure the text-to-speech capability in ChatFlow using Tongyi’s qwen3-tts-flash model. After the conversation content was generated, I clicked the audio playback button. I checked the browser console and confirmed the API request and response were normal, but the webpage failed to play any sound, with no related logs printed in the console.

I replayed the API request using curl, saved the response output as text.mp3, and the file plays perfectly in PotPlayer.

I also tested playback by running custom code directly in the browser console, and the browser was able to play the audio correctly:

fetch('https://xxx/api/text-to-audio', {
          method: 'POST',
          headers: {
            'Content-Type': 'application/json',
            'x-app-code': 'XoqsXtObYIR7sJg1',
            'x-app-passport':'exxx',
            'x-csrf-token':'xxx'
          },
          body: JSON.stringify({
            message_id: 'bd345c81-2570-4d40-b52f-42d12c22ada1',
            streaming: true,
            voice: 'Cherry',
            text: 'Test'
          }),
        })
        .then(r => r.blob())
        .then(blob => {
          const url = URL.createObjectURL(blob);
          const audio = new Audio(url);
          audio.oncanplay = () => console.log('Can play!');
          audio.onplay = () => console.log('Playing!');
          audio.onerror = (e) => console.error('Audio error:', e);
          audio.play();
          console.log('Playing audio from blob:', url);
        })
        .catch(e => console.error('Error:', e));

At present, I can only identify this issue from an end-user perspective and am unable to conduct further in-depth troubleshooting for now.

✔️ Expected Behavior

Audio plays normally on the web page.

❌ Actual Behavior

TTS audio fails to play in the browser.