我成功地设置了cookie，当我执行console.log(getCookie('key'))时，我看到了这个：

[{"pic":"https://something.jpg","des":"something","price":"something","score":"something","id":0,"explink":"something"}]

但是当我运行JSON.parse(getCookie('key'))时，我得到这个错误：
语法错误：JSON中位置0处的意外标记u
我试着用这个：

import Layout from '../components/layout';
import { useState, createContext, useEffect } from 'react';
import AppContext from '../components/AppContext';
import '../styles/globals.css';
import { getCookies, getCookie, setCookie, deleteCookie } from 'cookies-next';

export default function MyApp({ Component, pageProps }) {
  const [count, setcount] = useState(0);
  const [card, setcard] = useState([]);
  setCookie('key', JSON.stringify(card));
  setcard(JSON.parse(getCookie('key')));
  return (
    <div>
      <AppContext.Provider
        value={{
          count,
          setcount,
          card,
          setcard,
 
        }}
      >
        <Layout>
          <Component {...pageProps} />
        </Layout>
      </AppContext.Provider>
    </div>
  );
}

为什么会出现此错误？
我也尝试了setcard(getCookie('key'));，但我得到了这个错误：
错误：重新呈现次数过多。React限制呈现次数以防止无限循环。
生成页面时发生此错误。任何控制台日志都将显示在终端窗口中。