Why sometimes Angular JS is getting 401 right after logged? - angularjs

I have the an Angular JS app (front-end) that communicate to Laravel app (back-end).
I'm stuck in this issue, not always happen but when it does, right after I authenticate some of random requests get 401 (Unauthorized). But if I access the same url using postman it work perfectly.
I'm not sure what show as code, so here's some details that could be valid:
At the Angular JS I have 25 different uri (xhr) to my back-end.
I'm using $httpProvider.interceptors to add the headers:
'Accept': 'application/json',
'Authorization': (AuthService.valid() ? `Bearer ${AuthService.get().token}` : ''),
'Content-Type': 'application/json',
'X-Requested-With': 'XMLHttpRequest'
I'm using JwtAuthenticate at Laravel.
Sorry for low description, if you need some more please tell me.

Did you got this sorted out already? I am experiencing an issue that is very similar to this.
I have a Laravel application and when I log in and open a modal that does an ajax call, it will randomly result in a 401 error and I'm logged out. There is no real pattern when this occurs.

Related

Axios NTLM doesn't work on POST (but work with GET)

I need to auto login on my React App. To do this, I use NTLM authentication. Both , API (php coded) and React App are on an IIS server.
I use axios for API calls. When I do GET request, all is right, crendentials are successfully sent (but I must disable anonymous login on IIS).
When I use POST query, it fails with 401 error.
I tried several headers but nothing works. That's why I need help.
Image : Nothing weird in headers
When I do GET, I see cookie sent, not with my post query
axios.post(apiUrl+'deleteUserReportFolder.php', {
reportFolder: e.target.value,
id: user.login
},{
withCredentials: true,
credentials: 'include',
headers: {
'Content-Type': "application/json",
'Authorization': 'NTLM',
'WWW-Authenticate': 'NTLM'
}
})
The API Site is sending these HTTP Response Headers:
Image : IIS API
Thanks for your help. I've seen a lot of posts but nothing worked.
Edit :
I tried by setting my server (API PHP) with anonymous and Windows login, anonymous login cause no logon user, so I must set Windows enabled only.
I tried by removing all headers except "withCredentials" in axios query. I still have 401 error on CORS Pre Flight.
var_dump($_POST);
Check this code,May be it's helpful!

Can some one hack API calls of React Native or any traditional JS Native Apps

Let say i have a post api call like this
fetch('https://mywebsite.com/endpoint/', {
method: 'POST',
headers: {
Accept: 'application/json',
'Content-Type': 'application/json',
},
body: JSON.stringify({
firstParam: 'yourValue',
secondParam: 'yourOtherValue',
}),
});
can some one decode this android react app via dex2jar and something like this and snipe the apis calls..
how can we secure the api calls via server side auth and also from snipping
Yes it is possible, since your browser will show each call done by your app, using chrome you could openthe chrome dev tools and have a look at the network tab.
However there is many way to protect this (you cannot hide it, but you could definetly protect it from unwanted access), probably the most popular are this two :
Cors
Authorization Header`
Plus someone can always open up the app and take a look at you MAP file and get your keys as well.

AngularJS OPTIONS request to Web API lost

I am trying to make a post request from AngularJS to WebAPI on a different domain.
$http({
method: 'POST',
url: 'http://www.test.com/api/app/controller',
data: postdata,
headers: {
'Content-Type': 'application/json'
}
})
.then(function(response) {
// Do stuff
}, function() {
// Show error
})
.finally(function() {
// Cancel loading indicator
});
I believe Web API is setup correctly to handle CORS requests. If I make a CORS OPTIONS request using Chrome Advanced REST client, the correct headers and a 200 response code are returned.
When I make the POST call above, a preflight OPTIONS request is made. This always times out with a 504 code. The logging in my Application_BeginRequest is never hit (which it is when calling from Chrome plugin).
What is the difference between calling from AngularJS and the Chrome plugin? Both are being run from the same machine and AngularJS is running in an application on localhost. The same headers are being set in both calls.
This was a stupid mistake on my behalf. I am answering the question (rather than deleting) in case somebody does the same.
I was pointing to a service containing a typo:
url: 'http://www.test2.com/api/app/controller',
Instead of:
url: 'http://www.test.com/api/app/controller',
My CORS pre-flight request was working without an issue, it was just never getting to the right server.

401 on Yammer image request

We're trying to integrate Yammer on our website, getting and putting posts is done, but we have an issue with getting images.
When the user is logged into Yammer, we can show the images with no problem.
When the user is not logged in to Yammer, the image request will give a 401 Unauthorized.
We tried getting the image blobs dynamically by adding an Authorization header, but CORS will block us this way.
Could anyone give some pointers on how to resolve this issue? Thanks in advance!
var req = {
method: 'GET',
url: 'https://www.yammer.com/api/v1/uploaded_files/123456/preview/IMG-20160413-AA0001.jpg',
headers: {
'Authorization': 'Bearer ' + yammertoken
},
responseType: 'blob'
}
return $http(req)
In the end we created a proxy in our PHP backend which was able to get the images serverside. This circumnavigated the CORS issue.
I would highly suggest not trying to subvert authentication for data. Data such as files live behind authentication in order to ensure that only the users who are allowed to see such data can do so.
Have you explored using https://developer.yammer.com/docs/authentication ?

angularjs preflight request fails to load data

I am developing a single page application using Angularjs framework.
inside my homeController i use a service call as below
$http({
method: 'POST',
url: 'http://localhost:1530/api/Profile?username=sa&password=da',
data: { Email: "dmytest#test.com", Password: "saas" },
headers: {'Content-Type': 'application/json'}
}).success();
The problem is that when i am making a api call the browser initiates a preflight request with method options instead of post.
Server responds with all required headers.But the actual call is not done.Preflight request initiates only when using "Content-Type:application/json".
I am posting Json data to server.
Is there any way to either prevent the preflight request nor making a successfull api call?
It is working fine on mobile as well as on ajax call.
Thanks in advance.
Depending on you browser, try forceCORS
Chrome: https://chrome.google.com/webstore/detail/forcecors/oajaiobpeddomajelicdlnkeegnepbin?hl=en
Firefox: http://www-jo.se/f.pfleger/forcecors
Also ensure you have enabled CORS on your Server side. I reference here some examples. Please find out what you platform offers:
JAX-RS: http://www.developerscrappad.com/1781/java/java-ee/rest-jax-rs/java-ee-7-jax-rs-2-0-cors-on-rest-how-to-make-rest-apis-accessible-from-a-different-domain/
JAX-RS: http://cxf.apache.org/docs/jax-rs-cors.html
Nodejs: http://www.bennadel.com/blog/2327-cross-origin-resource-sharing-cors-ajax-requests-between-jquery-and-node-js.htm
Hope this helps.

Resources