How to catch HttpResponseException in AngularJS service? - angularjs

Question

In my WebAPI controller, I have a function that returns either a correct result or a HttpResponseException.
public async Task<SearchResult> Search([FromUri] SearchArguments args)
{
try
{
SearchResult searchResult = await _case.Search(args, true);
string validationError = searchResult.Error;
if (!string.IsNullOrEmpty(validationError))
{
throw new HttpResponseException(new HttpResponseMessage(System.Net.HttpStatusCode.BadRequest)
{
ReasonPhrase = string.Format("Could not find the case. {0}", validationError)
});
}
return searchResult;
}
catch (Exception ex)
{
throw new HttpResponseException(new HttpResponseMessage(System.Net.HttpStatusCode.InternalServerError)
{
ReasonPhrase = ex.Message
});
}
}
It is used in angularjs service which calls this function using a http get request as below.
svc.Search = function (searchArgs) {
var deferred = $q.defer();
var url = 'sci/case/search?';
$http.get(sc.baseURL + url, { params: searchArgs }).
then(function (r) {
if (!r || !r.data) {
console.log('Error: No Data Returned');
deferred.reject('No Data Returned');
}
deferred.resolve(r.data);
}, function (err) {
console.log('Error: ' + err);
deferred.reject(err);
});
return deferred.promise;
}
When there is a successful result, r.data contains the expected result. But when there is HttpResponseException thrown from the controller, I can't catch the ReasonPhrase. I need to format custom error messages in the controller and display them in UI. Is HttpResponseException appropriate to accomplish this? Thank you for any suggestions.

Answer 1

When you throw exception the execution flow gets interrupted and internal server error will be returned as result.you should handle error and return error message as the result.
I think you better define a class to represent API call result like this :
public class ApiCallResult {
public ApiCallResult (){
Succeeded = true;
}
public object Result {get;set;}
public bool Succeeded{get;set;}
public string Message {get;set;}
}
then :
public async Task<SearchResult> Search([FromUri] SearchArguments args)
{
var result = new ApiCallResult ();
try
{
SearchResult searchResult = await _case.Search(args, true);
result.Result = searchResult;
string validationError = searchResult.Error;
if (!string.IsNullOrEmpty(validationError))
{
result.Message = string.Format("Could not find the case");
result.Succeeded = false;
}
}
catch (Exception ex)
{
result.Message = ex.Message;
result.Succeeded = false;
}
return result;
}
and inside view :
svc.Search = function (searchArgs) {
var deferred = $q.defer();
var url = 'sci/case/search?';
$http.get(sc.baseURL + url, { params: searchArgs }).
then(function (r) {
if (!r || !r.Succeeded) {
console.log('Error: No Data Returned');
deferred.reject('No Data Returned');
}
deferred.resolve(r.Result.data);
}, function (r) {
console.log('Error: ' + r.Message);
deferred.reject(r.Message);
});
return deferred.promise;
}

Answer 2

You should read the statusText property value in the error callback. statusText property of the response object is a string value which has the status text of the response. HttpResponseException will set the ReasonPhrase value as the status text of the response.
$http.get(sc.baseURL + url, { params: searchArgs }).
then(function (r) {
if (!r || !r.data) {
console.log('Error: No Data Returned');
deferred.reject('No Data Returned');
}
deferred.resolve(r.data);
}, function (err) {
var errMsg = err.statusText;
alert(errMsg);
});