web页转微信小程序的普通用户名密码登录方式

第一次写文章，希望有错能指正。

最近boss突然说要把一套web上的系统做成小程序。还好之前有过接触小程序，不过都是自己照着api和demo瞎写的，只能硬着头皮上了。

不出意外写了没多久就卡住了，原因是web页是利用cookie来保持登录信息，而小程序中并没有cookie这种东西。

一般的cookie都是浏览器生成放在Request Headers 中当做信息传给后端的，然后后端返回Set-Cookie给客户端浏览器设定之前拿到的cookie,使浏览器在cookie失效之前都拥有登陆者的信息。前端发送的cookie就像一张身份证，只要是携带了这个cookie的请求都会被认为是同一个请求源。

但是小程序中的登录请求并没有向后端发送cookie。

下图是正常浏览器端的登录请求

这是小程序中的

同一个接口cookie的差异就导致了小程序中无法使用cookie来保持登录信息。

不过好在登录请求不管前端是否发送cookie，后端都会有一个sessionId计算器(存在于使用cookie免登录的项目)，请求的Response Headers中肯定会有一个Set-Cookie信息，通过response.header['Set-Cookie']拿到Set-Cookie的整条信息后，自然就可以得到其中的SESSION了。

然后通过自带的setStorage方法存储在本地，之后想要看登录之后的各种页面只要在请求的头中加入Cookie(和web端请求登录参数名一致)参数即可。

wx.setStorage({

      key: "sessionId",

      data: sessionId

})

wx.getStorage({

      key: 'sessionId',

      success: function (response) {

            wx.request({

                  url: '请求url',

                  method: 'GET',

                  data: {

                  },

                  header: {

                        'content-type': 'application/json',

                        'Cookie': response.data

                  },

                  success: function (res) {

                  }

            })

      }

})

每个接口都要多传一个参数，麻烦是麻烦了一点，不过算是马马虎虎地解决了问题，之后应该还会遇到很多问题，只能边学边做了。