You can play locally with the player. Todo so you can clone the project then install all the dependencies .
git clone https://github.com/oussamatn/radio-player.git
cd radio-player
npm install
npm run serve
npm run build
To add you stations logo, you need to drop your images inside the folder public/images/stations and change the file name the corresponded station shortcode
We are going to add this station logo.
First, we check station shortcode using the API
// https://backend.com/api/stations
[
{
"id": 1,
"name": "Radio test 1",
"shortcode": "radio_test_1",
"description": "",
"frontend": "icecast",
"backend": "liquidsoap",
"listen_url": "https://backend.com/radio/8000/radio.mp3",
"url": ""
}
]This station shortcode is : radio_test_1.
radio-player/
|-public
| `-img
| | `-stations
| | |- radio_test_1.png
| | |- ...
You can deploy the player in the same server as AzuraCast Core and serve the player trough Nginx-Reverse proxy.
First you need to create a new domain or sub-domain name and configure it as you did with Azuracast domain. ( same ip address)
Go to your Azuracast installation folder then clone the project
git clone https://github.com/oussamatn/radio-player.gitUpdate you API URL and radio name inside the configuration file : config.json ( file inside public/assets)
{
"api_url" : "https://azuracast-backend-link.com/api",
"title": "Azuracast | Radio Station",
"description" : "Live Radio 24/7 Hits music Only ",
"manifest" : {
"short_name": "Joujma FM",
"orientation": "portrait",
"display": "standalone",
...# Additional Environment Variables
PLAYER_HOSTNAME=player.yourdomain.comversion: '2.2'
services:
radio-player:
restart: always
container_name: radio-player
build:
context: ./radio-player
env_file : azuracast.env
hostname: ${PLAYER_HOSTNAME}
volumes:
- letsencrypt:/etc/nginx/certs:ro
- /var/run/docker.sock:/var/run/docker.sock
ports:
- "8080:8080"
environment:
VIRTUAL_HOST : ${PLAYER_HOSTNAME:-player.local}
VIRTUAL_PORT : 8080
NODE_ENV : production
LETSENCRYPT_HOST : ${PLAYER_HOSTNAME}
LETSENCRYPT_EMAIL : ${LETSENCRYPT_EMAIL}
networks :
- frontendOn your server side go to AzuraCast directory then run :
user@host:~$ docker-compose build radio-player
user@host:~$ docker-compose up -dIf you are planning to deploy the app on a private hosting provider, you have to add a .htaccess file in the same directory as the index.html file.
.htaccess
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.html [L]
</IfModule>
This player will always be available free of charge, but if you find it useful and would like to support the project developer, you make donation. Your support is greatly appreciated.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent