HTTP Headers In Response Data From Express Server In Safari
My angular app is making a call to my API from a ui-router resolve:
...
$stateProvider
.state('gallery',{
abstract: true,
templateUrl: 'components/gallery/gallery.html'
})
.state('gallery.views', {
url: "/{gallery:shades-of-gray|color}",
views: {
'[email protected]': {
templateUrl: 'components/gallery/partials/gallery-slider.html',
controller: 'SliderController'
},
'[email protected]': {
templateUrl: 'components/gallery/partials/gallery-img.html',
controller: 'GalleryImgController'
}
},
resolve: {
apiFactory: 'apiFactory',
drawings: function(apiFactory, $stateParams){
var param = $stateParams.gallery === 'color' ? 'color' : 'bw';
return apiFactory.getImageUrls(param);
}
}
});
...
My ApiFactory simply makes an API call and resolves the promise:
apiFactory.getImageUrls = function(gallery){
if (gallery === undefined)
var gallery = 'all';
return $http({
method: 'GET',
url: API_URL + '/drawings/' + gallery,
}).then(function(response){
return response.data.gallery;
});
};
And my two controllers use the data injected by my resolve:
.controller('SliderController', function($scope, drawings){
$scope.drawings = drawings;
...
}
controller('GalleryImgController', function($scope, drawings){
$scope.currentDrawing = drawings[0];
...
}
In Safari, I wait 120 seconds for the $http
promise to resolve, at which point I see my response with proper status code, headers etc. However (unlike Firefox in Chrome), response.data
is a string containing the HTTP headers:
I can't parse it reliably (because I'll have an Authorization
header with some responses). What gives? Why is this a problem on Safari and what can I do about it?
If it helps, here is the Express code that responds to the request:
...
getDrawingSet(gallery, (err, drawings) => {
if (err)
return next(err);
let ret = {};
ret["gallery"] = drawings;
res.status(httpStatus[200]).json(ret);
});
...
Where drawings
is just an array of JSON objects. Thanks.
Answer
Solution
The issue was on the server (obviously).
I simply changed the following line from:
res.sendStatus(200).json(ret);
to
res.status(200).json(ret);
Which can really be simplified to res.json(ret)
.
From the Express docs for res.sendStatus()
:
Set the response HTTP status code to statusCode
and send its string representation as the response body.
Contrast this with res.status()
:
Use this method to set the HTTP status for the response.
I thought I was doing the latter with the former. However Firefox and Chrome allowed me to get away with this I'm not entirely sure, but I'm certainly happy that Safari brought this error to my attention.
Related Questions
- → How to update data attribute on Ajax complete
- → October CMS - Radio Button Ajax Click Twice in a Row Causes Content to disappear
- → Octobercms Component Unique id (Twig & Javascript)
- → Passing a JS var from AJAX response to Twig
- → Laravel {!! Form::open() !!} doesn't work within AngularJS
- → DropzoneJS & Laravel - Output form validation errors
- → Import statement and Babel
- → Uncaught TypeError: Cannot read property '__SECRET_DOM_DO_NOT_USE_OR_YOU_WILL_BE_FIRED' of undefined
- → React-router: Passing props to children
- → ListView.DataSource looping data for React Native
- → Can't test submit handler in React component
- → React + Flux - How to avoid global variable
- → Webpack, React & Babel, not rendering DOM