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
Related
I have a Node.JS backend running on Heroku which pulls data from a Google sheet. This app will run once a day to pull updated data from the Google Sheet.
I also have a client written in HTML, CSS & JS which will need to draw that data from the backend.
The problem is, the client runs on a different server than than the Node.JS backend. This means I have to have the Node.JS backend update some form of database, then have the client download that data.
Some important information:
I don't have access to the client server, but of course I can access the backend.
I only need to transfer a very small amount of data (only 4 pieces of data).
I am doing this as a volunteer project, and therefore anything suggested needs to be free.
These are the options I have considered:
Option 1: Use Heroku Postgres
This is the option I initially wanted to use. However, I learnt that the credentials to access the database change every so often, so that means the final product may not be completely hands-free.
Option 2: Find an external SQL database host
This is the more likely option of the two. However, I've found that many free database host are insecure and difficult to use. I had a look at 000webhost, but I quickly learnt the database was hosted on localhost - this meant it couldn't be accessed by my client.
Which of these options, if any, are the best? What other methods can I use to accomplish this? Could someone please give me some recommendations on services which I could use?
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.
for example:
If i am using an npm package, i can only use it on server side js. Does that mean one will always have to send data through ajax post/get request for example to server side do the calculation then send data back? Is there a better way to accomplish this?
I am aware of how react works etc and i am aware of workarounds to get require to work browser side, but for sake of understanding workflow and how it should all be set up I ask this question.
I am currently using express with nodejs and using ajax calls to talk to server side js and send info back. So want to know if there is a better way of doing this?
No, there's no "better" way to send data from the client browser to the server than an ajax call. Alternativelly you can use a normal form, or url parameters to pass the server some variable with the page load request.
Depending on the npm package you are using to do your calculations, you can just serve that .js library up along with your .html page by moving that script into a static assets folder and referencing it with a <script> tag. Then, you can do the calculation entirely in the browser (client-side) assuming you don't need any other I/O (db, etc.).
I want to upload file into folder from which my Angular app is served while running on localhost. I'm not able to find any solution without using backend.
For example I just want to upload an image file and that file should copy in specified folder of the project. This should be done only with Angular without using any Backend script or hitting any API endpoint.
Depending on your webhost, you can make your assets-folder accessible via FTP.
Making a FTP-call from javascript (angular is javascript) isn't that difficult. And there are plenty of example and questions about it on the internet (like this)
Why you wouldn't do that:
The credentials for your ftp-connection will be accessible in the compiled javascript-code. With a little bit of effort, everyone can find it.
Each gate you open through the webhosts firewall, is a extra vulnerability. Thats why everybody will recommend you to add an API endpoint for uploading files so that you keep holding the strings of what may be uploaded.
Edit:
As I read your question again and all the sub-answers, I (think) figured out that you are building an native-like app with no back-end, just an angular-single page front-end application. An I can understand why (you can run this on every platform in an application that supports javascript), but the problem you are encountering is only the first of a whole series.
If this is the case, I wouldn't call it uploadingas you would store it locally.
But the good news is that you have localstoragefor your use to store temporary data on the HDD of the client. It isn't a very large space but it is something...
The assets folder is one of the statically served folders of the Angular app. It is located on the server so you can't add files to it without hitting the server (HTTP server, API, or whatever else...).
Even when running your app on localhost, there's a web server under the hood, so it behaves exactly the same than a deployed application, and you can't add files to the assets folder via the Angular app.
I don't know what exactly you want to do with your uploaded files, but:
If you want to use them on client side only, and in one user session, then you can just store the file in a javascript variable and do what you want with it
If you want to share them across users, or across user sessions, then you need to store them on the server, and you can't bypass an API or some HTTP server configuration
Based on your clarification in one of your comments:
I'm trying to develop a small speed test application in which user can upload any file from his system to check upload and download speed.
The only way to avoid having you own backend is to use 3rd party API.
There are some dedicated speed test websites, which also provide API access. E.g.:
https://myspeed.today
http://www.speedtest.net
https://speedof.me/api.html
Some more: https://duckduckgo.com/?q=free+speedtest+api
Note, that many of these APIs are paid services.
Also, I've been able to find this library https://github.com/ddsol/speedtest.net, which might indicate that speedtest.net has some kind of free API tier. But this is up to you to investigate.
This question might also be of help, as it shows using speedtest.net in React Native: Using speedtest.net api with React Native
You can use a third party library such ng-speed-test. For instance here is an Angular library which has an image hosted on a third party server (ie GitHub) to test internet speed.
I've been through a number of Node.js, Express, and other tutorials/posts, and I'm struggling with how to think about connecting to a database on various pages throughout a webapp.
I would like to run a Node.js app (with a server.js file that connects to a database) and then query that database as needed on every page throughout the app.
So if I have an inventory.html page I should be able to have javascript that queries the inventory table and displays various inventory items throughout that html page.
Problem #1. I can't find a way to use mysql on any client-side pages, since javascript can't use node's require() function client-side. As detailed in this StackOverflow post ("require is not defined").
Problem #2. I can't figure out an elegant way to pass a database connection to other pages in my app. A page can send a POST request back to the server.js file, but this really isn't as flexible as I want.
I'm really looking for the modern, preferred way to do a bunch of PHP scripting in my Node app. Can anyone guide me to the right way to do this? Thank you!
You just can't directly call mysql from the client. Even if it worked imagine that anybody could modify the SQL queries and access all your data.
The only way how to do it is this:
js client app ------> js server app -------> mysql
You just must have 2 apps: one running in the user's browser sending requests to the server and the other running on the server answering the requests.