How to refresh table automatically from database - javascript

So I have a table with content from a database and I want it to automatically refresh if new content arrive to the database. How can I do it?
I have seen this code but I don't want it to be asking everytime the server if information has arrived. I think that way it will overload the server. What do you think?
Please give me some tip to how can I do this.
Thanks in advance

HTML5 supports websockets.
Nearly all major PC browsers supports web sockets. You can check the compatibility in http://caniuse.com/websockets
You can learn more about the html5 websockets in http://www.html5rocks.com/en/tutorials/websockets/basics/

for push Notification I don't think php is best language for. I think you should use Nodejs for this.
write your entire page in php and use node.js for live notifications. Simply run node.js on differant port and then run on apache. remind that php and node.js are two differant processes. so nither you can call stuff between them nor you can call node.js function to client side.

Related

Integrate Node.js with Symfony2 or PHP

I'm developing a web application with Symfony2. I need to create a push notifications sysmte (like Facebook). When an user publish something, I need some of another users receive a notification.
I saw that Node.js it's the easiest manner to do this. But, I did some simple examples and all works fine, but I don't know how can I integrate this node.js application with my Symfony2 application, or really with a PHP application.
Anybody can help me?
Thanks in advance!
Please note that you've not given enough details, so I will respond as a front-end developer and not as a mobile developer
Integrating NodeJS and PHP (in general) is not a good way since you need to launch both servers separatly, create the websocket server in JS while your application is in PHP and finally create a request (GET or POST) from your PHP to you JS server. Well, a big mess, so I'll expose my solution here under.
Quick insight for mobile apps. Well, technically, there's no easy way. You can use the Push "protocol" (http://www.wikiwand.com/en/Push_technology) with NotificationPusher (https://github.com/Ph3nol/NotificationPusher). I didn't used it before so I can't help you with it.
In general.
Most of the time when people thinks of Push, long polling will do the trick. For starters it means that the request is made client-side and the server don't send data & close connection until there's new data.
How do you implement this ?!?
Basically, you change the max_execution_time using ini_set or set_time_limit to a very long time for the current script and launch a loop (like a do..while) with a sleep and the check to your data inside. From your Javascript just make an Ajax call, for example with jquery: $.get. Just remember to remove the timeout and stay in asynchronous mode.
The only drawback of this solution is that you will always have a connection opened to your server which will consume a bit more of battery on a mobile device. If you have multiple types of data to receive do not hesitate to merge the calls and publish a type in your response data, since most of the browsers allows only 2 or 3 simultaneous connections to the same server.
I sounds like your describing WebSockets.
Take a look at Socket.io, its a module for node.js.
Also there is a example at GitHub https://github.com/Automattic/socket.io/tree/master/examples/chat
Interesting files for you should be the index.js and the public/main.js.
You can see the example live at http://socket.io/demos/chat/

Library that auto-updates/reloads the current page when the server changes

I'm looking for a Javscript library, server, etc. that will allow me to automatically reload a web page when the version in the server changes.
Update: I understand the technologies involved, and what it would take to implement this. What I'm looking for is something that's already made. A script I can include in my HTML file that will monitor the server for me. I mean, why reinvent the wheel? :D
Do an ajax call at set intervals to a server side script passing it a timestamp of the latest file, compare that to the timestamp of the file on the server, and if the one on the server is newer, then echo back the contents and reload the page.
You need something like Comet, that lets you send a push message from the server to the client, as soon as a new version is available. The basic idea is to keep an connection open from the client to the server, over this open channel you can send messages to the client which in turn can react to such messages (e.g. by executing JavaScript code to reload the page).
See this example with a PHP backend on how to implement Comet.
The must for this kind of technology is node.js with the socket.io module.
It allows you to use WebSockets, a channel remaining open between the client and the server, and both of them react to changes when a message is sent either way.
When websockets are not available (not using modern browsers), socket.io fallbacks to long-polling ajax.

Comet WEb server implementation

I recently asked one question :- Handle Web Server with multiple clients
I have gone through the basic techniques to implement comet server like streamhub,Maven/Jetty etc.
I have following questions for that :
After that I found the issues like in case of Maven/Jetty internet
connection is required for downloading certain files from net.So it
it possible to implement it if no internet connection is there on
machine where the web server is hosted ?
Also I want the open source tools/technologies to achieve the thing
mentioned in the above question. and I think stream hub is not a
open source free version. Please help if you know any tool which is
free/open source to use.
Currently the web application is running on apache web server. so if
I use comet server what changes I need to do in that ??
Please help...
Thanks in advance...
For comet, pick a server which can handle many open connections. For a chat app I implemented which currently handles 10k open connections, I used Mochiweb. You might want to give that a look.
Going along the Mochiweb path, I will also recommend Erlang for implementing you server. It will be a small piece of code. Basically, you will listen on a path and hold the connection open till you have some data to respond with or timeout.
On the client side, you would write a simple JS function which will make an AJAX call and handle response timeout and data responses as and when they come. Nothing too different here. However, you may need JSONP instead (crossdomain/subdomain because of different servers for web and long poll), so ensure that your LongPoll server replies accordingly.

