【亲测免费】微信小程序Cookie支持库安装与配置指南

2026-01-25 05:05:52作者：翟萌耘Ralph

1. 项目基础介绍和主要编程语言

项目名称: weapp-cookie
项目简介: weapp-cookie 是一个开源项目，旨在为微信、头条、百度、支付宝小程序提供 Cookie 支持。通过一行代码，即可实现小程序对 Cookie 的支持，从而保证基于 Cookie 的服务会话不会失效，与 Web 端共用会话机制。
主要编程语言: JavaScript

2. 项目使用的关键技术和框架

关键技术:

Cookie 管理: 项目核心功能是管理小程序中的 Cookie，包括设置、获取、删除等操作。
请求代理: 通过代理小程序的网络请求接口 wx.request，自动处理 Cookie 的存储和发送。
兼容性: 兼容 uni-app 等开发框架，支持在不同的小程序平台上使用。

主要框架:

微信小程序: 项目主要针对微信小程序开发，但也兼容其他小程序平台。
uni-app: 支持在 uni-app 框架中使用，提供跨平台的小程序开发能力。

3. 项目安装和配置的准备工作和详细安装步骤

准备工作

Node.js 环境: 确保你的开发环境中已经安装了 Node.js。如果没有安装，请前往 Node.js 官网下载并安装。
微信开发者工具: 安装并配置好微信开发者工具，用于小程序的开发和调试。
小程序项目: 确保你已经有一个微信小程序项目，或者新建一个微信小程序项目。

详细安装步骤

步骤 1: 安装 weapp-cookie 库

在终端或命令行中，进入你的小程序项目根目录，执行以下命令安装 weapp-cookie 库：

npm install weapp-cookie --save

步骤 2: 将 npm 包复制到 vendor 文件夹

为了确保小程序能够正确找到 weapp-cookie 库，建议将 npm 包复制到 vendor 文件夹中。执行以下命令：

cp -rf ./node_modules/weapp-cookie ./vendor/

步骤 3: 在小程序中引入 weapp-cookie

在小程序的 app.js 文件中，引入 weapp-cookie 库。打开 app.js 文件，添加以下代码：

// app.js
import './vendor/weapp-cookie/dist/weapp-cookie';

App({
  onLaunch: function () {
    // 小程序启动时执行的代码
  }
});

步骤 4: 使用 weapp-cookie 进行 Cookie 操作

在需要使用 Cookie 的页面或组件中，可以通过 weapp-cookie 提供的 API 进行 Cookie 的设置、获取、删除等操作。例如：

// pages/home/index.js
import cookies from 'weapp-cookie';

Page({
  onLoad: function () {
    // 设置 Cookie
    cookies.set('uid', 100, { domain: 'example.com' });

    // 获取 Cookie
    let token = cookies.get('csrf_token', 'example.com');

    // 删除 Cookie
    cookies.remove('uid', 'example.com');

    // 判断是否存在某个 Cookie
    let hasToken = cookies.has('uid', 'example.com');
  }
});

步骤 5: 配置别名（可选）

由于微信小程序的安全机制，wx.request 不允许被重写，因此可以使用内置别名或自定义别名来支持 Cookie 请求。例如：

// 使用内置别名
wx.requestWithCookie({
  url: 'https://example.com/user/current',
  success: function (res) {
    console.log(res);
  }
});

// 配置自定义别名
cookies.config({
  requestAlias: 'requestx'
});

// 使用自定义别名
wx.requestx({
  url: 'https://example.com/user/current',
  success: function (res) {
    console.log(res);
  }
});