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
Related
I am writing an Outlook Add-In (for Office 365) using AngularJs (v. 1.3.15) that is using $http.get to call the SharePoint Online search API. I have abstracted my search calls into an Angular factory which I call from the primary controller.
The issue is that the $http.get call never calls the callback success or error functions. If I trace it in IE, I don't even see the request to SharePoint Online go over the wire.
Using very similar code in a stand alone Angular SPA, it works just fine. Here is some pseudo code to illustrate what I am doing...
App Controller
searchFactory.search(terms).then(function(response){
$scope.results = response.data;
},
function(error){
$scope.status = "Error";
});
Search factory:
factory.search = function(terms){
var queryStr = buildQueryStr(terms);
var results = $http.get(queryStr);
return results;
}
The factory code executes but I never see the request to the search endpoint go over the wire and neither the success nor the error function in the call in the controller is triggered.
The only error in the JavaScript console is something about no conversationId, but that doesn't seem relevant given that I'm calling the SPO API. Worth noting that the call is X-domain.
I am totally stumped. Any pointers are appreciated.
According to dev.office.com, cross-domain requests are blocked by Outlook Web due to same-origin policy:
http://dev.office.com/docs/add-ins/develop/addressing-same-origin-policy-limitations
I believe the SharePoint online API supports CORS so you can use that to get around the policy.
https://msdn.microsoft.com/en-us/office/office365/howto/create-web-apps-using-cors-to-access-files-in-office-365
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 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/
I recently created a CRUD application using AngularJS and Slim PHP Rest services. This simple application works just fine on my local server, but when I uploaded the application to a server at iPage.com, item edits are no longer working.
I find that although POST requests properly contain my payload in the request body, Slim seems unable to extract anything from the request bodies of any PUT requests.
I can provide whatever additional details, but does anyone have any idea why $http.post would continue working properly while $http.put would begin to fail? I have an idea that it might have something to do with my server configuration, but Im not sure where to start looking.
Thanks!!
Try doing something like this at your SLIM's index file:
Slim\Slim::registerAutoloader();
$app = new \Slim\Slim();
$app->put('api url', function() use ($app) {
header("Access-Control-Allow-Origin: *");
header("Access-Control-Allow-Methods: PUT, GET, POST, DELETE, OPTIONS");
// Rest of the PUT code...
});
I have the following in my Angular Model:
return Restangular.all('user/session/authenticate').post({user_id: user_id, password: password});
Which I call in my controller:
User.authenticate($scope.user.userId, $scope.user.username)
.then(function (authToken) {
//do stuff
};
But, it never makes a request. The headers are created, the data is there, and there is no error. I know it's probably me, but for the life of me, I can't figure out what. Also, I can successfully make GET requests to the same service.
Well, the problem wasn't me...sort of. I had the correct Restangular syntax, but a lack of understanding of how my browser works. The browser wanted me to confirm a security exception. No error was given, until I put the url directly into the url bar in FireFox.
Once I confirmed the security exception, the requests began to work.