将慧表Web服务整体嵌入微信小程序_附代码包

2022-04-16 15:37:00
微图
原创
3018
摘要:利用微信小程序web-view组件,1行代码将慧表NxCellsH5Web页面嵌入微信小程序,加几行代码再实现群发

微信小程序用户不需要下载软件,随用随取,用过自留痕迹,比需要下载的软件更利于推广。

不要被框架图吓到,其实关键的只有一行代码,画图只是为更多人理解。

<!--最关键只有1行代码,web-view浏览器组件-->
<web-view src="https://h.weitue.com/#!/login"></web-view>

步骤概览

参考他人视频教程:https://www.bilibili.com/video/BV1Wb411E7dA?spm_id_from=333.337.search-card.all.click

本文主要介绍小程序上架的环节。

小程序上架

安装微信开发者工具

微信公众平台网址:https://mp.weixin.qq.com/

先登录

工具下载页面:https://developers.weixin.qq.com/miniprogram/dev/devtools/devtools.html 一百多M大小

新建微信小程序

选个JS的基础模板

改首页index.wxml

注释删除都可以,多行注释开头!--,结尾--,参照第一行改

<!--index.wxml-->


删除

小程序后台填域名

文件验证网站

每个域名都需要验证,顶级的验证了,二级的也需要验证

Linux网站根目录上传文件

windows网站跟目录上传文件

保存业务文件验证页面

上传代码

提交审核

审核用的图片指引

涉及账号的,留测试账号给审核员审核


用户隐私协议

填模板,把空的地方填上就行

最后提交

审核结果

过几个小时就会收到,我这里第一次未通过,是因为没留登录慧表涉及登录名和密码,截图也是空的。重新截图上传,留登录名admin空密码就通过了。

绑定的微信公众平台也会收到审核结果通知

提交发布

发现不能转发问题

不能转发

经查还得自己写函数,并且存在web-view的页面不支持分享朋友圈

只好先实现能发送朋友

在index.js页面添加代码

//设置可以转发,自己加的(存在web-view的页面不支持分享朋友圈)
    wx.showShareMenu({
      withShareTicket: true,
      menus: ['shareAppMessage', 'shareTimeline']
    })


改JS代码


//设置可以转发,自己加的(存在web-view的页面不支持分享朋友圈)
    wx.showShareMenu({
      withShareTicket: true,
      menus: ['shareAppMessage', 'shareTimeline']
    })
  },

后经查发现,凡是有web-view组件的页面不允许转发朋友圈,所以就不在首页用这个组件了,首页改成引导页,用个按钮跳转新页面在用web-view组件。

index.wxml


  <view>
    <text>登录指引↓</text>
  </view>
  <image bindtap="bindViewTap"  class="userinfo-avatar" src="/image/logG.jpg" >
  </image>
  <view>
    <button class="goToLog" bindtap="bindViewTap">
      去登录
    </button>
  </view>



发表评论
评论通过审核后显示。
  • 在线客服
  • 关注微信
    • 客服帆帆
    • 客服娜娜
    • 客服美美
    • 客服龙龙
  • 扫一扫关注微信