I have an app that has many controllers and most of them are sending requests to the server. What I would like to do is to check if there is internet connection.
I do that using:
if(navigator.network.connection.type == Connection.NONE){
alert("Oops! You are not connected to the internet!");
}else{
alert("Yes! You are connected to the internet!");
};
Where in app.js and how should I make it to check if there is internet connection on every request made? I tried to add to .config just before my authInterceptor but I can't make it work.
Ps. It works only if I place it in a function inside a controller and call it.
It sounds like you want to write an http interceptor. It's basically a special service you register that gets fired with every request. You can check if you have a connection in there and do what you will with that info. Here is a decent example of how to implement one
http://www.webdeveasy.com/interceptors-in-angularjs-and-useful-examples/
Related
I'm developing a Yii2 REST API, with AngularJS for the frontend to consume.
I need a way to implement real time approach, e.g. for a chat, or to make some real time notifications.
Is this possible, how to achieve? I been reading about Ratchet, Socket.io and some other things, but I couldn't figure out how to make them fit together for REST or if this is the way to go.
Any advice would be appreciate.
You have a few options here.
Short / Long Polling (use setTimeout)
app.controller("MyController", function($scope, $timeout, $http) {
$scope.messages = [];
$timeout(callAtTimeout, 3000);
function callAtTimeout() {
console.log("Timeout occurred");
$http.get('PATH TO RESOURCE TO GET NEW MESSAGES').then(
function(res) { // update $scope.messages etc... },
function(err) { // handle error }
);
}
});
For both short and long polling on client side, you send request, wait to get a response back, then wait 3 seconds and fire again.
Short/Long polling works differently on the server side. Short polling will just return a response immediately - whether something has changed or not. Long polling, you hold the connection open and when there is a change, then you return the data. Beware of keeping too many connections open.
Socket.io (websockets)
I would recommend that you implement websockets using either something like node.js on your own web server or a hosted solution like Firebase.
The thing with Firebase is that from PHP, you can send a post request to a REST endpoint on the firebase server. Your javascript can connect to that endpoint and listen for changes and update the dom accordingly. It is possibly the simplest of all to implement.
I personally wouldnt use PHP for socket programming but it can be done.
To have real-time updates on your website, you can implement one of the following approaches depending on your requirement and how fast you need to update your frontend component.
Using a websocket
You can use a library like https://github.com/consik/yii2-websocket to implement it with Yii2. But this will act as a separate service from your REST API. Therefore you have to make sure that proper security practices are applied.
Running an Angular function with a timeout
You can continuously poll an endpoint of the REST API with a timeout of few milliseconds to receive updated values.
The second approach will create many requests to the API which will increase the server load. Therefore my preferred approach is using a websocket.
Is it possible to communicate restfull webservice using angularjs.my application located in c://Higi folder and i have created restfull webservice in eclipse now i am using return
$http.get('http://localhost:8080/RestfulAndAngularJS_Server/rest/product/findall')
.success(function(response){
$window.alert('success')
});
code for connecting with restfull webservice it is possible or not
If your http://localhost:8080/RestfulAndAngularJS_Server/rest/product/findall endpoint is accessible in general, then it should be accessible via the angular $http service.
You can test whether the server is up by pasting that url in the browser. Depending on how your server side code is set up with regard to content negotiation, you might get an error back (which error will depend on what you used to build the web service, but at least you'll know that it's up).
If it's up then you should be able to call it from the angular $http service. If not, then make sure its' running by starting whatever server you are using in eclipse.
If you're sure the server is up and running, your call should work. You might also consider handling the error callback in your $http.get call to see whats' happening there.
I am currently building a dashboard page with multiple widgets. Those widgets retrieve their data with REST calls ($resource). A few widgets make similar calls and I don't want to DDOS our server so I am looking for a way to make a call only once and resolve all similar requests with the same response.
Since I am restricted to using POST requests only, I cannot use the cache option that $resource offers. This seems to be doing exactly what I want but only for GET requests.
I was thinking along the lines of using a http interceptor to queue similar POST requests, fire only one of them and resolving them all when the first one gets its response.
However, I cannot seem to put the pieces together so any help is appreciated. I am open to other options.
Kind regards,
Tim
Services in AngularJS are singletons, so a solution would be to store the response in the service, as a variable. Then next time you'll do the request, previously check if the variable is null, if it's not you wrap it in a promise and returned it. If it's null, then you do the request, and store the response for the next call.
You can also either use this in your request service or in your interceptor service.
I hope I helped !
Refactor your widgets to depend on a service (singleton).
This service should either poll the server via XHR, or get server push via websocket for updates.
If polling, look into server side caching and etags.
I am trying to create a web app with Angular, and I need some help. I need to POST data to an api. Rather than using $http (which works), I'd like to use $resource, and save().
I've also used GET and query so far, and they work fine. But when I try to call save(), I never get a response. I also don't see a POST request go through when I check on the server side.
Here's my code for the $resource factory (normally with my actual API url, of course)
.factory('ExamplePosts', function($resource) {
return {
all: $resource('http://my.website.com/api/')
};
});
In my controller, I can run ExamplePosts.all.query() or .get(), and retrieve the results. (I also see the request in my server logs.)
I then tried running ExamplePosts.all.save(), and I did not see a POST request on the server logs. I can post to it through forms and it works, but there seems to be a problem with Angular.
Appreciate any help I can get, thanks!
You actually need to add a prefix "$" to the save method as .$save() not .save() read this for more on those that need the $prefix read more
I have a redirect set up made with Switcheroo that redirect calls from an api server to my local one. The redirect is something like mydomain.com/api/* to localhost:3000/api/. The web app is implemented using angular and all the calls are made by angular services. I don't think angular is involved btw.
The calls are redirected to a Nodejs local server.
When I directly use to browser and I point it to the redirected api url (mydomain.com/api/somedata) I get the correct response. The network panel show me the first call to mydomain.com with a 307 Internal Redirect response, and then the second call to my local server with 200 OK response. Everything works fine and I can see the response in the Response panel of the redirected call..
When I go online I see the exact same two calls but I apparently do not receive any data from the server since the response panel is just showing "The request has no response data available". I know for sure that the redirect is landing to my local server since I see the server logs and when I change the response status the browser receives it.
What can I do? Could be an angular problem since the calls are made by anguar services? I really don't think so but I really don't understand why this happen.
Thanks for your consideration.