Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

bug: Cannot play matched samples in browser on macOS #3

Closed
YoungPhlo opened this issue Dec 24, 2024 · 5 comments · Fixed by #4
Closed

bug: Cannot play matched samples in browser on macOS #3

YoungPhlo opened this issue Dec 24, 2024 · 5 comments · Fixed by #4

Comments

@YoungPhlo
Copy link
Contributor

In the process of installing to macOS I came across an audio playback bug here: #1 (comment)

The sound wont play after matching
The play button is greyed out in the browser for all samples.

Sonnet 3.5 suggested this change to the sound-similarity-browser.py file, which works on macOS:

@app.route('/serve-audio/<path:filepath>')
def serve_audio(filepath):
    # Remove any leading slash to normalize the path
    filepath = filepath.lstrip('/')
    
    # Check if this is an absolute path (starts with Users/...)
    if filepath.startswith('Users/'):
        # Convert to absolute path by adding the root slash
        return send_file('/' + filepath)
    
    # Otherwise, treat it as relative to the application root
    return send_file(os.path.join(app.root_path, filepath))

The problem is, the original code works on Windows:

@app.route('/serve-audio/<path:filepath>')
def serve_audio(filepath):
    return send_file(filepath)

The plan is to change this code on Windows and see if it works on both.

@YoungPhlo
Copy link
Contributor Author

YoungPhlo commented Dec 24, 2024

First, confirm that the playback works in browser on Win10

chrome_eNyddPS9xN
chrome_ddS2pbRYYL

Log:

INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:26:23] "GET / HTTP/1.1" 200 -
INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:26:36] "GET /process-folder?folder_path=C:\\Dropbox\\Public\\Production\\Sliced%20beats HTTP/1.1" 200 -
INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:26:40] "GET /process-folder?folder_path=C:\\Dropbox\\Public\\Production\\Sliced%20beats HTTP/1.1" 200 -
INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:26:58] "GET /process-folder?folder_path=C:\\Dropbox\\Public\\Production\\Recorded HTTP/1.1" 200 -
C:\ML\music-classification\sample-browser\venv\lib\site-packages\transformers\models\roberta\modeling_roberta.py:370: UserWarning: 1Torch was not compiled with flash attention. (Triggered internally at C:\actions-runner\_work\pytorch\pytorch\builder\windows\pytorch\aten\src\ATen\native\transformers\cuda\sdp_utils.cpp:555.)
  attn_output = torch.nn.functional.scaled_dot_product_attention(
INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:27:25] "POST /search HTTP/1.1" 200 -
INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:27:25] "GET /serve-audio/C:\\Dropbox\\Public\\Production\\Sliced%20beats\\TBP%20-%20RamboGone%20(Vox).wav HTTP/1.1" 206 -
INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:27:25] "GET /serve-audio/C:\\Dropbox\\Public\\Production\\Sliced%20beats\\Maaly%20Laugh.wav HTTP/1.1" 206 -
INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:27:25] "GET /serve-audio/C:\\Dropbox\\Public\\Production\\Sliced%20beats\\TBP%20-%20RamboGone%20(Vox)_3.wav HTTP/1.1" 206 -
INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:27:25] "GET /serve-audio/C:\\Dropbox\\Public\\Production\\Sliced%20beats\\Pooh%20-%20Io%20E%20Te%20Per%20Altri%20Giorni%201%20-%20Loop.wav HTTP/1.1" 206 -
INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:27:25] "GET /serve-audio/C:\\Dropbox\\Public\\Production\\Sliced%20beats\\TBP%20-%20RamboGone%20(Vox)_2.wav HTTP/1.1" 206 -
INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:27:25] "GET /serve-audio/C:\\Dropbox\\Public\\Production\\Sliced%20beats\\Dev%20-%20Have%20It%20All%201.wav HTTP/1.1" 206 -
INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:27:25] "GET /serve-audio/C:\\Dropbox\\Public\\Production\\Sliced%20beats\\Lights%20-%20Until%20The%20Light%201%20-%20Loop.wav HTTP/1.1" 206 -
INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:27:26] "GET /serve-audio/C:\\Dropbox\\Public\\Production\\Sliced%20beats\\Oh%20Wonder%20-%20All%20About%20You%20-%20Loop.wav HTTP/1.1" 206 -
INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:27:26] "GET /serve-audio/C:\\Dropbox\\Public\\Production\\Sliced%20beats\\Otis%20Blackwell%20-%20Let%20The%20Daddy%20Hold%20You.wav HTTP/1.1" 206 -
INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:27:26] "GET /serve-audio/C:\\Dropbox\\Public\\Production\\Recorded\\untitled_EU%2088%20Sound.wav HTTP/1.1" 206 -
INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:27:26] "GET /serve-audio/C:\\Dropbox\\Public\\Production\\Sliced%20beats\\snair_7%20-%20Loop.wav HTTP/1.1" 206 -
INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:27:26] "GET /serve-audio/C:\\Dropbox\\Public\\Production\\Sliced%20beats\\EddieLicks_3.wav HTTP/1.1" 206 -
INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:27:26] "GET /serve-audio/C:\\Dropbox\\Public\\Production\\Recorded\\untitled_Master_3.wav HTTP/1.1" 206 -
INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:27:26] "GET /serve-audio/C:\\Dropbox\\Public\\Production\\Sliced%20beats\\Otis%20Blackwell%20-%20Let%20The%20Daddy%20Hold%20You_3.wav HTTP/1.1" 206 -
INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:27:26] "GET /serve-audio/C:\\Dropbox\\Public\\Production\\Recorded\\BuiltToLast_Master_3.wav HTTP/1.1" 206 -
INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:27:26] "GET /serve-audio/C:\\Dropbox\\Public\\Production\\Recorded\\untitled_Insert%202_5.wav HTTP/1.1" 206 -
INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:27:26] "GET /serve-audio/C:\\Dropbox\\Public\\Production\\Sliced%20beats\\EddieLicks_4.wav HTTP/1.1" 206 -
INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:27:26] "GET /serve-audio/C:\\Dropbox\\Public\\Production\\Sliced%20beats\\Bioshock%202%20Install%20Music.wav HTTP/1.1" 206 -
INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:27:26] "GET /serve-audio/C:\\Dropbox\\Public\\Production\\Recorded\\NeverOver_Xpand!2.wav HTTP/1.1" 206 -
INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:27:26] "GET /serve-audio/C:\\Dropbox\\Public\\Production\\Recorded\\untitled_Horn.wav HTTP/1.1" 206 -
INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:27:26] "GET /serve-audio/C:\\Dropbox\\Public\\Production\\Sliced%20beats\\half-sleep.wav HTTP/1.1" 206 -
INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:27:26] "GET /serve-audio/C:\\Dropbox\\Public\\Production\\Recorded\\Unity_Bass%20Rev.wav HTTP/1.1" 206 -
INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:27:26] "GET /serve-audio/C:\\Dropbox\\Public\\Production\\Sliced%20beats\\[CC]%20Terrified%20-%20Loop.wav HTTP/1.1" 206 -
INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:27:26] "GET /serve-audio/C:\\Dropbox\\Public\\Production\\Sliced%20beats\\Otis%20Blackwell%20-%20Let%20The%20Daddy%20Hold%20You_2.wav HTTP/1.1" 206 -
INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:27:26] "GET /serve-audio/C:\\Dropbox\\Public\\Production\\Recorded\\untitled_Insert%201_13.wav HTTP/1.1" 206 -
INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:27:26] "GET /serve-audio/C:\\Dropbox\\Public\\Production\\Sliced%20beats\\Maaly%20Laugh.wav HTTP/1.1" 206 -

