I have a 3d widget that contains a web browser. I need to replicate the web browser content on the client side. I need whatever changes that are made to the web browser on the server side to be synced with all the clients. For example, if a youtube video is loaded on the server, I want all the clients to be able to watch it through the same replicated web browser.
I've been working on a replication project with Web Browsers and Video Streaming in general for the last couple of weeks. As far as I'm aware, you can't actually "replicate" it because the Web Browser Plugin (the normal one that UE has without needing to download it from the Marketplace) is pretty much an unfinished prototype that lacks a lot of control. Rather, you can replicate it but it won't work, so to say. It just means it does the functions it's supposed to do instead of anything being shared across clients and the server.
What you can do instead is actually Execute Javascript commands from inside your Web Browser Widget, which you call from your Actor Blueprint or Character Blueprint with Multicast Events.
Just to make it simpler, what you can do is send a "request" to the server if the Actor you're using the event from isn't a Server (UE4 has an "isServer" boolean you can call from pretty much anywhere), and then actually execute that with a Multicast Event if it is a Server.
Another difficult part about it is the fact that you can't really achieve Sound Attenuation with Browsers unless you brute-force it with Sphere/Box Collisions and the Youtube API which lets you change the volume of the Youtube video.
For more information about using Multicasts properly, I suggest you to look at this blog. Didn't understand a lick until I read this.
Related
So I have some time on my hands and thought I would make myself a little jukebox / radio type app.
It would be fairly simple, just a collection of MP3's on the server, one is chosen at random, it plays, on completion, the next one is chosen and plays. The front of this would just be a super simple page that has a player and displays the metadata.
I don't really have any experience with server programming but I'm going to look in to Node, seems like it would be good for this. I've already written a little script in Python that chooses a song from a selection and plays it (using VLC at the moment) so it should be simple to port it to Node / js.
Just wondering if someone could point me in the right direction for how to link the "player" with the "playlist".
Looking in to it, I can only find solutions involving a client and server using shoutCast or ICEcast or similar - so the playlist streams audio to a shoutcast server, and the website is just a player looking at the shoutCast URL - that seems unnecessary for me, as the streaming and the site would be the same thing.
New to a lot of this :) but I have time at the moment so happy to get stuck in!
Thanks in advance
I've built something similar and opted to do almost all the work client-side. There are several advantages:
Less infrastructure needed (and less to go wrong)
You can re-use normal HTTP CDNs for serving static files
More flexibility for client changes later (like sending different content to different clients, for A/B testing)
Potential for offline playback
No need for SHOUTcast or Icecast. All you need to do is publish the playlist and associated files to a web server. Client side, you can read this playlist, randomly pick an entry, and then load it via a simple new Audio().
Now, when your audio object fires its ended event, set the src property to the URL of the next item in the playlist. (This detail is important or Safari will stop playing audio, as they assume the user didn't want to continue.)
I am searching for the same. I think you are right using node.
I am trying to create an app to mirror my phone's screen in a e-book reader's browser.
The idea is to continuously make screenshots and make them available from http server running on the phone.
So far I have succeeded in having an http server running on the phone and sharing the latest screenshot.
Now I would like to update the image in the browser automatically - which mechanics should I use - should the website pull the image every x milliseconds or can I push the changes from the server? The image transition should happen smoothly. The e-book's browser is somehow limited, for example it doesn't support html5-video and probably many other things.
I am using the basic dart httpServer (because my app is in flutter) and would prefer to keep it basic.
For testing I had a png Screenshot, but I would also like to optimize for greyscale and maybe try to do something with canvas (don't have experience here) if the browser supports it.
Main questions:
-is there an easy way to push changes from server to browser?
-how do I achieve a smooth transition between images (and skip refresh if the image didn't change)?
-which alternatives are there to using images?
-can canvas help me somehow?
I think the best thing to use here is WebRTC. The browser provides getDisplayMedia that allows you to either capture a tab or the whole display of a device.
You can then connect your two devices, and stream the capture live. The other nice thing is that it will be P2P and you should see sub-second latency (and you don't have the added complexity of running a HTTP server).
All you need is a signaling server to send the Offer/Answer/ICE Candidates between the two peers. These messages are just 'bootstrap' details to get the call started.
If getDisplayMedia doesn't work on the device you can add WebRTC via a native app. flutter-webrtc is one possible solution.
I've been doing a lot of research, and perhaps just need a few dots connected.
I have an idea for a mobile app/website that contains lists of local eating/drinking establishments along with the deals/specials they offer each day. The idea is to create an app that people can refer to in order to save money on a night out.
I'm familiar enough with HTML/CSS/JS to create a functioning website, but when it comes to backend I'm a little confused. Editing the markup in order to reflect changes (e.g. a new deal starts or new establishment opens up) is a bit cumbersome. Now I know I want a database with my information ready to be displayed on my page. Does this mean that I need to develop my own API for everything, and then make sure it integrates with the hosting website that I end up choosing?
I feel like I'm missing something that should make it obvious what the next step is. Can anyone offer any advice?
The short answer is yes, you are exactly right.
The long answer is that is definetly one way to do it. But, for large projext just using JS can get quite cumbersomoe on your client end. Usually the first level would be using something like ajax. It's a great way to start and you can go a long way with just ajax. This is acutually where most people "start" when using just javascript to make api calls. The next level would be to use a framework like Angular. This will of course do more for you than just help handle api calls and it requires a larger investment in learning.
So that is all client side...
Now for the server side part... When you publish a website you are now dealing with "server-side" content. You have taken your static content and it is served up from the server but it's always the same static content from the server then it becomes dynamic on the client when all the javascript starts getting parsed.
The API is another server side component. But instead of being static like your pages, a bunch of files just sitting there, it is an actual application on the server. It takes a command via an api request and then does its thinking and then spits out a response object dynamically to the requester, which in this case will be the JS on your site.
Now, if you don't like the idea of learning to make your own API there are resources out there that will host an api for you and give you a gui to build your own API. I can't recommend one because I have never used one, but I do work with businesses that do and they love the fact they don't have to hire a dev to make thier apis. The downside is they are tied to that service and limited to the functionality that the service offers. It's not a big limitation as the services are quire powerful but if you are going to be managing complex data sets then it would probably be better to learn to make your own api.
Hope that clears things up a bit for you!
I am writing a remote server to control a robot with. The robot provides video and its current sensor state; the server sends control commands.
My choices for sending the frames and the control/sensor-state between the robot and the server ( 2-way ) are ZeroMQ and WebSockets.
I need:
Speed
Security
My coding partner wants to use Websockets because it's undergoing standardization, but I have 3 months of experience using ZMQ to do just what we're trying to do, so I'm fairly certain the choice doesn't matter.
However, I'd like to know if anyone can think of a compelling reason to go with one OR the other (XOR). We're not going to use ZMQ+Websockets because we don't need to.
Looking at what WebSockets are, I honestly don't think it's going to make much difference. They're simply a way to switch between speaking HTTP to the WebSocket framed message protocol down the same TCP connection. ZMQ gives you framed messages too, but you'd be using that over a network connection separate from the web browser's HTTP connection.
Latency comparisons are going to depend on just how good a run time environment the Web Browser provides. It seems to me that use of WebSockets will involve writing the client side code in Javascript and running that in the browser (the "modern" way), so that code will be at the mercy of the Web browser's Javascript engine (they're pretty good I think).
With ZMQ you may be having to write a native application for the client end (I don't know if it can be used within a web browser within Javascript - I need some education!). A native application is free of any influence from a web browser, so it might be just a shade better.
But if your real time requirement is only on the human scale (i.e. it need respond only quick enough to make a human happy), I think either will likely be sufficient. Neither can overcome propagation times across the Internet, neither can account for OS / browser delays.
The one difference is that with WebSockets it looks like you have to switch between HTTP and WebSocket protocol. So if you need to switch back to HTTP to load some web element or other, that's going to interrupt the flow of WebSocket data until you switch back again. Whether or not that is actually a problem is going to depend very much on what your client side application is doing (for example, you may very well be talking to a separate web server for web page elements, in which case you'd have two connections on the go anyway).
With ZMQ you're going to have a dedicated connection.
I am looking to develop a browser-based front-end/client to what is essentially a database-like back-end/server.
The server application will need to access some local hardware I/O and will be logging events to a database (or even a fixed format text file).
The front-end needs to display real-time status of the remote I/O, as well as be able to browse the event log by date. This means that the server will likely need to be able to push to the client as events happen or status changes.
My background is in embedded/firmware, assembly, C/C++, and I have done a fair bit of work with Windows/MFC clients providing UI to devices via TCP/IP, UDP, and serial connections, but I don't have any web based experience.
The number of choices for web development these days is overwhelming, so I am really looking for somebody with experience to point me in the right direction for which technologies/platforms to consider researching. (ie. AJAX, ASP.NET, NODE.JS, Javascript, PHP...)
I suspect providing the information to the front-end will be the easier part, and that the back-end will require two parts (one app/service to interface with the hardware and create a database/file that the other part can access and serve to the client).
What tools/platforms/technologies would you recommend to tackle this, and why?
Any advice is appreciated. (Links to references/tutorials also appreciated).
Thanks!
I would recommend looking at the ext.js framework. This is a client-side framework that is server agnostic that can greatly speed up development. Being a client framework it is based on JavaScript an can talk via AJAX with JSON/XML to server-side systems. It offers a very rich and professional experience and wirth the $595 price tag.
You build most of your application client-side and it can works with almost any back-end. The engine is fast enough to display real-time data and has a strong developer community.