axios.defaults.withCredentials = true 使 api 响应瘫痪答案

【问题标题】：Axios.defaults.withCredentials = true paralyzes api responseaxios.defaults.withCredentials = true 使 api 响应瘫痪
【发布时间】：2021-10-16 04:33:29
【问题描述】：

我已经完成了我的 laravel、nuxt(ssr,server) 项目并将它们部署为单独的子域，例如 api.example.com && beta.example.com。

为了用户登录，当我在 laravel 中将 axios.defaults.withCredentials = true 添加到 resources/js/bootstrap.js 文件时，所有 api get/post 请求都变得如此缓慢甚至请求抛出超时，但是当我直接连接到 api url 时，如 https://api.example.com/api/v1/categories它立即显示。此外，在 beta 子域中，无需使用axios.defaults.withCredentials = true，它的速度也很快。

我在 nuxt 中使用 laravel sanctum 和 @nuxtjs/proxy 模块，例如：

nuxt.config.js

modules: [
    // https://go.nuxtjs.dev/axios
    ['@nuxtjs/axios', {
        proxy: true,
        credentials: true,
    }],
    // https://github.com/nuxt-community/proxy-module
    '@nuxtjs/proxy',
],
proxy: {
    "/v1/": {
        target: `https://api.example.com/api/v1`,
        pathRewrite: { "^/v1": "" },
        changeOrigin: true
    },
    // and more
    // ...
    // ..
    // .
},

cors.php

  'paths' => [
    'api/*',
    'login',
    'logout',
    'register',
    'forgot-password',
    'reset-password',
    'user/password',
    'user/profile-information',
    'email/verify/*',
    'email/verification-notification',
    'sanctum/csrf-cookie',
],

'allowed_methods' => ['*'],

'allowed_origins' => ['*'],

'allowed_origins_patterns' => [],

'allowed_headers' => ['*'],

'exposed_headers' => [],

'max_age' => 0,

'supports_credentials' => true,

bootstrap.js

axios.defaults.withCredentials = true;

.env

SESSION_DRIVER=cookie
SESSION_DOMAIN=.example.com
SANCTUM_STATEFUL_DOMAINS=*.example.com

为什么axios.defaults.withCredentials = true 会那样做？我不知道是什么导致了这种速度变慢...我可以做些什么来解决这个问题？

【问题讨论】：

标签： laravel api nuxt.js laravel-8 laravel-sanctum

【解决方案1】：

window.axios.defaults.withCredentials = true;

【讨论】：