I'm serving a one page app. The app always needs to request initial data from the server once it's loaded.
Is there anyway to dynamically serve data with the initial asset load of css/html/javascript, without rendering it in the html?
Sending a js object with the data so we don't need to ping the server?
inserting a script tag? adding a dynamically created js file to the asset load?
A little bit lost, any help would be really appreciated.
In my opinion, the best way to serve dynamic content from the Node.js server to the client is to use socket.io.
If you don't wanna use socket.io, you can try to create a dynamic page that acts different on the Node.js server, and use XMLHTTPRequests to receive the data.
Related
I am loading an Angular app in a .NET MVC .cshtml file.
The Angular app is all compiled by the webpack compiler (so it's static content at runtime) and the .cshtml only loads the app.js and an Angular component.
Now the first thing the app does when it loads on the client is go async to the server to get some data (in this case only a small call to get a total count of items).
And that annoys me, because when the page was loaded from the server, that same data was already present, in cache, on that server. So the server gives all JS and HTML to the client, without that 'itemcount' the server already has, and then the client has to go back to the server to get that data.
So what I would like to do is let the server give all the JS and HTML, AND that 'itemcount'. But I do not know how.
I can't inject it in the JS, because that is static. I could inject it into the HTML in a script tag, but the Angular app can't read it then.
So the only thing I could come up with is to generate, on the server, a JS file with the itemcount, and then load that JS file with a script tag, and then the App could also read it because it's a kind of global variable (which design time the Angular app doesn't know, so that kind of doesn't look nice).
Is there a better/nicer approach?
I have a web application with a client that receives data from a server. I have the data in NodeJS, but I want to pass the data to a Javascript file. The Javascript file is included in a HTML file, so I can't make the files communicate with eachother.
I am new to NodeJS, so it can be a stupid question, but anyones help is appreciated
This is for a project where I need have a data stream, and I need to pass it into a web application. I tried to pass the data to different page inside my application and then I tried to get that data on that page inside my web application via Javascript, but I couldn't make that work. I'm not even sure if its possible at this point.
Your node server can't communicate with your front-end without a specific way of communication like websocket, you have many other way to communicate with your front-end as node-server, take a look at server send event for example.
By the way your front-end can call your node server more easely with a get request as said #tomerpacific in comment.
For that you have to open a route with your express app. Routing with express
And for call it on a GET request, for that you can use the XMLHttpRequest, and if you have implemented jQuery on your front, you can use Ajax jQuery.
I am getting data on the client side via websockets and laying it out via js. I want to add button to create pdf (using SelectPDF C#.NET). The data for the pdf is the same as on the page, yet the layout is completely different. I would like to send the data to the server side (e.g ajax with my data structure) and create layout on the server side, render it and then pass to server side SelectPDF for pdf creation.
1) Is it possible to send data from client side to ReactJS.NET to create the layout on the server side?
2) If not ReactJS, what would you recommend to use for server side rendering and then sending the rendered file to SelectPDF?
Thank you
If you want to render react content from your server, you have to be sure your production enviroment has internet access (not recommended) to take cdn reference to Reactjs libraries or keep that libraries local.
High level diagram
I want to know how can I reflect the change on the HTML as soon as the data changes on the database.
I am aware that I could poll the php file with setInterval function to periodically check if database value changed. However I am interested to know if it could be done without the setInterval function?
Presently the app uses jquery library and PHP backend.
thanks for any help in advance.
Based on the comments below and more research Accessing socket.io server via Apache served pages
Accessing socket.io server via Apache served pages
I understand I need to have a node package running on my server to work with socket.io or websocket.io. I cannot take the liberty of installing it since I am on a VPS.
Therefore, its best to use Simple long polling example with JavaScript and jQuery as a snippet to my situation
I am trying to use ajax to generate pages on the client side, and so far I got two ideas of doing it:
I can load a page with basic DOMs, JS and CSS files from server, then I can make an ajax call to get data from the server and generate pages on the client side.
I can load a completed page with JS and CSS files from server, and I can make an ajax call whenever users want to update the contents.
I don't like either of the two methods (both of them will have page templates in JS code). The first one is making extra an request to the server; the second one requires me to make another 'copy' of template in the php code.
Is there any suggestion to make the structure cleaner?
UPDATE:
I feel maybe it's good to generate the whole page at the server side when the page is not too big (i consider a table with hundreds of rows is big and it cost a lot for server to generate all those html tags around the data), and in this case, you just need to use ajax to pull the page instead of getting json data from the server then generate the page.
From my experience, there are two scenarios in which you'd want to render client-side:
You are building a pure client-side JS application.
You want to serve the data for different platforms (web, desktop, mobile native).
Unless you identify your page with one of the previous scenarios (which I assume you don't), I recommend you to render in server side. Although the response is going to be bigger (server side computing time is negligible), the perceived speed compared to client side rendering is going to be faster.
If you need to serve a very big page, note that you could autoload chunks of HTML via AJAX whenever the user reaches the bottom of the page without the need of client side templates.