I'm interested in adding an HTML/web-browser based "log window" to my net-enabled device. Specifically, my device has a customized web server and an event log, and I'd like to be able to leave a web browser window open to e.g. http://my.devices.ip.address/system_log and have events show up as text in the web browser window as they happen. People could then use this as a quick way to monitor what the system is doing, without needing run any special software.
My question is, what is the best way to implement this? I've tried the obvious approach -- just have my device's embedded web server hold the HTTP/TCP connection open indefinitely, and write the necessary text to the TCP socket when an event occurs -- but the problem with that is that most web browsers (e.g. Safari) don't display the web page until the server has closed the TCP connection has been closed, and so the result is that the log data never appears in the web browser, it just acts as if the page is taking forever to load.
Is there some trick to make this work? I could implement it as a Java applet, but I'd much prefer something more lightweight/simple, either using only HTML or possibly HTML+JavaScript. Also I'd like to avoid having the web browser 'poll' the server, since that would either introduce too much latency (if the reload delay was large) or put load on the system (if the delay was small)
If you don't want to use polling, you're more-or-less stuck writing your log viewer completely outside of a browser. However, it's quite simple to write your polling which does a good job of minimizing both latency and system load (as you mentioned concerns about).
The trick to this is to use Comet, which is essentially Ajax + long polling.
Well, since you do say you are willing to do it in javascript:
Have your process continuously write, without closing the connection
In the client (the browser) use an xmlhttpobject and monitor the ready state.
0 = uninitialized
1 = loading
2 = loaded
3 = interactive
4 = complete
obviously 3 and 4 are what you are looking after. When you get output, all you have to do is write responseText to a div, and you're set. Look here for xmlhttpobject properties and usage.
Since this is quite old now. You can use web sockets for this
Related
There are some SaaS tools [1, 2] that give you a plugin to run on your site, so that you can view how your users are interacting with your website remotely.
I'm guessing this works by streaming DOM updates back to a remote server, but I'm not sure of that. I'm really interested in how this technology works, and whether or not there are tools out there to do similar tasks.
Here's the question: How do they do it? How can we reliably "co-browse" through the use of an installed Javascript snippet? I know of some solutions using WebRTC, but the browser support doesn't seem to be there yet
This is known as session replay.
I'm guessing this works by streaming DOM updates back to a remote server
No, it probably doesn't care about DOM updates. The script would capture every single input event, including key presses, mouse moves, mouse clicks, scroll events etc. Those are what UX designers are usually care about when evaluating their page design. They also might capture the initial state of the DOM.
If those plugins are just for data acquisition (like in A/B tests), I don't think the plugin scripts do actually live-stream those events. It probably captures them, stores them in some compressed data structure, and sends it to the service provider when the user leaves the page or in regular intervals.
Live streaming would certainly be possible, and it seems to be that this is what that co-browsing plugin does. (There's apparently also a back channel - a huge security risk! - to trigger mouse clicks etc remotely). WebRTC (which also could feed the complete video) might one approach, but a web socket would be enough.
Some documentation on how togetherjs in particular does it can be found at https://togetherjs.com/docs/#technology-overview.
this one is a bit tricky to explain, but for simplicity's sake, lets say I have a website (it doesn't have to be html or php or anything, I'm comfortable with most languages) where there are two buttons, yes or no. in order to see the buttons, you would need to have an account and login to load the page that loads the buttons (I've done this part). the buttons, for the grand majority of time, would be hidden and deactivated. However, when I somehow send a command from my computer, the buttons would become visible and the user would be able to make a choice. In this case, the transition would have to be in real time, so the user would not have to reload the page to see if the buttons are usable again. I would then be able to deactivate them again and start again.
I've been looking around the net for solutions for this for the past two days but I can't wrap my head around it. the closest I've come is to using socket.io but I think I might be overlooking another solution that I don't even know about. These commands would have to fire from unity3d, and the socket scripts made for it are outdated and difficult to get working. Am I missing something?
Web sockets support the type of functionality you are describing, but before web sockets came along, other techniques, like polling provided the appearance of getting an uninitiated message from the server. This works by essentially repeatedly asking for any changes by the server. Modern day applications that implement sockets will still fall back on polling when necessary. This would be another option to consider.
This site describes it well and this stack overflow answer give a good high level description of outdated techniques and why web sockets are the the way to go if possible...
"To overcome this deficiency, Web app developers can implement a technique called HTTP long polling, where the client polls the server requesting new information. The server holds the request open until new data is available. Once available, the server responds and sends the new information. When the client receives the new information, it immediately sends another request, and the operation is repeated. This effectively emulates a server push feature."
I am trying to find a way how to build a browser web app that runs in 2 monitors, like;
i have a secondary monitor that i want to put there some window, i want it fullscreen, and automatically in the secondary, so no drags, while the main app should stay in the primary monitor, where is the browser... no way seems, nothing really works so the only way seems to be with some desktop app.
I don't really care if the solution is browser dependent at this point, but still can't find a real solution.
Does a ny body tried something like this and can give me some ideas how to build it?
EDIT
... i need the second monitor to have some specific content, so not a clone of the primary...
kind of... i'm playing some game in the first monitor and i see statistics on the second...
What you are trying to do is not possible yet, but there is a Presentation API that is being discussed that would let you do exactly what you are looking for:
This specification defines an API to enable web content to access external presentation-type displays and use them for presenting web content.
Unfortunately, it seems like there are no browser implementations yet.
Your only other option right now is to use 2 independent browser pages that communicate with each other somehow (LocalStorage, WebSockets etc.).
I am coding a Web app that needs to have multiple tabs/Web pages open. And I would like them to talk to each other. And I don't want the pages to talk to the server. So is it possible with HTML5/JS? By the way they are all on the same domain name.
I've never come across a webapp which used the browsers tab functionality as a means of navigating. I don't want to say it's wrong, because I don't know your particular requirements and, of course, I haven't played with every single webapp in the world.
However, would it not make more sense to implement your own tabbing system within your web app than rely on a feature of the browser which is probably inconsistently implemented and which may be affected by the user's personal settings?
If you're set on this path, and offline functionality is a definite requirement, then I think your only option is using the LocalConnection feature of Flash, as Brad suggests in the comments. I imagine you could create a bridge with ExternalInterface to pass any data from Flash to the page. The Flash would need do nothing else but marshal the communications (it could occupy a single pixel somewhere on the page). This is a similar approach to the one the dojotookit took with their Flash storage, designed to provide a more capable alternative to cookies.
I think the answer here is that what happens in the view, doesn't have to reveal whats happening behind the scenes.
You can make DOM elements on a page communicate with other DOM elements on the page without making a asynchronous call to the server if thats what you're asking.
If you have two tabs in the.. lets say chrome browser, and you want one DOM element to talk to another DOM element on a completely different browser tab. You have to make that asynchronous call to the server which will shoot one back to the other tab. But you don't have to show that happening in the view :) (This can be done with Node.JS/Socket.io, an example would be a chat room built with HTML5/JS)
Hope this helps
I know this is an older post, but you may want to look into local storage, or even cookies set via javascript.
There are 2 reliable ways you can have pages in other tabs (or across iframes) talk to each other.
The postMessage API allows pages to send messages even when they are on different domains. There are some security issues to be aware of to avoid malicious behavior. You can read about that in the linked article.
localStorage and sessionStorage will dispatch a "storage" event when they are changed. Using this event you can be notified in other tabs when the data has changed. This only works within the same domain. Because this is all you need, it might be the wiser option to avoid any security issues.
I got a webpage that calls oracle and then does some processing and then a lot of javascript.
The problem is that all of this make it slow for the user. I have to use internet explorer 6 so the javascript takes very long to load, around 15 seconds.
How can i make my server do all of this every minute for example and save the page so if a user requests it it would server them that page that is all ready calculated etc
im using tomcat server my webpage is mainly javascript and html
edit:
By the way I can not rewrite my webpage, it would have to remain as it is
I'm looking for something that would give the user a snapshot of the webpage that the server loaded
YSlow recommendations would tell you that you should put all your CSS in the head of your page and all JavaScript at the bottom, just before the closing body tag. This will allow the page to fully load the DOM and render it.
You should also minify and compress your JavaScript to reduce download size.
To do that, you'd need to have your server build up the DOM, run the JavaScript in an environment that looks (enough) like web browser, and then serialize the result as HTML.
There have been various attempts to do that, Jaxer is one of them (it was originally a product from Aptana, now an Apache project). Another related answer here on SO pointed to the jsdom project, which is a DOM implementation in JavaScript (video here).
Re
By the way I can not rewrite my webpage, it would have to remain as it is
That's very unlikely to be successful. There is bound to be some modification involved. At the very least, you're going to have to tell your server-side framework what parts it should process and what parts should be left to the client (e.g., user-interaction code).
Edit:
You might also look for "website thumbnail" services like shrinktheweb.com and similar. Their "pro" account allows full-size thumbnails (what I don't know is whether it's an image or HTML). But I'm not specifically suggesting them, just a line you might pursue. If you can find a project that does thumbnails, you may be able to adapt it to do what you want.
But again, take a look at Jaxer, you may find that it does what you need or very similar (and it's open-source, so you can modify it or extract the bits you want).
"How can i make my server do all of this every minute for example"
If you are asking how you can make your database server 'pre-run' a query, then look into materialized views.
If the Oracle query is responsible for (for example) 10 seconds of the delay there may be other things you can do to speed it up, but we'd need a lot more information on what the query does