Is there some mechanism to provide server push technology using plain HTML, without using javascript (or any other script languages on the client side).
Under "server push" I mean process where the server to update some part of the page content when needed.
I don't know of any way that true server push can be used without any javascript in the page.
Without javascript, the only thing I'm aware of is a meta refresh tag that would tell the browser to refresh this page after some particular time interval. This tag applies to a whole page only. If you wanted only part of a page to be updated, you could use an iframe and have only the iframe be updated. Of course, this is not server push, but a client-driven auto-update and it will be run on a predetermined interval, not just when there is actually new data. For something smarter than this, you will need javascript.
The most efficient server-push would be to use javascript from the page to connect to your server over a websocket and then have the server just send data to the page via the websocket whenever it wants (true server-push). The client's javascript can then respond to the receipt of that websocket data by updating a particular piece of the page.
Related
I don't even know how to phrase the title of this question, but hopefully the following description will explain my issue.
I have a web application that is made up of a single, bare search page with a search field. The search is actually performed by the client browser and results are loaded via ajax. In other words, the server does nothing but serve up the bare search page at http://server/index.html
Once the query is performed, I use history.pushState() to change the URI in the browser address bar to something more sensible like http://server/index.html?q=searchterm&page=1&size=10. Pagination is performed by prev and next links that too are called via ajax along with the appropriately incremented or decremented page and size values. All is good.
But, I want my application to be a good web citizen, and be bookmark-able. In other words, if someone enters http://server/index.html?q=searchterm&page=1&size=10 directly in the browser address bar, I want to load the results correctly. Except, if I send that URI to the server, the serve will croak unless I implement some server-side processing. And, that is something I don't want to do as that will change the complexity of my application completely. Unless I can do that with plain, vanilla nginx (my web server). In other words, I don't want to implement any server side scripting other than what can be done with the web server itself, such as SSI.
So, how do I solve this problem?
hi the exact term for what you are trying to do is "Client side routing". It involves a combination of manipulating the browsers history using history.pushState() [which you are already doing] and server side config setting
.htaccess if you are using apache
config file if you are using nginx.
The server side settings will make your web server your base index.html for whatever request the browser makes(http://server/index.html?q=searchterm&page=1&size=10) once loaded in the client you have to get the query string in the window address bar and handle accordingly(make an ajax request).
This implementation has implications when search engines crawl your site using the URL but that is not within the scope of this question.
this SO question will give you a start
actually, I think this is a lot easier than I thought. When I send the browser to http://server/index.html?q=searchterm&page=1&size=10, it doesn't complain. It simply sends back http://server/index.html. Then it is just a matter for me to use js to extract the query string and do my ajax bit. This should work.
I'm using a javascript scripting engine for a MUD i'm playing, they have a javascript client hosted on their server. I'm wanting to store some information in a database and access it from the client (or inject it somehow into the client) but I'm not seeing how I could do that.
Basically I can write javascript files into the trigger section of the website and they fire. It has Javascript and JQuery options. It does not have a database option on their end, which is why I'm trying to add it myself.
I know client side javascript has a lot of restrictions on it, so I'm not sure how far I could really go with this.
I think you might be able to do this, but it's going to be hacky.
If you're able to attach a script node to the dom, you can trigger GET requests with no origin restrictions wherever you want. You would do that to your own backend.
You would have to throw away all good practices and use GET requests with a lot of query params so send data to that (your) backend.
You would have to write the backend so that it does whatever you want with the data, e.g. store it in the db.
You would have to make sure you return valid js to the client, even if it's only to dismiss it.
Alternatively...
you could load an iframe to a site you control, and change the iframe src with the data, and then do with the data whatever you want (like sending it to some bakcend of yours properly) in your site (that's loaded in the iframe) by detecting changes in the url...
I had this random question in my mind while I was surfing on the net...
Is it possible to establish connection to MYSQL database WITHOUT refreshing? Like if there is a button in a page which when clicked it secretly establishes connection to Database without even letting user notice any change in the webpage, Everything looks the same but secretly a webpage connects to the database..
I know.. This process is possible in Javascript, but I wanted to find out a way in PHP
When the page has been loaded. PHP can't be used anymore because it's a server side language. Javascript on the other hand works client side. Which means you can execute functions and such on the client's machine without page reload.
AJAX can enable you to 'open' a PHP and execute PHP code (not JS) without page reload. If you will, it's like you're opening a PHP page but it's not visible to the user, it runs the PHP file 'behind'.
As others have said, remember that PHP is a "server-side" language, and that the SQL database also lives on the "server side." The JavaScript application, running on the client, has no direct access to it.
What the JavaScript application must do, then, is to issue asynchronous requests ("AJAX ...") to the server, asking for whatever it wants. The end-user will not be directly aware that this is going on, and the content of the screen-display won't necessarily change (unless you change it).
As part of servicing the (properly authorized ...) request, the PHP side might connect to the database and issue queries against it to get the information that it needs, in order to prepare and send-back a reply to the (JavaScript) client.
Now, the JavaScript side won't necessarily know, nor will it care, just how the results that it receives were actually obtained by the PHP code. It only "issues a request, and, sometime thereafter, gets a corresponding answer."
Suppose you were to build a highly functional single-page client-side application that listens to URL changes in order to navigate around the application.
Suppose then, that when a user (or search engine bot) loads a page by its url, instead of delivering the static javascript file and hits the api as normal, we'd like to precompute everything server-side and delivery the DOM along with the js state.
I am wondering if there are existing tools or techniques for persisting such an execution of state to the client.
I know that I could execute the script in something like phantom JS and output the DOM elements, but then event handlers, controllers and the js memory state would not be attached properly. I could sniff our user agent and only send the precomputed content to bots, but I am afraid google would punish for this, and we also lose the speed benefits of having sent everything precomputed in the first place.
So you want to compile, server-side and send to the client the results of requesting a resource at a specific URL? What is your backend written in?
We have an API running on GAE in Java. Our app is a single-page app, and we use the HTML5 history object so we have to have "real responses" for actual URLs on the front-end.
To handle this we use JSP to pre-cache the data in the page as it's loaded from the server and sent to the client.
On the front end we use Backbone, so we modified Backbone.sync to look for a copy of the data it's looking for locally on the page and if it's not there, only then to request it from the server as an AJAX call.
So, yes, this is pretty much what every site did before you had ajax. The trick is writing your app so that the data can be local in the page (or in localStorage even) and if not only then to request the data. Then make sure your page is "built" on the server end (so we actually populate the data in the HTML elements on the server end so the page doesn't require JS on the client end).
If you go somewhere else the data is dynamic and the page doesn't reload.
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.