cookie sets in postman but not in browser on localhost - vue.js

I have an issue with cookies setting in postman when I make a post request to my route to login but unfortunately when I use the same info to login via my vue frontend I don't get a set cookie header in my browser or a token but rather it just returns and API key with a value....
not sure if anyone can help explain why this might be the case. Does postman run on localhost itself by default or do they use their own servers to route requests? just wondering if maybe that's the issue?
here's the code I am using to touch the endpoint in my view endpoint
Note: I have a separate axios file with the root url so the route only shows as /login just to clarify
async handleSubmit(){
const response = await axios.post('/login', {
email: this.email,
password:this.password
});
console.log(response)
}
inside my console when logging it only returns an api key instead of a session id.
trying to dig around the postman docs to see if I can somehow use this key to get a session ID?
https://learning.postman.com/docs/sending-requests/authorization/#api-key
any help is greatly appreciated :)

Related

Is it possible to set an HttpOnly Cookie from one domain to another subdomain

I originally posted this question here: https://security.stackexchange.com/questions/255737/is-it-possible-to-set-an-httponly-cookie-from-one-domain-to-another-subdomain
Please keep in mind that this question is specific to cookies with the HttpOnly flag set to true.
I am pretty sure that the answer to my question is no, but I have been have a hard time finding an answer through official documentation or other posts here. Here is simple use case for some context:
Python backend web application (api.domain.com)
Frontend JavaScript SPA (app.domain.com)
post requests to api.domain.com/api/auth/login/ made from app.domain.com using axios with the correct username and password return a response with an access JWT token in the body and the response sets a refresh cookie with an HttpOnly flag [should fail, since I believe that the cookie cannot be set on app.domain.com from an API request to api.domain.com? -- this is my question]
the access token is stored in memory and passed with each API request
requests made to api.domain.com/api/auth/refresh/ are sent on a schedule to refresh the short-lived access token.
I typically host the frontend app and backend app on the same subdomain (app.domain.com) and do path-based routing with something like CloudFront or nginx, and this works well. For example, all requests starting with /api/* are sent to the backend, and all other requests are sent to the frontend app. Trying to use a separate subdomain for the API seems to fail no matter what options I use for setting the cookie on the server.
Can someone help me confirm that it is in fact not possible to set an HttpOnly cookie on a subdomain like app.domain.com from an API request hosted on api.domain.com? It would be great if anyone can also help me find where this could possibly be found in official documentation.
Searching for set httpOnly cookie across subdomains, I haven't found anything directly relevant. I also didn't find anything in these resources that directly answers my question:
https://owasp.org/www-community/HttpOnly
https://learn.microsoft.com/en-us/previous-versions//ms533046(v=vs.85)?redirectedfrom=MSDN
This is possible. In fact I just did it.
On your frontend, using Axios:
const baseURL = 'https://api.example.com';
const api = axios.create({
baseURL,
withCredentials: true,
});
On your backend, using Express:
app.use(
cors({
origin: 'https://www.example.com',
credentials: true,
}),
);
app.post('/login', async (req, res) => {
res.cookie('someCookie', someCookieValue, {
secure: true,
domain: 'example.com',
httpOnly: true,
});
});

STRAPI: Using auth0 for API Authentication in Strapi works and works not

Node: v12.16.1
Strapi: 3.0.0-beta.20.1
I'm new to strapi and have to say at first: I love it!
I want to use Strapi in addition with Angular 9 and for authentication I want to use Auth0.
For my setup with Auth0 I followed the guide in the strapi documentation and customizied my permissons.js in the user-permissions plugin.
Well!
I have a very confusing issue.
When I get back my access_token from Auth0 I put it to my calls as bearer authentication token, the request to the strapi endpoint works mostly for the first time, maybe sometimes the second and many more calls also, and then it fails. If I wait a few seconds then it works again, and after a successful call also it fails again. (also testing outside my angular-app with postman - same behavior)
If I work with the strapi jwt, it works permanantly, independet from my frequency of requests.
This is confusing me since a couple of days.
My response from strapi if it fails is
Invalid token: Token did not match with Strapi and Auth0 as catched in the error part.
If it would never work I would have to say I'm doing something wrong, but it works sometimes, so I would say my way is technically correct. But of course I will do something wrong.
Has everybody else had an issue like that by authentication with Auth0 and strapi and understand what I try to explain?
Here is my snippet of code (I would say exactly copied from docu with a bit personalization):
...
try {
const data = await axios({
method: 'post',
url: 'https://my.eu.auth0.com/userinfo',
headers: {
Authorization: ctx.request.header.authorization
}
});
console.debug('data from Auth0: ' + JSON.stringify(data.data));
// if you want do more validation test
// feel free to add your code here.
return await next();
} catch (error) {
return handleErrors(ctx, new Error('Invalid token: Token did not match with Strapi and Auth0'), 'unauthorized');
}
...
I hope anybody had a similar issue and any idea how this can be fixed. Maybe it is an issue in Auth0.
You'll have to update url: 'https://my.eu.auth0.com/userinfo' replacing my.eu with your actual subdomain on auth0.

Cross-Origin Request Blocked error in HTTPS request

I have a standard HTTPS Axios request from my Frontend (which is based on Vue), to the our company's API which is on another server(server use SSL sertificate).
testApi() {
axios.get('https://rng-hub2.staging.rng:8001/rng/3/')
.then(function (response) {
// handle success
console.log(response);
})
.catch(function (error) {
// handle error
console.log(error);
})
.finally(function () {
// always executed
});
},
Which cause an error like this:
In Firefox:
In Chrome the error looks like this:
As I was thinking, in browsed developing tools under tab of Netwerk -> Response, I should also see an error, which is true for Chrome, but eventyally is not true for Firefox.
So Chrome shows me:
But in the Firefox I receive my data in exactly right format:
Have any idea how I can retrieve this data correctly and assign it to the response variable in .then section?
About Cross-Origin Request Blocked error: API's server administrator told me, that he have added my IP to the CORS "trusted list". However I'm not sure, because according to this post: https://jonhilton.net/cross-origin-request-blocked/
in my Response Header I should receive an additional header with my local IP like:
Access-Control-Allow-Origin: http://192.168.32.44
But I'm not.
This proxy staff also didn't work:
How to deal with CORS error on Vue CLI 3?
Please give me hint what am I doing wrong
Found the solution. The problem was deeper then I thought. So short answer is: If you are working in local network, with different API servers, they might be certified with inner corporate CA (Certificate authority) to be able to communicate via HTTPS protocol. So what you need is, to ask from your server administrator to give you private_key with which you gonna sign all the request to a specific API. In guzzle its looks like this:
new GuzzleClient(['verify' => '/path/to/self-signed/cert.pem']);

Why can't add headers to axios.get?

I'm using axios and vue.js to play with the Fortnite Tracker API.
In their documentation it's clearly said that we need to include the "TRN-Api-Key" in header.
I tested with Postman and It works.
And this is my axios function to make the request:
let url = `https://api.fortnitetracker.com/v1/profile/${this.platform}/${this.username}`;
// username and platform are from my Vue Component.
axios.get(url, {
headers: {
"TRN-Api-Key": "xxxxxxxx-xxxx-xxxx-xxxx-xxxx" // of course from my account on their website.
}
})
.then(response => console.log(response.data))
I expect the output in json like in Postman but I had a 404 Error: "Network Error".
And in the Browser Network Debug I can't see the request header 'TRN-Api-Key'.
[EDIT]
If your app is running on a server you can write a short PHP-Script and use curl in it to access the API (I think it's even possible to generate PHPcode from Postman).
Just address this script with axios and submit your platform and usernameproperties to build the right url.
Or have a look at this post alternatively. Maybe the use of an other API like #kecinotrab provided in the acceptet answer will help you too.

Ember.js REST Auth Headers

I've been struggling with this for too long now. I have an Expressjs server that provides an endpoint to login. The response I get has a JWT token, expiring in an hour. All good.
On the Emberjs side, I can successfully authenticate and get the token (using ember-simple-auth and ember-simple-auth-token). This works well for protecting my routes. But I can't for the life of me update the RESTAdapter headers to include my new authorization token.
I've tried:
using $.ajaxPrefilter to set the Authorization header. Didn't work
accessing "this.get('session.secure.token')" from the RESTAdapter. Thats undefined.
Please, if someone could point me in the right direction, I'd be eternally grateful. All I need to do is attach the value in "session.secure.token" to the header for all RESTAdapter requests.
Thanks
You should be able to set the simple-auth config property authorizer to simple-auth-authorizer:token - in the simple-auth code it looks for this config property, looks up simple-auth-authorizer:token and uses this in combination with ajaxPrefilter.
// config/environment.js
ENV['simple-auth'] = {
authorizer: 'simple-auth-authorizer:token'
};