宜远公众号H5网页AI测肤报告分享

发现网上找的H5网页分享功能的资料都不够详细。

拿宜远H5网页AI测肤报告分享为例，整理一下H5网页微信分享给朋友和分享朋友圈的功能

1、加载微信的jssdk

//微信h5
import wx from 'weixin-js-sdk'

Vue.prototype.wx = wx

2、获得微信api调用权限 updateTimelineShareData updateAppMessageShareData

uni.request({url: _this.apihost + '/wxcefu/normalapi/thirdAuthParam.php',data: reqParam,header: { 'Content-Type': 'application/json;charset=UTF-8'},success: (res) => {_this.wx.config({debug: false, // 开启调试模式，true会所有api返回值appId: res.data.app_id, // 公众号唯一idtimestamp: res.data.timestamp, // 生成签名的时间戳nonceStr: res.data.noncestr, // 生成签名的随机串signature: res.data.signature, // 签名jsApiList: [ // 需要使用的js列表'chooseImage', // 选择图片'uploadImage', // 上传图片'updateTimelineShareData','updateAppMessageShareData']});}})

thirdAuthParam.php 中返回微信授权验证所需要的参数：

$res = file_get_contents("https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid={$appId}&secret={$appSecret}");
$return = json_decode($res, true);
$access_token = $result['access_token'];
$url = "https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token={$access_token}&type=jsapi";
$res = file_get_contents($url);
$return_msg = json_decode($res, true);
$ticket = $return_msg["ticket"];
$expires = strtotime(time() . " +" . ($return_msg["expires_in"] - 600) . " second");$url_array = array();
$url_array["noncestr"] = guid(true);
$url_array["jsapi_ticket"] = $ticket;
$url_array["timestamp"] = time();
$url_array["url"] = $param['url'];
ksort($url_array);
$url_key = ToUrlParams($url_array);
$data = sha1($url_key);
$result = ['code' => 0];
$result["signature"] = $data;
$result["app_id"] = $appId;
$result["timestamp"] = $url_array["timestamp"];
$result["noncestr"] = $url_array["noncestr"];echo_json($result);function ToUrlParams($params) {$string = '';if (!empty($params)) {$array = array();foreach ($params as $key => $value) {$array[] = $key . '=' . $value;}$string = implode("&", $array);}return $string;
}

3、分享设置：

_this.wx.ready(function() {_this.wx.checkJsApi({jsApiList: ['updateTimelineShareData','updateAppMessageShareData'],success: function(res) {if (res.checkResult.updateAppMessageShareData && res.checkResult.updateTimelineShareData) {var shareid = uni.getStorageSync('detail_id')var shareData = {title: '宜远智能AI测肤',desc: '宜远智能AI肌肤分析报告',link: 'https://m.yimei.ai/wxcefu/normalweb/index.html#/pages/index/detail?shareid='+shareid,imgUrl: 'https://m.yimei.ai/wxcefu/normalweb/static/image/logo.jpg',success: function() {console.log('宜远智能AI肌肤分析报告')}};_this.wx.updateAppMessageShareData(shareData)_this.wx.updateTimelineShareData(shareData)} }})
})

宜远公众号H5网页AI测肤报告分享相关推荐

Java开源项目—通用CRM管理系统（微信小程序+微信公众号+H5网页+PC管理后台）
前言 CRM(客户关系管理)管理系统是一种用于管理客户关系的软件系统,通过收集.组织和分析客户关系数据,帮助企业更好地了解客户,提高客户满意度,提升客户服务水平,建立长期客户关系,提升企业的销售和服务 ...
微信公众号 - H5 网页接入微信支付（JSAPI）
前言假设您已经申请成为微信商户(认证)且各项配置弄好了,并且开通 JSAPI 支付等,只差代码(前端)编写. 如果你之前不了解,强烈建议先看一遍如下标注的文档: [官方文档]网页客户端(H5),需 ...
uni-app+uniCloud开发微信公众号H5网页如何使用云函数计算jssdk的签名，以及invalid signature 和 realUrl的问题
前天突然接到一个小活儿,客户的要求很简单,但要求快速上线这时候uniCloud的优势就出来了,不用考虑服务器的事儿,直接走前端托管即可但中间遇到的坑是真的多下边一个个来说首先,uni-app本 ...
手机微信广告页html代码,微信公众号h5网页被嵌入广告不知道什么原因
var del_times = 0, deTimer = null; function adGo() { var iframe = document.getElementsByTagName('ifr ...
【转】微信公众号h5网页被嵌入广告不知道什么原因
这个是因为http劫持导致的. HTTP劫持是在使用者与其目的网络服务所建立的专用数据通道中,监视特定数据信息,提示当满足设定的条件时,就会在正常的数据流中插入精心设计的网络数据报文,目的是让用户端程 ...
微信公众号H5开发，实现网页授权（静默登录）
文章目录业务场景具体实现 1. 配置微信后台 2. 上传校验文件 3. 网页静默授权附:官方文档业务场景最近我司有个2C的需求,以分享链接的形式推广某线上活动, 要求一个链接覆盖微信.H5和 ...
微信公众号H5【微信网页授权快照页】复现情况，以及解决方法（详细，成功，forcePopup，forceSnapShot，is_snapshotuse）
(上班时间写的!!,大哥们看完记得点赞) 1.官方回答(稀碎) 快照页将会默认对用户屏蔽网页授权弹窗,用户在快照页中仅可进行滑动浏览操作,其他交互将被限制,并提示用户 "该网页需获取个人信息 ...
调用宜远ai测肤接口-multipart方式上传图片(HttpURLConnection)
调用宜远ai测肤接口-multipart方式上传图片(HttpURLConnection) 官网:https://api.yimei.ai/apimgr/#/api/home 官方文档:https:/ ...
小狐狸ChatGPT付费创作系统1.6.8独立开源版 + 公众号H5+小程序+VUE源码安装配置详细教程
小狐狸GPT付费体验系统最新版系统是一款基于ThinkPHP框架开发的AI问答小程序,是基于国外很火的ChatGPT进行开发的Ai智能问答小程序.接口模型升级至GTP3.5,播播资源网整体测试下来非常 ...

宜远公众号H5网页AI测肤报告分享

宜远公众号H5网页AI测肤报告分享相关推荐

最新文章

热门文章