I'm trying to get the header of a HTTP-Response.
I can get the header on the iPhone without any problems.
But my browser just gets null. Using the Safari Developer Console I can see, that there is the header I want to get. Somehow I can't get the header in AngularJS.
$http.post("/login", loginData)
.then(function(response){
console.log(response.headers("X-AUTH-TOKEN"));
})
Related
Headers in Response when I log in browser:
log of headers in browser
This is the response I get in Network of browser Developer Console:
headers in browser's network tab
method to download the file:
method to download the file
I'm trying to get content-disposition header which is available in the Response Headers of the POST Request
I am stuck in a problem where I am posting an object, in response I should get some header from the HTTP response. The problem is this code is working fine in browsers like Chrome, Firefox, IE but it returns null in case of Safari (Windows).
$http.post(url, data)
.then(function(response){
console.log(response.headers("location"));
// response.headers("location") is null in Safari
});
Below are the response headers I am getting from the server.
Access-Control-Allow-Credentials:true
Access-Control-Allow-Origin:http://localhost:5000
Access-Control-Expose-Headers:ETag,Location
Content-Length:0
Date:Mon, 15 May 2017 12:46:14 GMT
Location: //my API
Server:Microsoft-IIS/8.5
X-Powered-By:ASP.NET
Maybe your safari is an old version that works according to the old recommendations that every custom header must be prefixed with X-
see this link:
enter link description here
I'm trying to make a simple Angular "$http.post" request to a basic registration REST API, but when I check the network tab (developer tools) in Firefox, the POST request is missing.
$http.post('http://example.com/api/user/userregistration', $scope.userInfo).then(function successCallback(response){
console.log(response.data.object, status);
$scope.processing = false;
$scope.processed = true;
},function errorCallback(response){
console.log(response.config, response.data);
});
I do see a HTTP OPTIONS pre-flight request with 200 OK response, but no subsequent POST request seems to work.
I also tried making a Jquery Ajax POST request to the same API but to no avail.
The same Angular code works perfectly fine in Chrome & Safari (OSX Sierra).
I have attached the screenshot of the OPTIONS request which is returning 200 OK but the subsequent POST request is missing (no errors in console)
Please help troubleshoot the above and suggest if I'm missing something obvious.
Ok found the problem and solved it.
The problem:
The Firefox browser installed in my OSX machine was not showing any error, hence I was unable to troubleshoot.
Checked the same POST request from a Firefox in Windows machine, fortunately saw an error saying:
Cross-origin request blocked. (Reason: invalid token "multipart/form-data" in CORS header "Access-Control-Allow-Headers")
The above error means Firefox does not treat "multipart/form-data" as a valid entry in "Access-Control-Allow-Headers" HTTP response header. (However, Chrome & Safari seem cool about it!)
The Solution:
Removed "multipart/form-data" from the "Access-Control-Allow-Headers" HTTP response header and Voila it worked in Firefox as well!
Mixed Content: The page at 'https://www.example.com/dashboard' was
loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint
'http://api.example.com/inventory/10/'. This request has been blocked;
the content must be served over HTTPS.
We have this Angular web app that runs with Flask on the back-end.
Everything was working fine until we implemented SSL. Afterwards, we keep getting this strange error everywhere.
Now, the $http.get request in my dashboard.js is definitely calling "https://api.example.com/inventory/10" in the code below and yet the error is claiming that we are trying to request "http" instead.
$http.get($rootScope.baseUrl+'/inventory/' + item.id)
where rootScope.baseUrl is "https://api.example.com".
It's really weird because some GET requests ARE going through from our web application to our back-end, but some requests are throwing this weird error.
Here's the header that gets an error in our Network tab of the console in chrome.
Request URL:https://api.example.com/inventory/10 Request Headers
Provisional headers are shown Accept:application/json, text/plain, /
Origin:https://www.example.com
Referer:https://www.example.com/dashboard
It was a weird case that came down to removing a forward slash from the end of a URL fixing everything. Somehow, whenever we made a GET request using $http in Angular like baseurl + inventory.id + "/", it would make a http request but as soon as remove that slash, it would make the https request correctly.
Still so confused
I think the root of the problem is in server redirects. I was able to resolve same issue with SECURE_PROXY_SSL_HEADER = ('HTTP_X_FORWARDED_PROTO', 'https') setting for Django (its running behind AWS balancer). Here is documentation.
Trying to do some basic REST services from angular, but all I get back is an empty error response.
I open the index.html directly on my PC (not sure if this is the issue), and then click 'login' which eventually calls my controller:
$scope.doLogin = function()
{
var pr = $http.get('http://localHost:7777/BuilderDBSvc/login', {params: {user: $scope.userid, pass: $scope.password} })
.success(function(data)
{
console.log(data);
domains = data;
})
.error(function(data, status, headers, config)
{
console.log(data)
console.log(status)
console.log(headers)
console.log(config)
});
pr.then(function(data)
{
$scope.user = data.data;
});
};
Using firefox to debug, I put breakpoints inside all 3 functions: success error and then. But only 'error' is triggered. And the request always shows up in red, but with a 200 response code. The response data shows a size of 23 bytes, but the value is always blank.
However, if I type the URL and parameters directly in my browser window, it works fine, and displays the expected json string.
Ive used this pattern before, but with nodejs and angularjs working together. but this time the REST provider is a non-java application. I would suspect that is the problem, but when I enter the REST url directly in my browser it works fine.
What am I missing here?
Are there any better tools i can use to help debug this?
note:
yes this is a very insecure way to do authentication, but its my starting point.
Is highly probable that your ploblem is by opening the index.html from your explorer because the request will not come from localhost and by that the localhost server will block the request against cross origin request in chrome console youll probably see a message saying
XMLHttpRequest cannot load 'http://localhost:7777'. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'your index.html location' is therefore not allowed access.
to avoid that you should make request from http://localhost to http://localhost (same server) or tell your server to accept cross origin requests