.NET web API calls are getting intercepted by angular js UI Router, returning HTML instead of calling API

Question

I have an angularjs app, that sits on top of an MVC5 app and an WEB API backend. I am using UI Router for the Angular js routing and for now, have removed ALL $urlRouterProvider.when and $urlRouterProvider.otherwise calls, but still when I try to do a $http:get... it is returning the default home page in the data object and not hitting the service.

My routing is like this:

(function () {
angular.module("OdinSPA")
    .config([
        "$urlRouterProvider", "$stateProvider", "$httpProvider", "$locationProvider", function ($urlRouterProvider, $stateProvider, $httpProvider, $locationProvider) {
            $locationProvider.hashPrefix("!").html5Mode(true);
            $stateProvider
                .state("start", {
                    url: "/start",
                    templateUrl: "/Search/dashboard"
                })
                .state("guru", {
                   ...
                });


            $httpProvider.interceptors.push("AuthHttpResponseInterceptor");
        }
    ]);
})();

My angularjs service is this...

                function updateHistory() {
                return $http.get(urlBase + "/" + textUpdate.Id + "/standardreport/history", textUpdate).
                    success(function(data, status, headers, config) {
                        logoutResponse(data, status, headers, config);
                    }).
                    error(function (data, status, headers, config) {
                        logoutResponse(data, status, headers, config);
                    });
            };

But all that is returned in the data parameter is the entire HTML for the home page (which I won't post as it's pointless) and a 200 status code...

There is only one other article that mentions this problem but the only answer is by the same person and talks about EF, which I don't believe is the issue here!!

I should also add this has nothing to do with HTML5 mode either, that make no difference,,, UPDATE: If I add routes.IgnoreRoute("api/{*pathInfo}"); to my MVC routing config then I get a 404 error, so it looks almost like this could be an MVC issue which is just redirecting the request to the homepage and actually not angular intercepting..... not sure.... any help appreciated! — user4479049, Commented Jun 17, 2015 at 11:13
Okay (~red faced~) this is actually nothing to do with Angular, but to do with the MVC routing and the fact I was using the wrong format for the ID, no redirect gets picked up in fiddler or elsewhere so when the web api says "na, that's not a valid route" it just chucks you back to the default url with a 200..... can't say this is the most intuitive design ever!! — user4479049, Commented Jun 17, 2015 at 13:21

score 1 · Accepted Answer · 2015-06-26 13:13:11Z

For anyone else who has come across this with "exactly" the same issue I will post my brainless moment here so others don't waste time!

What is happening here is the route to the webAPI was using GUID's for ID's, it turns out the backend changed to using int's....

Therefore the routing in WebAPI says..."Not a valid route mate, here have the default page and a 200 status".... but without giving fiddler or your code any indication that it's done this!

Therefore if you have this issue, check your MVC (Not UI Router) routing and double / triple check anything..

I came to the conclusion that it must not be angular by the fact that no-one seemed to have this issue online anywhere... and if you get an issue like that, it's normally because you have missed something simple, as i was!!!!

Collectives™ on Stack Overflow

.NET web API calls are getting intercepted by angular js UI Router, returning HTML instead of calling API

1 Answer 1

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Your Answer

Sign up or log in

Post as a guest

Related