浏览器未保存由托管在其他平台上的子域api.example.com设置的父域example.com的会话Cookie

问题描述

我的Next.js前端 example.com 托管在vercel上，并使用Apollo进行查询。

我的Django后端 api.example.com 托管在heroku上。

我认为，如果我们的后端托管在子域中，那么我可以绕开CORS问题，但是它无法正常工作，所以我放弃了，因为我对此很陌生。我最终更改了Django中的设置，以授予 example.com 访问权限。

但是随着新的chrome更新，我开始在不同的浏览器上遇到SameSite属性问题。显然，Safari将SameSite = None视为SameSite = Strict，因此解决chrome问题会在Safari中造成新问题。

在编写中间件解决问题之前，我想知道我是第一次遗漏了什么还是做错了什么。是否可以将 api.example.com （heroku）视为同一来源，以便它可以在 example.com （vercel）上设置会话cookie，而无需担心设置SameSite属性？任何意见，将不胜感激！谢谢！

CORS的当前配置：

前端

const httpLink = createHttpLink({
  uri:
    process.env.NODE_ENV === "development"
      ? "http://localhost:8000/graphql"
      : process.env.NEXT_PUBLIC_GRAPHQL_ENDPOINT,credentials: "include"
});

const client = new ApolloClient({
    ssrMode: typeof window === "undefined",link: httpLink,cache
  });

后端

MIDDLEWARE = [
    "django_samesite_none.middleware.SameSiteNoneMiddleware",'django.middleware.security.SecurityMiddleware','corsheaders.middleware.CorsMiddleware','django.contrib.sessions.middleware.SessionMiddleware','django.middleware.common.CommonMiddleware','whitenoise.middleware.WhiteNoiseMiddleware','django.middleware.csrf.CsrfViewMiddleware','django.contrib.auth.middleware.AuthenticationMiddleware','django.contrib.messages.middleware.MessageMiddleware','django.middleware.clickjacking.XFrameOptionsMiddleware',]

CORS_ALLOWED_ORIGINS = [
     "https://example.com","https://www.example.com",]
SESSION_COOKIE_SAMESITE = None
CORS_ALLOW_CREDENTIALS = True
CSRF_COOKIE_SECURE = True
SECURE_BROWSER_XSS_FILTER = True
SECURE_CONTENT_TYPE_NOSNIFF = True
SECURE_HSTS_INCLUDE_SUBDOMAINS = True
SECURE_HSTS_SECONDS = 3600
SECURE_HSTS_PRELOAD = True
SECURE_PROXY_SSL_HEADER = ('HTTP_X_FORWARDED_PROTO','https')
SECURE_REFERRER_POLICY = 'same-origin'
SECURE_SSL_REDIRECT = True
SESSION_COOKIE_SECURE = True
X_FRAME_OPTIONS = 'DENY'
ALLOWED_HOSTS = ['api.example.com']

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）