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) {

                  }

            })

      }

})

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

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容