How do I control sound with the Web Browser Widget?

Development Audio
, , , , , ,
1

So I am playing around with the Web Browser Widget, I made a Widget Blueprint where I added the Web Browser Widget and after that I made a Blueprint Actor Class so I could display the browser as a big screen in my game world. But I don’t understand how I can control the audio from the screen when I am on sites as Youtube.

The sound will play at full volum where ever you are in the world and I was wondering if it is possible to make it so when you move away from the screen the audio will fade out until you are so far away you can’t hear it?

2

Did you get an answer to this ? - I’m looking to do the same thing ?

3

I never did, I tried my best to figure out how/if this was possible by myself but after a few weeks I gave up. Hope you have more luck than me regarding this! :slight_smile:

4

I also can’t find a solution :frowning:

5

You mean you want to enable click sounds?

6

NO…Need the Audio from the Website to come into the Unreal session !

7

When I open the web widget, I do get sound. I’m using a web widget inside a blueprint, so that it can be seen as a regular actor in VR. I’m trying to do the opposite: how to mute. The web widget C++ code doesn’t have much in it to interact with the browser. The only thing available is a call for javascript. So it might be possible to turn on/off the web widget browser using the javascript call. Yet, the target URL would need to have a function to enable/disable sound for whatever player is being loaded. Its not a general function for the entire browser. At least, Chrome at the moment doesn’t give access through its interface to mute other than using the mouse on the main google menu.

8

I also interested in this question/answer.
I have a playable TV screen widget with youtube videos and a volume setting in the app.
As the web browser is an experimental widget, unfortunately its possible we dont get a solution for UE4…
+As there is no parameter for YT URL for volume, only solution can be write a javascript player and call that link from web browser widget, and setting volume by JS with player.setVolume(Number).

9

I’m interested in a solution to this issue. I’d like to be able to setup in game audio emitters near Web Browser screens. The Audio being routed and played in game instead of being directly pumped into OS audio bus. This is ironically is a major sticking point in what I’m trying to do. If this can’t be achieved in UE4, I may have to resort to a whole different game engine which supports or can support this.

10

is there a option to add the webroser to a mixer in unreal so you can control the volume in game?

11

A bit late but I also ran into this issue… Sadly there’s not much we can do with a web browser widget. Although I found hope when I saw the “Execute Javascript function” node, which is how I got it to work.

I’m using the web browser specifically for Youtube URLs only and using the javascript code to fetch the playing video and change the volume. It works because the code is specifically made for Youtube. If you allow multiple other websites in your web browser, you might have to create a script for all of them…

But anyway, here’s my setup in Blueprints.

Screenshot_164
Screenshot_1641232×379 68.1 KB

And I used chatGPT to generate the javascript function (I tried it on Youtube in my browser beforehand to test and it worked) here’s the code to inject:

var videoPlayer = document.querySelector('video.html5-main-video');
videoPlayer.volume = MyVolumeVariable;

Hopefully it helps!
Cheers

1 Like
12

It works for me. Thanks for sharing Felix :slight_smile: I think we are on the early days of a true spatial web-browsing experience for YouTube.

PS:
this code to “control” the play button (after first play):

var videoPlayer = document.querySelector('video.html5-main-video');

if (videoPlayer) {
    // To play the song
    videoPlayer.play();

}

and to pause:

var videoPlayer = document.querySelector('video.html5-main-video');

if (videoPlayer) {
    // To pause the song
    videoPlayer.pause();

}