Cookie is not sent with JavaScript on POST request - javascript

I want to use a secure cookie which is stored by the browser when accessing the endpoint /access on my website. The cookie is saved during the login process and I made sure that my website runs on a subdomain of my backend (which creates the cookies for the clients).
My backend is running on www.welovecoding.com and my web application is hosted on webapp.welovecoding.com.
The cookie which I receive from my backend looks like this:
Set-Cookie:user_id=RLXXWNCGAyVBmnogfiE1ngFCpBRKA48YaFOGyrPypwvU3eZCA==;
Path=/access; Expires=Tue, 29-Sep-2015 17:37:11 GMT;
Domain=.welovecoding.com; HttpOnly; Secure
What I want to do now is a POST request on www.welovecoding.com/access with my cookie as authentication credentials. I am sending withCredentials when executing my AJAX request with jQuery:
$.ajax({
crossDomain: true,
type: 'POST',
url: "http://www.welovecoding.com/access",
xhrFields: {
withCredentials: true
}
}).done(function (data, textStatus, jqXHR) {
console.log("Response", data);
});
But I still do get a HTTP error 403 which says that the cookie is missing. Does anyone know why? Maybe because the cookie has HttpOnly and Secure set?

Yes, it's because the cookie has Secure set - and you are posting to http
;secure (cookie to only be transmitted over secure protocol as https)
https://developer.mozilla.org/en-US/docs/Web/API/document.cookie

Related

Cookies are being blocked with my fetch call

This is my fetch request:
fetch(`${process.env.REACT_APP_API_DOMAIN}/auth/user/full`, { method: "GET", credentials: "include" })
It should send my session cookies, but im getting this error in the request cookies on network tab in chrome:
This means my backend doesn't recieve the cookie and thinks the user is not authenticated.
So it was my backend cookie settings. I tried to set sameSite: false (what it says in the docs of cookie) but turns out proper way is sameSite: "none". The library i use is cookie-session which refer you to cookie docs for sameSite.

Send Ajax Request For Sending Post Data One Url to Another Url Without Getting CROS ERROR

-> Please Help Me To Solve The Problem
-> I Send Data To Another URL for Process Something And That Web Page is another Server and Different URL.
-> When Ever I Try To Send Post Data That time i Faced CROS Error i try many ways.
-> See My Code
$.ajax({
type: 'POST',
url: 'Another Non Https Url',
crossDomain: true,
contentType:'application/json',
data:{CompanyEmail:CompanyEmail,CompanyName:CompanyName,CompanyPhoneNumber:CompanyPhoneNumber,AccessToken:AccessToken},
success: function(){
alert("Success");
},
error: function(){
alert("Failed");
}
})
CORS (meaning "Cross Origin Resource Sharing") is a server-side mechanism to allow exceptions in the so-called Same-Origin-Policy. Otherwise processing data from another origin is prevented.
You have to explicitly enable CORS for your client within your server.
This can't be fixed in your client-side jQuery-Code.
PHP-side you are able to activate CORS for all clients by using
<?php
header("Access-Control-Allow-Origin: *");
?>
though.

How to mantain cookie from different subdomain?

I have a simple html page served from my local machine by an app running on port 8000, using the domain appdev.my_company.com.
The same app serves an API from the domain appcenter.my_company.com.
I have an endpoint in said API which sets a session cookie header that looks like this:
Set-Cookie:gac_3_6e...="VC1_69...=="; Domain=.my_company.com; Path=/
I made an ajax request to said endpoint, from the static page, hoping that the cookie would be set since the domain is the same (only the subdomain differs):
/* In http://appdev.my_company.com:8000 */
$.ajax({
url: "http://appcenter.my_company.com:8000/login/",
method: 'POST',
data: JSON.stringify(data),
success: function(){
console.log("logged in");
},
headers: {
"Content-Type": "application/json"
}
});
But it doesn't.
The cookie needs to be associated in the browser window with the current domain, because we need to reload a plugin that picks up this cookie (the cookie comes from a thrid party server).
How can I get this cookie to be registered in the browser? If I look into the resources tab of the web console, no cookie shows up.
I took a look at domain matching of the RFC6265, and it appears this should work.
What can be wrong in this case?
Please checkout CORS. This is the exact problem they try to solve. The only other way (to my knowledge) is to proxy the requests to the other source via your server.

How to send a cross-domain ajax request with cookies

I'm developing a SaaS application, users create account and login in my SaaS system. Then, the SaaS application has a JS code that customers should include this JS code in their websites, and inside the code I need to send a POST Ajax Request to my SaaS domain (it's a cross-domain request).
The problem is that in order to share the credential of logged-in users, I have to set withCredentials property and Access-Control-Allow-Credentials header to true.
I'm not sure whether this is a good approach or not? Maybe I should use another approach like using OAuth or something to share the logged-in users credential...
I will appreciate any advices.
You need to be using JSONP as your type:
$.ajax(
{
type: "POST",
url: "http://test.com/api/getlist.json",
dataType: 'jsonp',
xhrFields: {
withCredentials: true
},
crossDomain: true,
beforeSend: function(xhr) {
xhr.setRequestHeader("Cookie", "session=xxxyyyzzz");
},
success: function(){
alert('success');
},
error: function (xhr) {
alert(xhr.responseText);
}
}
);
To enable cross domain requests with credentials, your server should support CORS. With CORS enabled your client code can add the withCredentials set to true to include cookies in the requests.

Javascript: remove a cookie that was set by an ajax response

in my Webapp (that is running at localhost/myApp/), I have an ajax call like:
$.ajax({
type: "GET",
url: "http://localhost:8080/my.module/Login/login?user=abc&password=123",
xhrFields: {
withCredentials: true,
},
success: onResult,
error: onError,
});
to login on the server. The server responds with a boolean value if the login was successful and the response also contains this header:
Set-Cookie: JSESSIONID=167C57FA1E3529433938E744F7C4AC52; Path=/my.module
With the previously set xhrField "withCredentials: true", the browser automatically handles the cookie and appends the Cookie header in all following requests:
Cookie: JSESSIONID=167C57FA1E3529433938E744F7C4AC52
This works perfectly fine. But now I have the problem, that the server has a bug so it doesn't remove a session when calling the logout interface, a session can't be closed (and I don't have access to the server). In order to logout properly I would have to remove the session cookie on the client so I would get a new one from the server. But i can't find a way to access or remove the cookie, the document.cookie variable is empty in my webapp. I also tried to read the document.cookie variable from localhost/myApp/my.module/ and localhost/my.module/, but it is always empty. Another thing i tried was overwriting the cookie with
document.cookie = "JSESSIONID=ABC; Path=/my.module";
but the server requests still have the cookie from before. Can anyone tell me how i could remove it?
I know this solution would be a hack, but that's what I'm looking for, because the server programmers can't fix the bug in time and asked me to implement such a hack on the client.
"An HttpOnly cookie is not accessible via non-HTTP methods, such as calls via JavaScript " -http://en.wikipedia.org/wiki/HTTP_cookie#Secure_and_HttpOnly
First of all, the client javascript shouldn't care about the cookie.
When the server sees a login request, it creates a new cookie and calls Set-Cookie.
On receiving any other ajax request, server validates the current cookie, before serving the request.
On logout request, it will clear the cookie from its (server's) session info i.e. any further requests from the client with the same cookie will fail since its not in the server store.

Categories

Resources