How does one do realtime updates of a web page?

Google's GMail service does it because it integrates Google Talk -- and Etherpad (now typewith.me) made famous the system which is used by, for example, Google Wave. All such systems update the page the user is working on effectively instantly when other users make changes to the page. It's easy to tell the server that a change has happened when it has happened, but it's more difficult to get clients to update themselves.
How does this kind of realtime editing work? Does it simply have the client ping the server tens of times per second for updates?
You can use Comet.
Asynchronous JavaScript and XML or AJAX
With Ajax, web applications can retrieve data from the server asynchronously in the background without interfering with the display and behavior of the existing page. The use of Ajax techniques has led to an increase in interactive or dynamic interfaces on web pages. Data is usually retrieved using the XMLHttpRequest object. Despite the name, the use of XML is not actually required, nor do the requests need to be asynchronous.
Just in case someone falls on that question.
Comet was an old way of doing real-time updates, now it has been made obsolete by technologies like websockets
I suggest using AJAX & jQuery for Asynchronous JS
http://api.jquery.com/category/ajax/
There are many options but basically i'd recommend you look into XMPP. i don't think i'm good enough to boil it down correctly, so i'll let a wiki talk for me
In fact, google voice and video uses it for these systems.
About AJAX, i think it's a communication channel, not a platform or a protocol for multiple person exchange. You could also answer "Use xml over http!" and still be at the same point :)
AFAIK, they use some form of AJAX. However, I would recommend you use the AJAX libraries via jQuery. AJAX is simplified a lot if you use jQuery to do it.
Javascript / Ajax allows you to send code to be executed on the client-side (that means, by the browser).
Now if you e.g. define a loop which checks for new messages on server every 5 seconds, you can update the web-page "in-real-time" (plus the time for the server to process the req and send response), or similar. A practical example would be the RoR Prototype periodically_call_remote Ajax helper.
Hope this helps!
As everyone says.. AJAX.
The client keeps on asking the server, after say 30 secs if there is anything new for it to do. Also, you can set the timeout value on an ajax request. keep the time out a bit high.. and the server replies whenever there is something new.
There is no way that the server can other wise ask the client to load some data.
If you are thinking of implementing something on the same lines, look up strophe.js which is an XMPP js-library
It can be done via POlling and Push design.
Polling is a client side information pulling technique after a given timeperiod.
Push technique involves the server to push the new updates to the client using websockets or new websocket like technology for example pusher.
Article

can you asyncronously notify a web browser?

I'm trying to figure out if there's a way I can somehow notify a web browser of an event from a web server.
I know Ajax lets you asynchronously make a request to update a section of a page. I guess I could have a timer periodically ask for updates. But, I'd prefer to avoid a polling scheme, if possible. Is there a better way to go and still remain with a browser-based solution?
Check out "comet" techniques, where you basically hold a connection open to a server which pushes data back at you.
Well, you could try to set the "ignore-user-abort"-flag on, and make sure that the script doesn't terminates (while condition) sleep()). After you have echo'ed the information you need to transfer, flush() the text to the browser.
But i would't recommend this solution. Instead: Go with ajax, and use a polling scheme. Most up-to-date framework support it out of the box.
Comet is the thing you are looking for. There are some js libraries and http servers that make it easier to use. It's based on the idea of keeping connections open with a certain request and streaming back to the browser when the server has something to stream. You should be aware of he fact that browsers usually can have a very limited number of connections open to one domain (typicaly one I think). If you like to try this out take a look at:
dojo cometd
js io
orbited
apache tomcat advanced io
If you are into erlang check this:
http://yoan.dosimple.ch/blog/2008/05/15/
I guess I could have a timer periodically ask for updates. But, I'd prefer to avoid a polling scheme, if possible.
Tough luck: that's what you gotta do. The web is built on a request/response model: 1 request from the browser, 1 response from the server, and always in that order.
That said, you don't have to (and probably shouldn't) build that polling scheme yourself. You can probably find an existing implementation that abstracts away the details and make it look like the server is notifying the client.
You can use partial rendering. I would check out this article for more information.
Here is another article on the topic.
There is Server-Sent Events from the WHATWG Web Applications 1.0 specification that was added to Opera 9. Mozilla/Firefox seem to be working on it.
In the past I found nice article about streaming data in HTML:
http://ajaxpatterns.org/HTTP_Streaming
Can be usefull :)
Also check out juggernaut for RubyOnRails here

Categories

Resources