CCG with Vite.js

General
1

I have made a webpage running html, css and js. im using the vite.js to build it. but i try to run the localhost its giving me in CCG but it wont start playing.
it works fine when running in my browser.
does anyone have any experience with this problem?

2

CasparCG needs some functions to work:

  • update(data)
  • play()
  • stop()
    and optional
  • next()

have you check the terminal window for error messages?
or also the log file

3

Thanks for your reply. :slight_smile: i know about the functions an have also had succes when is using VS code local host.

i dont know if it helps but this is my log.

* [2023-11-01 15:23:11.668] [info] Received message from Console: play 1-2 http://localhost:3000/\r\n
* [2023-11-01 15:23:11.668] [debug] Executing command: PLAY
* [2023-11-01 15:23:11.669] [debug] Executed command (0.001s): PLAY
* #202 PLAY OK
* [2023-11-01 15:23:11.676] [error] Exception: C:\superfly\casparcg\server\src\modules\ffmpeg\producer\av_input.cpp(147): Throw in function auto __cdecl caspar::ffmpeg::Input::internal_reset::<lambda_bfb89aca9963b9e3103fecc4f3c3abed>::operator ()(void) const
* [2023-11-01 15:23:11.676] [error] Dynamic exception type: class boost::exception_detail::clone_impl<struct caspar::ffmpeg::ffmpeg_error_t>
* [2023-11-01 15:23:11.676] [error] [struct boost::errinfo_api_function_ * __ptr64] = avformat_open_input(&ic, filename_.c_str(), input_format, &options)
* [2023-11-01 15:23:11.676] [error] [struct boost::errinfo_errno_ * __ptr64] = 1094995529, "Unknown error"
* [2023-11-01 15:23:11.676] [error] [struct caspar::ffmpeg::tag_ffmpeg_errn_info * __ptr64] = -1094995529
* [2023-11-01 15:23:11.676] [error] [struct caspar::tag_stacktrace_info * __ptr64] = 0# 0x00007FF7F3B651FE in casparcg
* [2023-11-01 15:23:11.676] [error] 1# 0x00007FF7F3B8CA80 in casparcg
* [2023-11-01 15:23:11.676] [error] 2# 0x00007FF7F3CB814F in casparcg
* [2023-11-01 15:23:11.676] [error] 3# 0x00007FF7F3CB8565 in casparcg
* [2023-11-01 15:23:11.676] [error] 4# 0x00007FF7F3CB24DD in casparcg
* [2023-11-01 15:23:11.676] [error] 5# 0x00007FF7F3CAF1C2 in casparcg
* [2023-11-01 15:23:11.676] [error] 6# 0x00007FF7F3D619E3 in casparcg
* [2023-11-01 15:23:11.676] [error] 7# beginthreadex in ucrtbase
* [2023-11-01 15:23:11.676] [error] 8# BaseThreadInitThunk in KERNEL32
* [2023-11-01 15:23:11.676] [error] 9# RtlUserThreadStart in ntdll
* [2023-11-01 15:23:11.676] [error]
* [2023-11-01 15:23:11.676] [error]
* [2023-11-01 15:23:11.676] [error] 0# 0x00007FF7F3B651FE in casparcg
* [2023-11-01 15:23:11.676] [error] 1# 0x00007FF7F3B64CDF in casparcg
* [2023-11-01 15:23:11.676] [error] 2# 0x00007FF7F3E07A27 in casparcg
* [2023-11-01 15:23:11.676] [error] 3# 0x00007FF830991030 in VCRUNTIME140
* [2023-11-01 15:23:11.676] [error] 4# is_exception_typeof in VCRUNTIME140
* [2023-11-01 15:23:11.676] [error] 5# RtlCaptureContext in ntdll
* [2023-11-01 15:23:11.676] [error] 6# 0x00007FF7F3CAF1C2 in casparcg
* [2023-11-01 15:23:11.676] [error] 7# 0x00007FF7F3D619E3 in casparcg
* [2023-11-01 15:23:11.676] [error] 8# beginthreadex in ucrtbase
* [2023-11-01 15:23:11.676] [error] 9# BaseThreadInitThunk in KERNEL32
* [2023-11-01 15:23:11.676] [error] 10# RtlUserThreadStart in ntdll
* [2023-11-01 15:23:11.676] [error]
4

The command is missing the [HTML] part and the quotation marks:

PLAY 1-2 [HTML] "http://localhost:3000"
1 Like
5

thanks :smiley: that make the boxes show up but there is no data

6

i get this log if it tells you anything?

* [2023-11-01 15:41:07.956] [warning] html[http://localhost:3000] 1920 1080 50.000000 Log: undefined
* [2023-11-01 15:41:07.972] [debug] ffmpeg[http://10.101.41.65:3000/|0/9223372036854775807] Destroying on asynchronous destruction thread.
* [2023-11-01 15:41:07.973] [info] ffmpeg[http://10.101.41.65:3000/|0/9223372036854775807] Destroyed.

(By the way: Please format logs and code using the </> button above)

7

In case you serve the page from a server (localhost) the server is responsible to prepare the page, that means also to setup the data etc.

If you only want to do standard template work, you don’t use the server, but put the HTML file, with everything it uses, in the Caspar’s template folder and use the CG commands to play, stop and update the stuff.

The log messages are nothing to worry about.

8

but it works fine in the browser? why dont it run it en CCG? :man_shrugging:

9

how do you run from a file?

10

So in the end you are trying to create templates for CasparCG, right? If you would have told that at the beginning we would get quite faster to the point. There are a few places to look:

11

It is not a template. Its a browser that get data from json and fetch them into a newsline (ticker) i have made an example that runs perfekt on CCG.
the one that works: http://127.0.0.1:5500/index.html
the one im trying now: http://localhost:3000.

so again i think the problem maybe relates to the fact i’m using Vite.js to build it. :smiley:

12

You can not share websites, that run on your local machine.

13

The server needs to have access to Vite.js, either by internet or by putting the whole library in a sub-folder in Caspar’s template folder and reference it from there. The second option works also, when no internet is available, in an OB-van etc.

14

okay cool i will try that. so you will just do PLAY 1-2 [my path]?

15

It means page is working. But no data means in casprcg environment the page is unable to fetch data. Share the casparcg log.

16

No it’s a different kind of commands. See here

17

The log i get is tis one.

18

I have tested a default vitejs+react page and was showing in casparcg as it was showing in normal browser. Can you share your project in github so that i can test?

19

hmm. thats wierd. i’m not allowed to share the code unfortunately. i would have liked too. if you could see the problem :slight_smile:

20

I just tried again and got a different log

  • 59:14.403] [info] Received message from Console: PLAY 1-2 [HTML] “http://localhost:3000/”\r\n
  • [2023-11-02 08:59:14.403] [debug] Executing command: PLAY
  • [2023-11-02 08:59:14.456] [info] D3D11: Selected adapter: NVIDIA Quadro RTX 4000
  • [2023-11-02 08:59:14.456] [info] D3D11: Selected feature level: 45312
  • [2023-11-02 08:59:14.457] [debug] Executed command (0.055s): PLAY
  • #202 PLAY OK
  • [2023-11-02 08:59:15.509] [warning] html[http://localhost:3000/] 1920 1080 50.000000 Log: undefined

what version of CCG are you running?