Nuxt服务端请求及获取Cookie

 

 程序在服务端（即服务器）处理业务的时候，是无法拿到cookie数据的（目前只知道nuxt.js是这样的）。

所以我们需要在客户端拿cookie数据。

我们需要借助nuxt.js给的方法process.client和process.server进行判断

如果是客户端渲染process.client=true;

推荐文章：

nuxt怎么拿到window对象，解决方案-CSDN博客

nuxt怎么拿到请求的userAgent，拿到浏览器信息-CSDN博客

 第一步：创建插件

根目录下的“plugins”是插件目录 ，即插件文件夹；

我们创建一个JS文件叫“public.js”的文件；

在文件里写如下代码：

import Vue from 'vue'
    
     //获取
    Vue.prototype.getCookie = function (cname) {
      if (process.client) {
        var name = cname + "=";
        var ca = document.cookie.split(';');
        for (var i = 0; i < ca.length; i++) {
          var c = ca[i];
          while (c.charAt(0) == ' ') c = c.substring(1);
          if (c.indexOf(name) != -1) {
            return c.substring(name.length, c.length);
          }
        }
        return 0;
      }
    };
    
    //设置
    Vue.prototype.setCookies = function (cname, cvalue, exdays) {
      if (process.client) {
        var d = new Date();
        d.setTime(d.getTime() + exdays * 24 * 60 * 60 * 1000);
        var expires = "expires=" + d.toGMTString();
        // document.cookie = cname + "=" + cvalue + "; " + expires;
        document.cookie = cname + "=" + cvalue + "; " + expires + ";path=/;domain=.csdn.cc";
      }
    };

第二步：引入插件

这一步也可以叫“配置插件”

在根目录找到“nuxt.config.js”文件，

接着找到“plugins”节点，

配置代码如下：

plugins: [ 
	{ src: '@/plugins/public' } 
]

第三步：页面调取使用

this.getCookie('名称');

目录结构如下：