radio-player
radio-player copied to clipboard
oussamatn
Blank page
Hi, just got blank page when run :
npm run serve
Got nothink to display.
Thanks.
Hello,
Can you provide some logs ? Did you tried to run it locally first ?
Hi @oussamatn thanks for respons.
Actualy I'm running on Nove v20.11.1 and npm 10.5.0.
And yen I'm run on localy. But when run npm run serve browser just got blank, noting to see anything on there.
There is on console log :
> [email protected] serve
> vue-cli-service serve
INFO Starting development server...
98% after emitting CopyPlugin
DONE Compiled successfully in 12225ms 3:16:23 AM
App running at:
- Local: http://localhost:8080/
- Network: http://192.168.18.16:8080/
Note that the development build is not optimized.
To create a production build, run npm run build.
And this fron browser console :
[HMR] Waiting for update signal from WDS...
audio.js:8 The AudioContext was not allowed to start. It must be resumed (or created) after a user gesture on the page. https://goo.gl/7K7WLu
AudioContext @ audio-context-constructor.js:38
eval @ audio.js:8
./src/js/audio.js @ app.js:1306
__webpack_require__ @ app.js:849
fn @ app.js:151
eval @ cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/views/station/components/audioVisualizations.vue?vue&type=script&lang=js:17
./node_modules/cache-loader/dist/cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/views/station/components/audioVisualizations.vue?vue&type=script&lang=js @ app.js:998
__webpack_require__ @ app.js:849
fn @ app.js:151
eval @ audioVisualizations.vue:1
./src/views/station/components/audioVisualizations.vue?vue&type=script&lang=js @ app.js:1757
__webpack_require__ @ app.js:849
fn @ app.js:151
eval @ audioVisualizations.vue:1
./src/views/station/components/audioVisualizations.vue @ app.js:1745
__webpack_require__ @ app.js:849
fn @ app.js:151
eval @ cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/App.vue?vue&type=script&lang=js:29
./node_modules/cache-loader/dist/cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/App.vue?vue&type=script&lang=js @ app.js:938
__webpack_require__ @ app.js:849
fn @ app.js:151
eval @ App.vue:1
./src/App.vue?vue&type=script&lang=js @ app.js:1234
__webpack_require__ @ app.js:849
fn @ app.js:151
eval @ App.vue:1
./src/App.vue @ app.js:1222
__webpack_require__ @ app.js:849
fn @ app.js:151
eval @ main.js:11
./src/main.js @ app.js:1434
__webpack_require__ @ app.js:849
fn @ app.js:151
1 @ app.js:1938
__webpack_require__ @ app.js:849
checkDeferredModules @ app.js:46
(anonymous) @ app.js:925
(anonymous) @ app.js:928
Show 3 more frames
Show less
nowplaying.js:84 [__ob__: Observer]
main.js:21 App : mounted
playerConfig.js:9 fetchConfig
nowplaying.js:26 fetchNowplaying
vue.runtime.esm.js:8842 Download the Vue Devtools extension for a better development experience:
https://github.com/vuejs/vue-devtools
vue.runtime.esm.js:8850 You are running Vue in development mode.
Make sure to turn on production mode when deploying for production.
See more tips at https://vuejs.org/guide/deployment.html
configService.js:14 Sun, 24 Mar 2024 20:37:44 GMT
configService.js:16 1711312664360
configService.js:17 1711312664360
playerConfig.js:30 setConfig : {api_url: 'https://demo.azuracast.com/api', title: 'Joujma FM | Radio Station', description: 'Live Radio 24/7 Hits music Only test', manifest: {…}, player: {…}, …}
playerConfig.js:31 setConfig: 20.179931640625 ms
nowplayingService.js:18 Execution time for: https://demo.azuracast.com/api/nowplaying - 252 ms
nowplayingService.js:79 parchannels for loop
nowplayingService.js:35 Nowplaying Service : get : []
nowplaying.js:105 stationId : 0
nowplaying.js:106 setNowplaying : []
nowplaying.js:107 fetchNowplaying: 259.658935546875 ms
cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/App.vue?vue&type=script&lang=js:72 init View
cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/views/Home.vue?vue&type=script&lang=js:42 mounted Home.vue
So, no any error there, but just got blank page. Thanks.
I'm not sure that Node v20 is supported. Currently, I'm migrating the project to Vite and Vue.js 3, please wait for the next release.
Hi @oussamatn thanks, will be waiting for waiting next release with Vue.js 3.
A new branche is created. It is based on Vue.JS 3 and Vite. Make sure to upgrade Node to V20+. It's still under development. #19 Feel free to give any feedback !
Hi @oussamatn, I was tested thats new branch called 'migration'. However, if in Azuracast there are many radio stations, I have problems when choosing one radio station to play. When selecting a channel or radio station, what is played is not the selected channel or station but the other station. And also I can't stop (stop button) the player when radio playing.
Thank you
Hi @oussamatn, the problem is when select station from sidebar. So if you select any station, the audio keeps playing from the station first selected from home and does not play the selected station.
Thanks.
@PeWe79 Thank you for bringing this issue to my attention. I'm working on it !
Hi @oussamatn I've tested and all work great now! thanks! I would be very happy if perhaps new futures were added.
This issue will be clossed.
Ah I'm sorry. Some fixes needed. When play some radio channel and then select other radio channel from sidebar and than page open page radio station selected, audio still playing previous radio station last play.
Thanks.