When sending cookies as a response to a request in an included functions API (as part of a static web app), the cookies are not sent if they include the sameSite or domain properties. This only occurs in a deployed static web app - this issue is not present in local testing of the API functions.
To Reproduce
Steps to reproduce the behavior:
Create static web app with an API. Host it on Github and use a GH workflow to deploy to Azure static web apps.
Set a cookie on the response with the sameSite: true or domain: "domain.com".
Deploy static web app.
Visit static web app API page (eg. /api/test) and inspect cookies in browser.
Observe that the cookie was not set.
GitHub Actions workflow YAML file and staticwebapp.config.json files: files.zip
Expected behavior
The cookie should be set, just like how it works when testing API functions locally with func start.
Related
So I'm trying to deploy my website which works well when in a local environment, but when it is deployed to Cloudfront, it can't seem to access cookies.
My frontend tech stack is as follows: Angular site hosted on S3, cloudfront distribution in front of it, custom domain name with a valid ssl certificate.
When the user navigates to the login page, they can successfully submit the forum, and the server responds with a JWT token in the Set-Cookie header.
After this though, in the angular site it says that the access-token cookie does not exist. The strange part here is that on subsequent requests, the access-token cookie is in fact forwarded back to the backend. (In the image below, the login button was pressed again, so the response cookie is the same as the request cookie.)
I've ensured that HttpOnly is not set, and that the frontend and backend are both hosted under the same root domain frontend.root.com and api.root.com.
Cloudfront has been configured to forward the access-token cookie:
cache policy:
origin request policy (note that it still did not work when I had this set to forward all cookies and not just the access token):
Response headers settings:
So in my angular site, after the /login api call resolves, I use the ngx-cookie-service to check and try to retrieve the cookie.
this.cookieService.check('access-token'); // checks if it exists, returns false
this.cookieService.get('access-token'); // returns '' meaning the cookie does not exist
Any ideas on how to resolve this issue and access the cookies from within my angular site? I can provide more information on my configurations if needed. Thanks!
As you can barely make out in the screenshot the Cookies have the domain set as something starting with a suggesting that it is api.root.com, most importantly it is not frontend.root.com and not root.com.
The server needs to set the domain of the cookie to root.com for it to be available to all subdomains of it.
I am using authcodeflow with PKCE.
Using OIDC js library in the frontend, making calls to adfs getting an auth code and then calling my backend api. The backend api which calls adfs server get the access token and the backend api returns the token as a cookie to the frontend. I can see the cookie in response headers. but That cookie is not stored in browser and not getting added for subsequent requests. I have tried with samesite with all modes -> Lax, None,Strict and not setting.
Is this an issue with OIDC js library or is it blocking the cookies to store in browser?
Update:
Below are the observation with my analysis
Since the OIdc-client-js does not have an option to set flag "withCredentials" to true for the requests. There are no cookies send in the request and response cookies are ignored for the cross origin requests.This changes are marked as enhancement and still not completed in thier github repo.
https://github.com/IdentityModel/oidc-client-js/issues/1062
Is there any way to achieve with this library? or any other libraries for OIDC js
https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/withCredentials
So you are issuing a cookie from an API domain that is a sibling of the WEB domain:
web.mycompany.com
api.mycompany.com
Cookie domain = .mycompany.com
POSSIBLE CAUSES FOR COOKIE BEING DROPPED
Maybe it is the withCredentials flag or maybe due to a lack of user gesture, since the user has not done anything explicit to navigate to api.mycompany.com, such as a browser navigation or clicking a link?
FORCING WITHCREDENTIALS
You can override the prototype like this in order to add the withCredentials property. This is a little hacky but you could limit usage based on the URL and it should let you know whether setting withCredentials resolves your problem:
let open = XMLHttpRequest.prototype.open;
XMLHttpRequest.prototype.open = function(method, url) {
open.apply(this, arguments);
this.withCredentials = true;
}
PROXYING VIA WEB DOMAIN WILL HAVE FEWER COOKIE ISSUES
In my blog post I do something similar to proxy messages containing a refresh token. I use the web's exact domain though, rather than using an API subdomain. This will never be impacted by browser restrictions.
We are using Azure AD and have an application registered for authentication. The application is a ASP.net server side and Angular client side application. Initially this was setup with an implicit flow, but that rocked the web browsers cross site cookie protection. The authentication worked, but only if the browser was explicitly allowing third-party cookies.
Microsoft documentation specifies that Single Page Applications can overcome this issue when using Authentication Code Flow. To make this work we implemented angular-auth-oidc-client (instead of msal-angular which is yet to support auth code) with a configuration that is closely matching their provided sample program. The ASP.net application uses Microsoft.Identity.Web and its settings have been changed to have a code response type.
The Azure AD Application Registration was amended in line with the Microsoft documentation. I have included a screenshot of the page highlighting the implicit flow is disabled and the SPA Redirect URI is eligible for Authorization Code Flow with PKCE.
However when blocking third party cookies in the browsers, the authentication fails basis the CORS policy (Safari, Chrome and both in private browsing). When allowing third party cookies in the browsers the authentication is successful.
Question What could we investigate as the cause for not complying with the CORS policy?
Microsoft.Identity.Web configuration:
"AzureAd": {
"Instance": "https://login.microsoftonline.com/",
"TenantId": "organizations",
"ClientId": "removed_our_azure_ad_client_id",
"CallbackPath": "/signin-oidc",
"SignedOutCallbackPath ": "/signout-callback-oidc",
"ResponseType": "code"
},
Based on the images you have shared the redirecturi http://localhost:5000 is for SPA applications and http://localhost:5000/signin-oidc is for web application.
But In your configuration file CallbackPath is for web application.
Authorization Code Flow with PKCE is designed to work only for single page applications. Please go through Prerequisites
Please use CallbackPath with URL given for SPA application to fix the issue.
While developing a phonegap application, I can see the SetCookie header in responses from XHR login requests to an API I am using. As expected, when I inspect subsequent requests, I see the cookie being sent. I can also see that it is an httpOnly cookie, so I can't store it using scripts.
However, in the Chrome dev tools "Resources" I have no trouble deleting the cookie if I want to.
Yet, when I am running the application on an external iOS or Android device, using the Safari or Chrome Web Inspectors for each respective device, I can't see the cookies in the "Resources" panel. I don't see the cookie headers in requests or responses, either, yet somehow my requests are fine.
Is this a security measure, or is there an bug in my app/API to do with cookies?
Found an issue Forms authentication Cookie not sharing between the requests to service.
Cookie '.ASPXAUTH'generated and sent to Browser from the Login service successfully, but not sending the Cookie to consequent requests for the same service.
Found When Calling service from Cloud app the request using HTTP 1.1 and for Response it is HTTP 1.0
More observations with the user of Fiddler and other tools:
Working fine for the following circumstances:
Running Service and Client website from local development system
Hosting Service and Client on same IIS (local and remote)
Accessing based on URLs, cookies transmitted properly
Not working for the following circumstances:
Hosting service and Client in different IIS servers.
Hosting Service in IIS (or Azure) and Client from local development system
Some more details:
Both requests made for the same service i.e. same domain, same protocal, same port nr, etc.
Updates at 20-12-2012 15:14:
As I said earlier Login functionality working on Ajax call without fail, Fiddler shows the Set-Cookie on Response, but Browser not reading the Cookie.
Tried to read document.cookies on "complete:" event of $.Ajax(), where I unable to read the cookie. means browser not getting or holding the cookie (where Fiddler shows on the Response of the same)
Regards,
Ramakrishna
Using the Forms Auth, have you performed some actions to take the ASP.NET Session out of process and out of server?
You cannot share the session between servers, so you have to either use SQL Session State provider and put session into SQL Azure, or use the Windows Azure Cache and provided Session State Provider to storage the session into a cache.
I'm sure you are good in using internet search engines, but here is a list of good articles to start with (taking the session out of process):
http://msdn.microsoft.com/en-us/wazplatformtrainingcourse_buildingappswithcacheservice_topic3.aspx
http://msdn.microsoft.com/en-us/library/windowsazure/gg185668.aspx
http://msdn.microsoft.com/en-us/library/windowsazure/gg278339.aspx