HTTP Get request from Angular JS receives empty reply
Question
Since I am fairly new to web development, this might very well be a very easy to solve question. Unfortunately I am not able to solve this myself as I have no clue on where to search.
Currently I'm trying to get data out of an ASP.NET Web API that is running on my local machine. To get this data I've written a small piece of JavaScript using AngularJS:
function MainController($scope, $http) {
$http.get("http://localhost/DBLayerDLL/api/tablets/1005").
then(function(response) {$scope.data=response;},
function(response){$scope.data=response;});
}
The HTML page that is used, is also very simple:
<!DOCTYPE html>
<html ng-app>
<head>
<script data-require="angular.js@*" data-semver="1.3.0-beta.5" src="https://code.angularjs.org/1.3.0-beta.5/angular.js"></script>
<script src="scripts/main.js"></script>
</head>
<body ng-controller="MainController">
<h1>Hello World!</h1>
<div>
<div>Data: {{data}}</div>
</div>
</body>
</html>
The action of the controller in my Web API is implemented as follows:
[RoutePrefix("api/tablets")]
public class TabletsController : ApiController
{
[Route("{ID}")]
[HttpGet]
public TabletRecord GetTablet(int ID)
{
TabletRecord tablet = new TabletRecord();
tablet.LoadFromID(ID);
return tablet;
}
}
The problem lies within the response I get from the HTTP request. When printed on the page it looks like this:
{"data":"","status":0,"config":{"method":"GET","transformRequest":[null],"transformResponse":[null],"url":"http://localhost/DBLayerDLL/api/tablets/1005","headers":{"Accept":"application/json, text/plain, */*"}},"statusText":""}
Which is not correct, as I know that my API will return data. It gets even weirder for me when I use Fiddler to see what is going on. Within Fiddler I can see the request and see that the response is completely different from what I see on my web page:
Due to my lack of knowledge and experience I don't know what is going on...
- Is there any thing I am doing wrong in my JavaScript?
- Should I do something else within the HTML page?
- Or is there any special thing that I need in my Web API?
Any help or thoughts are highly appreciated!
2 answers
solution1
1 ACCPTED 2015-05-11 09:39:14
After spending quite some more time on this I've found a couple of things were needed to solve my problem:
I've noticed that I had to enable CORS on my Web API in order for the JavaScript to be able to make requests to my Web API. I've came to this via this link , I just followed the steps as explained to get it up and running.
I've also discovered at first that I can also get my data using the general
XMLHttpRequestobject available in JavaScript. By first getting my data to display using this method, I've also discovered the next item:The response object returned by the
$http.getmethod is actually the object that is directly returned by my Web API. So I can just use the defined properties to display the required data.
solution2
0 2015-05-08 12:11:47
On normal php i get the angular variables with
$data = file_get_contents("php://input");
you should look if
print_r($data);
contains what u need.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.