@YoungPhlo
Copy link
Contributor Author

Ok next:

  • killed the old server
  • changed serve_audio
  • restarted the server with the command python sound-similarity-browser.py

Playback still works in browser:
chrome_mkTpI0UKQb

I guess the forward slashes (/) and Users/ doesnt affect Windows paths:

INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:41:15] "GET / HTTP/1.1" 200 -
INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:41:15] "GET /favicon.ico HTTP/1.1" 404 -
INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:42:01] "GET /process-folder?folder_path=C:\\Dropbox\\Public\\Production\\User\\EDM\\EDM%20Cymatics%20Kit\\Synth%20Loops\\Arp%20Loops HTTP/1.1" 200 -
C:\ML\music-classification\sample-browser\venv\lib\site-packages\transformers\models\roberta\modeling_roberta.py:370: UserWarning: 1Torch was not compiled with flash attention. (Triggered internally at C:\actions-runner\_work\pytorch\pytorch\builder\windows\pytorch\aten\src\ATen\native\transformers\cuda\sdp_utils.cpp:555.)
  attn_output = torch.nn.functional.scaled_dot_product_attention(
INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:43:01] "POST /search HTTP/1.1" 200 -
INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:43:01] "GET /serve-audio/C:\\Dropbox\\Public\\Production\\Recorded\\untitled_Master_3.wav HTTP/1.1" 206 -
INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:43:01] "GET /serve-audio/C:\\Dropbox\\Public\\Production\\Recorded\\Unity_Bass%20Rev.wav HTTP/1.1" 206 -
INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:43:01] "GET /serve-audio/C:\\Dropbox\\Public\\Production\\Sliced%20beats\\Unity_Bass%20Rev%20-%20Loop.wav HTTP/1.1" 206 -
INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:43:01] "GET /serve-audio/C:\\Dropbox\\Public\\Production\\Recorded\\Unity_BooBass_2.wav HTTP/1.1" 206 -
INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:43:01] "GET /serve-audio/C:\\Dropbox\\Public\\Production\\Recorded\\BuiltToLast_Master_4.wav HTTP/1.1" 206 -
INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:43:01] "GET /serve-audio/C:\\Dropbox\\Public\\Production\\Recorded\\BuiltToLast_Master_3.wav HTTP/1.1" 206 -
INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 14:43:01] "GET /serve-audio/C:\\Dropbox\\Public\\Production\\Recorded\\BuiltToLast_Master_2.wav HTTP/1.1" 206 -

