Fetch Datas
Playlist and preset datas from a database.
Overview
In the previous code examples, the datas for the playlists and presets was hardcoded. However, this is not always the desired way. The data can also be loaded from a database or another file, such as JSON, and then passed to the player.
The principle here is the same. It is important that the structure of the datas for the playlist and the presets is as described.
The following code is exemplary and shows how to implement this with PHP and the JavaScript fetch API. The code based on a MySQL database connection. Customize the code according to your requirements.
With PHP
The PHP file
The file with the HTML
The JavaScript file
With the JavaScript fetch API
The file with HTML
Note:
Important! Do NOT set the attribute preset here in the frissbee-audio-player HTML tag if you pass your own
presets with player.customPresets via the JavaScript fetch API.
In this case do it in the JavaScript fetch API!
The reason for this is that the player has not yet loaded your custom presets at this point. Therefore, in this case, the custom presets must be
set in the JavaScript fetch API using the setAttribute() method.
If you only set the playlist via the JavaScript fetch API and use a preset from FrissBee Audio Player, then you can to set the preset
attribute here in the frissbee-audio-player HTML tag.
The JavaScript file
The PHP file