问题背景

小程序原生的 request 网络请求接口并不支持传统的 Cookie，但有时候我们现有的后端接口确于依赖 Cookie，导致，就算我们成功调用了获取openid的鉴权行为，从接口的响应中找到了cookie，却也无法携带到其他接口的请求头中。

当时自己开发小程序的时候鉴权成功后接口响应会返回cookie并保存在本地

注意小程序端不支持自动保持 cookie，服务器应避免验证 cookie。如果服务器无法修改，也可以使用一些模拟手段，比如这样的工具github.com/charleslo1/… 可以请求时带上 cookie 并将响应的 cookie 保存在本地

weapp-cookie

一行代码让微信、头条、百度、支付宝小程序支持 cookie，兼容 uni-app

Intro

小程序原生的 request 网络请求接口并不支持传统的 Cookie，但有时候我们现有的后端接口确于依赖 Cookie（比如服务器用户登录态），这个库可用一行代码为你的小程序实现 Cookie 机制，以保证基于 cookie 的服务会话不会失效，与 web 端共用会话机制

Featrues

• 一行代码让小程序支持 cookie
• 可使用 api 获取、设置 cookie
• 支持 domain/path 作用域

Install

npm install weapp-cookie --save
​
# 将 npm 包复制到 vendor 文件夹，避免小程序可能不能找到文件（Tips：支持npm包的开发环境无需此步）
cp -rf ./node_modules/ ./vendor/

Usage

以微信小程序为例，在小程序根目录的 app.js 一行代码引入即可

// app.js
import './vendor/weapp-cookie/dist/weapp-cookie'
​
// tips: 使用 uni-app/wepy/mpvue 等支持npm包的环境可以直接在入口 js 引入 weapp-cookie 模块
// import 'weapp-cookie'
​
App({
    onLaunch: function () { }
    // ...
})

原来的 wx.request 调用方式保持不变，引入后 weapp-cookie 会在底层自动代理 wx.request 的接口访问，以支持 cookie 存储和发送

// pages/home/index.js
​
Page({
    onLoad: function () {
        wx.request({
            url: 'https://example.com/login',
            data: {
                username: 'admin',
                password: '123456'
            },
            success: function (res) {
                /*
                 * 接口调用成功后 weapp-cookie 会自动保存后端发送的所有Cookie（比如：SessionID）
                 * 并在后续的所有请求中带上，以保证基于 cookie 的服务器会话机制不会失效，
                 * 实现与 web 端共用会话机制（无需再手动维护 3rd_session_key） 
                 */
            }
        })
    }
})

更多详细内容github.com/charleslo1/…