@YoungPhlo
Copy link
Contributor Author

YoungPhlo commented Dec 24, 2024

@app.route('/serve-audio/<path:filepath>')
def serve_audio(filepath):
    # Remove any leading slash to normalize the path
    filepath = filepath.lstrip('/')
    return send_file('/' + filepath)

Sonnet came up with a simpler solution that doesnt work on Windows. Going to test something with this.

INFO:werkzeug:127.0.0.1 - - [24/Dec/2024 15:52:21] "GET /serve-audio/C:\\Dropbox\\Public\\Production\\Sliced%20beats\\Dev%20-%20Have%20It%20All%201.wav HTTP/1.1" 500 -
Traceback (most recent call last):
  File "C:\ML\music-classification\sample-browser\venv\lib\site-packages\flask\app.py", line 1536, in __call__
    return self.wsgi_app(environ, start_response)
  File "C:\ML\music-classification\sample-browser\venv\lib\site-packages\flask\app.py", line 1514, in wsgi_app
    response = self.handle_exception(e)
  File "C:\ML\music-classification\sample-browser\venv\lib\site-packages\flask\app.py", line 1511, in wsgi_app
    response = self.full_dispatch_request()
  File "C:\ML\music-classification\sample-browser\venv\lib\site-packages\flask\app.py", line 919, in full_dispatch_request
    rv = self.handle_user_exception(e)
  File "C:\ML\music-classification\sample-browser\venv\lib\site-packages\flask\app.py", line 917, in full_dispatch_request
    rv = self.dispatch_request()
  File "C:\ML\music-classification\sample-browser\venv\lib\site-packages\flask\app.py", line 902, in dispatch_request
    return self.ensure_sync(self.view_functions[rule.endpoint])(**view_args)  # type: ignore[no-any-return]
  File "C:\ML\music-classification\sample-browser\sound-similarity-browser.py", line 141, in serve_audio
    return send_file('/' + filepath)
  File "C:\ML\music-classification\sample-browser\venv\lib\site-packages\flask\helpers.py", line 511, in send_file
    return werkzeug.utils.send_file(  # type: ignore[return-value]
  File "C:\ML\music-classification\sample-browser\venv\lib\site-packages\werkzeug\utils.py", line 428, in send_file
    stat = os.stat(path)
OSError: [WinError 123] The filename, directory name, or volume label syntax is incorrect: 'C:/C:\\Dropbox\\Public\\Production\\Sliced beats\\Dev - Have It All 1.wav'

@YoungPhlo
Copy link
Contributor Author

This might be the ugliest solution I've ever seen:

@app.route('/serve-audio/<path:filepath>')
def serve_audio(filepath):
    # Remove any leading slashes or backslashes
    filepath = filepath.lstrip('/').lstrip('\\')
    
    # If path starts with a drive letter on Windows (e.g., C:), use it as is
    if len(filepath) >= 2 and filepath[1] == ':':
        return send_file(filepath)
        
    # For Unix paths, add a leading slash
    return send_file('/' + filepath)

@YoungPhlo
Copy link
Contributor Author

Ok I gotta run so I think I'm settling on this for now:

@app.route('/serve-audio/<path:filepath>')
def serve_audio(filepath):
    
    # Check if this is a relative path on macOS or Linux
    if os.name == 'posix':
        # Convert to absolute path by adding the root slash
        filepath = '/' + filepath
    
    return send_file(filepath)

Tested on macOS and Win10 and it works for both. Probably a more elegant way to do this but would take a bit more time. Sonnet says the issue stems from /search route:

The issue occurs because `os.path.abspath()` on macOS doesn't always include the leading forward slash when converting relative paths to absolute paths. By explicitly adding the forward slash and using `lstrip('/')` to prevent double slashes, we ensure the paths are properly formatted for the `serve-audio` endpoint.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

1 participant