TypeError: axiosCookieJarSupport 不是函数，适用于 Node.JS 但不适用于 .vue 页面？答案

【问题标题】：TypeError: axiosCookieJarSupport is not a function, works in Node.JS but not .vue pages?TypeError: axiosCookieJarSupport 不是函数，适用于 Node.JS 但不适用于 .vue 页面？
【发布时间】：2021-08-22 02:08:16
【问题描述】：

我有一个对网站进行身份验证的功能，当我在基本的 node.js 脚本中运行它时它可以工作，但在从 .vue 页面运行时它不起作用（使用 NuxtJS 框架）。

当我在 .vue 页面中运行它时，它会收到错误声明 TypeError: axiosCookieJarSupport is not a function

以下示例。

基本 .js 文件中的工作代码：

const axios = require("axios").default;
const axiosCookieJarSupport = require("axios-cookiejar-support").default;
const tough = require("tough-cookie");
const qs = require("qs");

async function main() {
  let session = axios.create({
    withCredentials: true,
    baseURL: "xxx",
  });

  axiosCookieJarSupport(session);
  session.defaults.jar = new tough.CookieJar();

  let res = await session.post("/api/auth/login", qs.stringify({username: '', password: ''}))
    .then((res) => {
      console.log(res);
    })
}

main();

.vue 页面中的代码不起作用：

<script>
const axiosCookieJarSupport = require('axios-cookiejar-support').default
const tough = require('tough-cookie')
const qs = require('qs')

export default {
  methods: {
    async login () {
      const session = this.$axios.create()

      axiosCookieJarSupport(session) // <-- error occurs here

      session.defaults.jar = new tough.CookieJar()

      const res = await session.$post('/api/auth/login', qs.stringify({ username: '', password: '' }))
        .then((res) => {
          console.log(res)
        })
    }
  }
}
</script>

我尝试将const axiosCookieJarSupport = require('axios-cookiejar-support').default 移到函数中，但没有任何区别。

任何帮助将不胜感激。

【问题讨论】：

标签： javascript vue.js axios nuxt.js session-cookies

【解决方案1】：

因为这个库在浏览器中不起作用：

浏览器

在浏览器上运行，这个库变成 noop (config.jar 可能会被忽略）。

https://github.com/3846masa/axios-cookiejar-support#browser

【讨论】：

【解决方案2】：

通过更新我的nuxt.config.js 文件修复：

axios: {
    credentials: true,
    proxy: true,
    jar: true // <-- this was missing
  },

.vue 页面中的代码现在是：

<script>
export default {
  methods: {
    async login () {
      const qs = require('qs')
      const session = this.$axios.create()
      await session.$post('/api/auth/login', qs.stringify({ username: '', password: '' })).then((res) => {
        console.log(res)
      })
  }
}
</script>

它现在似乎正在存储会话，我可以在后续的 api 调用中使用会话。

【讨论】：