ASP.NET MVC WebAPI Not Returning Data

Question

I'm trying to call a Web API from my website using Angular JS but I'm not getting any data back.

If I run the API separately from my website I get a response back so I know the service is running okay and returning data so it must be the way I'm calling or trying to display the data from my API.

Below is the code from my JS controller on my website.

Any ideas about what the problem is? Thanks

(function () {
var MealsController = function ($scope, $http) {
    var meals = function (serviceResp) {
        $scope.Meals = serviceResp.data;
    };
    var errorDetails = function (serviceResp) {
        $scope.Error = "Something went wrong ??";
    };
    $http.get("http://localhost:2153/api/meal")
        .then(meals, errorDetails);
    $scope.Title = "Meals Details Page";
    $scope.Meals = meals;
};
app.controller("MealsController", MealsController); }());

And here is my view HTML code

<!DOCTYPE html>
<html lang="en" ng-app="MealPlannerModule">
<head>
<title>Employee Details</title>
<script src="Scripts/jquery-2.1.3.min.js"></script>
<link href="CSS/amelia.bootstrap.min.css" rel="stylesheet" />
<link href="CSS/Site.css" rel="stylesheet" />
<script src="Scripts/bootstrap.min.js"></script>
<script src="Scripts/angular.min.js"></script>
<script src="Scripts/app.js"></script>
<script src="Controllers/MealsController.js"></script>
</head>
<body ng-controller="MealsController">
<p>Meal Name - {{Meals.mealID}}</p>
</body>
</html>

Can you clarify the setup you have when it works and when it doesn't work? Both say "my website". Are you accessing the Web Api from a different domain? — Jeroen Vannevel
– Jeroen Vannevel, Commented Apr 26, 2015 at 16:59

Darin Dimitrov · Accepted Answer · 2015-04-26 16:59:35Z

2

I suppose that you are violating the same origin policy by making a cross domain AJAX request here: http://localhost:2153/api/meal. Make sure you have enabled CORS on your Web API for this to work.

Also never forget to look at the console tab in your web browser which will contain useful information about why your code didn't work.

answered Apr 26, 2015 at 16:59

Darin Dimitrov

1.0m275 gold badges3.3k silver badges3k bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

ASPCoder1450 Over a year ago

I have enabled CORS in my config file as well as on each controller [EnableCors(origins: "localhost:55058", headers: "", methods: "")] however I'm not sure about port 55058. Does this refer to the port my API is running on?

Darin Dimitrov Over a year ago

@ASPCoder1450, to be honest I have strictly no idea what port 55058 refers to and whether this is the port that your Web API is running on. That's definitely something that you should know. What I can say from the code you provided is that in your client side application you are trying to make an AJAX request to http://localhost:2153/api/meal and for this to work if your SPA application is not served from the same domain you need to enable CORS on this server.

Abbas Galiyakotwala Over a year ago

you may also use jsonp for cors request

Collectives™ on Stack Overflow

ASP.NET MVC WebAPI Not Returning Data

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related