微信网页开发vue的使用-利来国际登录

用户在微信客户端中访问我们的网页,我们所设置的公众号就可以通过微信网页授权机制,来获取用户基本信息,进而实现业务逻辑。如果没有授权, 就无法进行微信分享等涉及微信 sdk 的操作。


微信网页授权分为两种 :

1) 静默授权

在授权过程中, 不会出现官方的授权页面, 因此用户不会感知到授权的进行, 但这种授权方式只能拿到用户的 openid, 要是想要获取用户的详细信息, 还需要调用其他接口。

2) 完整授权

在授权过程中, 会跳到官方的授权页面, 需要用户点击同意后, 才能获取到用户的详细信息并且跳转到我们设置的回调页面。

在该项目中, 以上两种授权方式均有用到。



授权流程 :



什么是微信 js sdk?

微信js-sdk是微信公众平台 面向网页开发者提供的基于微信内的网页开发工具包。通过使用微信js-sdk,网页开发者可借助微信高效地使用拍照、选图、语音、位置等手机系统的能力,同时可以直接使用微信分享、扫一扫、卡券、支付等微信特有的能力,为微信用户提供更优质的网页体验。

微信 js sdk 中的分享

微信分享, 就是在微信中打开的网页可以通过微信浏览器右上角的按钮将网页分享给其他人. 需要注意的一点是: 不要有诱导分享等违规行为,对于诱导分享行为微信将永久回收公众号接口权限!



调用微信 js sdk, 需要生成签名, 签名算法应在后台的 service 中实现, 其中签名需要的参数为(下面的参数值为模拟参数值, 须替换为对应有效的参数值):



因为签名算法中需要的 jsapi_ticket 参数要 call 微信服务器才能拿到, 所以签名算法的实现应在 server 端实现. 当前端需要使用签名时, 去调用后台 api 来获取签名。

配置 sdk, 具体可以查看官方文档。


通过config接口注入权限验证配置 :



通过ready接口处理成功验证 :

 微信可以分享内容到多个平台, 如朋友圈, 好友, qq 等等, 这里以朋友圈为例:



微信分享时当前页面的 url, 如果使用默认的分享配置, 会将此 url 和页面内容分享出去,所以我们设置了分享的相关参数, 使微信分享能够动态地在指定的页面分享定制内容, 如缩略图, 页面标题, 页面链接等等。



这里我们遇到了一个问题, 其实应该是单页应用在微信中的 bug :

在 android 的微信中, 微信通过 window.location.href 拿到的页面url 就是当前页面的 url; 而在 ios 中, 如果不刷新, 微信拿到的页面 url 就是页面第一次加载进来时的 url, 这样就导致 ios 中获取签名时,签名会与微信验证的签名不同, 导致报出 invalid signature 错误. 所以在ios 的微信中, 需要将第一次加载页面时的 url 存到 local storage 中, 在需要调用后台 api 拿签名的时候将之前存起来的 url 取出作为参数。

其他 sdk 中的功能, 调用过程与分享类似, 这里不再列举。

结语
微信中的网页开发, 其实与一般的手机端网页开发区别并不是很大, 唯一比较大的区别就是微信网页开发会使用到微信 js sdk. 但是 sdk 的运用在整个开发当中也占了比较重要的一部分, sdk 中的很多功能很重要, 如果能很好地利用起来并与业务逻辑相结合, 那么整个应用都会增色不少。

在整个开发过程中, 我们还发现微信的 js sdk 虽然已经历经了很多个版本, 但是其中还是有很多的坑存在, 在与其他第三方 js 模块整合时可能会遇到不少问题, 这就需要大家在踩坑中不断解决问题了。
返回观点列表
本文标签:

相关专题

  • 电商/商城开发

    杭州派迪科技为高端客户提供商城开发建设咨询策划,商城利来手机网址官网设计,商城建设开发服务,以国际化视野和标准为基础,为各行业领军品牌提供高端商城开发定制、策划、设计、互动与制作

    查看详情
  • 微信公众号开发

    杭州派迪科技微信公众号开发,为全国企业提供微信公众号商城、h5、功能系统开发,如您需要找专业的公众号开发团队,委托第三方公司开发公众号菜单及网页内容请联系派迪科技

    查看详情
  • 小程序开发

    杭州派迪科技专业小程序开发,为企业提供微信小程序开发,包括小程序商城、小程序应用及其他平台,可根据客户需求进行定制开发,提供源代码,可二次开发,可申请软件著作权,欢迎咨询。我们以用户为中心的程序功能丰富、直观且性能极佳。我们以清晰的业务目标视图制作您的项目目的地,并确保它支持用户访问体验。可在跨设备上产生无缝的全渠道体验,应用程序具有丰富的 ui/ux、规范化的数据库和强大的框架,可提供更好性能。

    查看详情
  • app/应用平台开发

    杭州派迪科技专业的app开发平台,9年开发经验,专注app开发、app软件开发、手机app制作为教育行业、检修行业、商城电商系统等app提供过全程策划及开发

    查看详情

体验从沟通开始,让我们聆听您的需求!

开始您的数字化品牌体验! 0571-85815193 期待您的来电!

[ 网站建设×品牌利来手机网址官网设计×大策略营销门户×微信小程序开发×微信公众号开发]

派迪业务总监微信号

了解最新项目报价

派迪产品经理钉钉号

免费获取项目方案

我们正使用 cookie 来改善您的访问体验

派迪科技非常重视您的个人隐私,当您访问我们的网站www.hzpady.com时,请同意使用所有cookie 。

如果您想详细了解我们如何使用cookie请访问我们的 《隐私政策》

cookie 偏好

如果您想详细了解我们如何使用cookie请访问我们的 《隐私政策》

管理cookie偏好

基本 cookie

始终允许

这些 cookie 是网站运行所必需的,不能在我们的系统中关闭。它们通常仅针对您所做的相当于服务请求的操作而设置,例如设置您的隐私首选项、登录或填写表格。您可以将浏览器设置为阻止或提醒您有关这些 cookie 的信息,但网站的某些部分将无法运行。这些 cookie 不存储任何个人身份信息。

性能 cookie

始终允许
这些 cookie 使我们能够计算访问量和流量来源,以便我们可以衡量和改进我们网站的性能。它们帮助我们了解哪些页面最受欢迎和最不受欢迎,并了解访问者如何在网站上移动。这些 cookie 收集的所有信息都是汇总的,而且是匿名的。如果您不允许这些 cookie,我们将不知道您何时访问了我们的网站,也无法监控其性能。

功能性 cookie

这些 cookie 收集信息用于分析和个性化您的定向广告体验。您可以使用此拨动开关来行使选择不获取个人信息的权利。如果您选择关闭,我们将无法向您提供个性化广告,也不会将您的个人信息交给任何第三方。

定位 cookie

这些 cookie 可能由我们的广告利来国际登录的合作伙伴通过我们的网站设置。这些公司可能会使用它们来建立您的兴趣档案,并在其他网站上向您展示相关广告。它们不直接存储个人信息,而是基于唯一标识您的浏览器和互联网设备。如果您不允许使用这些 cookie,您将体验到较少针对性的广告。

我们正使用 cookie 来改善您的访问体验

派迪科技非常重视您的个人隐私,当您访问我们的网站www.hzpady.com时,请同意使用所有cookie 。

如果您想详细了解我们如何使用cookie请访问我们的 《隐私政策》