前端对接微信公众号网页开发流程,前期配置

这篇具有很好参考价值的文章主要介绍了前端对接微信公众号网页开发流程,前期配置。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

微信公众号网页开发,其实就是我们开发的h5网页需要放到微信浏览器环境中使用,但是需要对接公众号授权,授权之后可以获取到用户的个人信息,以及可以使用公众号提供的一些API,如:图片上传、图片预览、获取位置信息、微信扫一扫等功能。在没有对接正式公众号之前我们可以申请测试公众号来进行开发测试。下面会分三篇文章详细介绍对接公众号网页开发流程,本篇为公众号前期配置,另外两篇介绍 前端对接微信公众号网页开发流程,授权对接 和 前端对接微信公众号网页开发流程,JSSDK使用,干货满满!

一.申请测试公众号

微信公众平台接口测试帐号申请地址,微信扫码登录即可
公众号网页开发,微信公众号,前端,微信,javascript

二.测试号相关配置

登录之后需要配置JS接口安全域名网页授权获取用户基本信息,并需要扫码关注测试公众号

1.JS接口安全域名配置
a.JS接口安全域名在未对接正式公众号之前我们可以配置本地测试域名,可以自定义域名,只要符合规则就行。
公众号网页开发,微信公众号,前端,微信,javascript

b.配置后将该域名指向本地开发环境,配置路径:C:\Windows\System32\drivers\etc下的hosts文件
公众号网页开发,微信公众号,前端,微信,javascript
c.配置完之后启动本地服务,需要下载http-server,全局执行命令,下面会讲到如何启动

npm install http-server -g

2.网页授权获取用户基本信息配置
网页授权获取用户基本信息此处的地址可配置和JS接口安全域名一致
公众号网页开发,微信公众号,前端,微信,javascript
公众号网页开发,微信公众号,前端,微信,javascript
3.扫码关注测试号
在配置完上面两处信息之后需扫码关注测试号,当然在配置之前关注也可以
公众号网页开发,微信公众号,前端,微信,javascript

三、运行本地文件到微信开发者工具

1.本地文件目录
公众号网页开发,微信公众号,前端,微信,javascript
2.启动本地服务
上面讲到全局安装了http-server,这里就会用到,在文件根目录执行命令,-p80意思是端口号为80

http-server -p80

公众号网页开发,微信公众号,前端,微信,javascript
公众号网页开发,微信公众号,前端,微信,javascript

3.在微信开发者工具访问
打开微信开发者工具,开发模式调整为公众号网页调试,路径:项目-更换开发模式-公众号网页调试,在地址栏输入配置的域名即可访问本地index.html
公众号网页开发,微信公众号,前端,微信,javascript文章来源地址https://www.toymoban.com/news/detail-807082.html

到了这里,关于前端对接微信公众号网页开发流程,前期配置的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包