Sending notification from nodejs server to angularjs - angularjs

I have an angularjs module deployed on a nodejs server. The nodejs also has an REST end point.
Whenever I get a hit in the nodejs REST end point, I want to update a scope variable in angularjs script and then I have to redirect the user to a page after that.
I thought of using event emitter, but i couldn't do that since the event emitter require response.write, and I couldn't redirect to the page after this.
Is there any way I can do achieve this ?

You should use EventSource to send notifications to client. It's built for that purpose. You can use EventSource package for that purpose in Node.js.
You shouldn't redirect the client from the server, if you're using Angular's routing. Instead let the Angular Router redirect after it receives the push notification.

Related

operation name appended to Backend service UrL in azure API management

I have a logic app with http trigger. I am trying to create a proxy for the logic app using APi management. The issue I am facing is that APi management when calling the Logic App, adds operation name which makes the logic app url invalid.
Example: logic app url: azure/invoke
API manager operation name: pass
Looking at trace logs, URL to call Logic app is:
azure/invoke/pass
I am trying to manually add url to backend service with Blank API design instead of using LogicApp.
API management preserves operation URL template while forwarding request to backend API. You can use rewrite-uri policy to control that behavior. In your scenario try adding <rewrite-uri template="/"/>
Anyone struggling why this is happening. The url in the front end is being passed in to the back end. You can either make it empty, add a policy to trim that off

How to track a service whose response is keep changing after a minute in angular JS?

I am working with angular js (1.x).
I need to display some data which is coming from backend. For that I am calling a service.
Problem is that the response keep changing periodically. But still I didnt use setTimeInterval as this may overload backend due to continuously sending request from UI. So I let user to manually refresh the page to update the data.
Is there any way in which I can auto-update the data without having to use setTimeInterval?
What is a websocket?
WebSockets is an advanced technology that makes it possible to open an interactive communication session between the user's browser and a server. With this API, you can send messages to a server and receive event-driven responses without having to poll the server for a reply.
Src: https://developer.mozilla.org/en-US/docs/Web/API/WebSockets_API
AngularJs + Websockets
You can use ng-websocket for angularjs
https://github.com/wilk/ng-websocket
or
AngularJS WebSocket Service Example

What is the difference between server-side and client-side rendering?

That question has a lot of articles around the web discussing it, but given how recent I am to web dev I think I am missing a few pieces to get the full picture.
My understanding is as follows:
Let us assume we have a Node.js server and we're using express for our web app. Client rendering is when I don't enter a URL in the web browser that creates an HTTP request to my server. Instead, the client requests comes from a JS script(that was loaded from the server initially when I accessed the application using the root route for example: http://localhost:SOME_PORT/). So, let's say my request is to fetch some information about a certain user from a database. Instead of going through the server, the JS script(using AJAX) for example does an XMLHTTPRequest directly to the database(say I trigger this by a button called Fetch) instead of going through my server and then the client(the browser) will get a response and in turn will create an HTML document and render it. As opposed to server-side rendering, where I for example enter a URL in the browser, and the server intercepts the request, and prepares the HTML document along with the data requested(if any) and sends it back in HTML form for the browser to render(hence server-side, no work was done on the client-side but actually displaying the page).
Is this accurate? What am I missing in my understanding of both and when to utilize either style?
Let us assume we have a Node.js server and we're using express for our web app.
It doesn't really matter what software you use on the server, but we'll use that for the example.
Client rendering is when I don't enter a URL in the web browser that creates an HTTP request to my server. Instead, the client requests comes from a JS script (that was loaded from the server initially when I accessed the application using the root route for example: http://localhost:SOME_PORT/).
That would have loaded an HTML document which loaded the JS with a script element. You wouldn't load the script directly.
So, let's say my request is to fetch some information about a certain user from a database. Instead of going through the server, the JS script(using AJAX) for example does an XMLHTTPRequest directly to the database
No. You still make an HTTP request to the HTTP server.
(say I trigger this by a button called Fetch) instead of going through my server and then the client(the browser) will get a response and in turn will create an HTML document and render it.
Ish.
The client already has an HTML document. With client side rendering, the DOM generated from that document is modified (usually with new data requested from the server).
As opposed to server-side rendering, where I for example enter a URL in the browser
To keep the scenario as close to the Client-side rendering example as possible, let's say you click a link instead of entering a URL.
, and the server intercepts the request,
The request is explicitly made to the server, it isn't intercepted. That would imply it was intended for somewhere else.
and prepares the HTML document along with the data requested(if any) and sends it back in HTML form for the browser to render(hence server-side, no work was done on the client-side but actually displaying the page).
Basically.
The short version is:
With server side rendering, a complete HTML document is prepared on the server and delivered to the browser.
With client side rendering, the DOM is manipulated on the client to produce the same document.

Appending Param to AngularJS REST Queries

I'm using AngularJS with UI-Router and am attempting to attach a query parameter to a url on all http requests across my site.
I have an OAuth system on the backend and was previously applying Authorization headers to all requests, however to preserve backwards compatibility - have discovered I will have to instead apply a url parameter with the user identification to the backend.
My issue is that, I cannot use $httpInterceptor in the config portion of the app, because at that point in the app I don't have the current User, and can't inject $http to resolve the current user because that creates a circular dependency.
I was trying to use $http.defaults.transformRequest in the run portion of the app, but that didn't seem to be able to append a parameter to the url.
Is there a way to do this short of hand writing it on every REST request across the app?
I had similar problem in my current project.
To solve the problem I manually request current user info before app bootstapping & store it in localStorage.
Then bootstrap the app & in the config section you will have accesss to current user info.
TIP: to get user info before app bootstrap you can still use $http service by manually injecting it:
angular.injector(['ng']).get('$http');

Gunicorn, Heroku, and pushState/HTML5 History API support

If I run gunicorn can I support pushState and the HTML History API on my Heroku-hosted app?
I would like to not have hashes in my Backbone/Marionette app.
Unless I'm mistaken, gunicorn will have nothing to do with this. To use pushState, your server must return a valid page for any URL your client-side application generates.
For example, if your Marionette app has a "/articles/5/comments" URL, the server MUST respond with valid content when it receives that URL.
That said, your server can systematically return the same content (e.g. via a catch all route) that simply contains your complete Marionette app. Then, the client side app will take over, aprsing the route, and loading the data.

Resources