TL; DR . Reading access to cross-domain cookies is not possible. Solving the problem of adding a CSRF token to the response header. Another solution to completely bypass CORS requests and cross-domain requests would be to use a reverse proxy.
Problem
As stated in my question above, the JavaScript part of my interface (e.g. https://example1.com trying to access a non- HttpOnly cookie from my internal server, e.g. https://example2.com ). To have remote API access with JavaScript, I use CORS. This allows you to skip requests. I use withCredentials: true on the interface side and Access-Control-Allow-Credentials: true on the server side. The Set-Cookie header then sets the cookie in the source code, not the source beginning. Therefore, the cookie does not appear in DevTools or in the document.cookie command in JavaScript.
Cookies set at the source end are always part of the inner loop request via CORS. However, I need access to the CSRF cookie content to add a token to the request header (to prevent CSRF attacks). As I found out, there is no way to read (or write) cookies from another domain using JavaScript - no matter what CORS setting is used (see these StackOverflow answers: [1] , [2] ). The browser restricts access to the contents of the cookie to the origin of one domain.
Decision
This leads to the conclusion that there is no way to access the non HttpOnly cookie content of another domain. A workaround for this problem is to set the CSRF token in an optional custom response header. Usually these headers also cannot be accessed in another domain. However, they can be set as the basic setting for CORS Access-Control-Expose-Headers . This is safe if you use the strictly limited Access-Control-Allow-Origin header.
Another workaround would be to use a reverse proxy, which generally circumvents problems with CORS and cross-domain requests. Using such a reverse proxy provides a special path on the interface that will be redirected to the internal server (server side). For example, https://front-end/api calls are proxied to https://back-end/api . Since all requests from the external interface are made by the front proxy server in the same domain, the browser processes each call as a request of one domain, and cookies are directly set at the initial start. The disadvantages of this solution include potential performance problems due to the fact that the other server is located between them (delay), and cookies must be set on two sources (log in twice when directly accessing the internal content). Setting up a reverse proxy server can be done using nginx, apache, or also very easily using http-proxy-middleware in Node.js:
var express = require('express'); var proxy = require('http-proxy-middleware'); var options = { target: 'https://[server]', changeOrigin: true, secure: true }; var exampleProxy = proxy(options); var app = express(); app.use('/api', exampleProxy); app.use(express.static(__dirname + "/public")); app.listen(process.env.PORT || 8080);
ssc-hrep3
source share