1. 页面方面
(1)单页面应用,使用jquery 绑定click事件来控制页面更换显示
(2)ajax请求获取图片数据,和海报名人名言数据
2.微信分享
(1)配置签名,后台导入微信第三方库配置签名,前端post方法向后台请求数据
3.授权登录实现:
首先,进入活动,判断是否为微信浏览器,如果是,则判断用户是否登录,
1.若未登录,则window.location.href重定向到授权登录页面
携带appid(公众号唯一标识),redirect_uri(授权后重定向回调链接地址),scope,授权作用域(snsapi_base (不弹出授权页面,直接跳转,只能获取用户openid),snsapi_userinfo (弹出授权页面,可通过openid拿到昵称、性别、所在地。并且, 即使在未关注的情况下,只要用户授权,也能获取其信息 )),打开授权登录页面,
2.用户同意授权后,返回一个code,页面跳转redirect_uri/?code=CODE&state=STATE。
3.通过code换取access_token,通过appid,appsecret(公众号的秘钥),code请求access_token
4.若同意,返回用户openid 与access_token
5.若为snsapi_userinfo,通过access_token和openid可以获取用户信息
实际操作:授权登录时,通过token换取用户信息时,将信息保存到数据库,加一个guid标识符(2小时失效),guid标识符会被拼接到重定向url之后,取用户信息时,使用guid去取;数据库中有两个表,分别存用户授权登录的信息(appid,openid,guid)和用户个人信息,用guid换取appid和openid去取用户信息,授权登录完成后,页面跳转到首页,携带了openid与guid参数,此时再次判断是否登录,将openid保存至SessionHelper(本地的小型数据库),再重定向到首页,此时判断用户登录方式(扫码登录(扫自己的或别人的)/直接进入)
由于海报末尾会生成二维码,生成二维码的时候带上原来保存的openid,标识为个人的friendid,若扫码进入页面,则有friendid,
和获取到的openid进行比较,若相等,则说明扫自己的码,若不等,则扫别人的码。都要存记录到数据库