Question

我正在使用Nuxt.js开发网站，我想调用API并将结果放在服务器端的Cookie中

我将在Nuxt.js中间件中完成这一部分。但是我可以调用API，可以设置cookie，但是不能使用API响应来设置cookie。

调用API

import axios from 'axios'

export default ({ res, store }) => {
  if (process.server) {
    axios.get(process.env.tokenAPI)
      .then((response) => {
        const token = response.data.token
        // console.log(token) and the server console will log the result
      })
  }
}

设置Cookie

export default ({ res, store }) => {
    res.setHeader('Set-Cookie', [`token=123456`]) // It works!!

}

组合他们

import axios from 'axios'

export default ({ res, store }) => {
  if (process.server) {
    axios.get(process.env.token)
      .then((response) => {
        const token = response.data.token
        res.setHeader('Set-Cookie', [`token=${token}`]) 
      })
  }
}

使用此代码时未设置cookie，它应根据结果设置cookie

Answer 1

您可以试试吗：

import axios from 'axios'
export default ({ res, store }) => {
  if (process.server) {
    axios.get(process.env.token)
      .then((response) => {
        document.cookie = "token="+response.data.token+"; expires=Thu, 18 Dec 2019 12:00:00 UTC; path=/";
      })
  }
}

Answer 2

这是因为中间件必须等待发送响应，直到您设置标头为止。

import axios from 'axios'

export default async ({ res, store }) => {
  if (process.server) {
    const response = await axios.get(process.env.token);
    const token = response.data.token;
    res.setHeader('Set-Cookie', [`token=${token}`]);
  }
}

无法在axios响应中设置cookie

2 个答案: