罪恶克星 发表于 7 天前

HarmonyOS NEXT——【鸿蒙分享微信链接、小程序跳转】

1、鸿蒙应用将图片/链接情势分享到微信

1.1、申请授权码

 首先我们在接入微信sdk之前,必要在微信开放平台申请平台的id授权码和secret用来进行授权。申请secret我们必要填写BundleID和Identifier,那么这两个东西其实对应的就是鸿蒙应用的包名appName以及鸿蒙应用的appid,我们将应用信息填写后等待审核完成后即可获取到应用对应的平台授权码。接入指南 / 鸿蒙接入指南
https://i-blog.csdnimg.cn/direct/17b4d8f287784a51b7429b258a8807be.png​
https://i-blog.csdnimg.cn/direct/2048ac1c44d0405b9f6a73cd16d9d370.png​
补充:如果您还未创建鸿蒙项目,详细检察鸿蒙官网项目创建和发布指导:创建HarmonyOS应用/元服务-创建应用-创建项目和应用-AppGallery Connect帮助中心 - 华为HarmonyOS开辟者
1.1.1、检察Bundle ID:

Bundle ID 指的是鸿蒙应用的包名:
https://i-blog.csdnimg.cn/direct/f1ed4ff073a846a8978fdf1843254240.png​
1.1.2、检察鸿蒙应用appid:

Identifier 指的是鸿蒙应用的 appId,详情可以在AGC平台上检察:
https://i-blog.csdnimg.cn/direct/f70f414678214fb1b5b36264dfc830da.png​
1.1.3、申请成功并检察授权码:(大概必要等待审核时间一天左右)

申请成功后,将可以在微信开放平台——开辟设置——鸿蒙应用,检察到APPID以及AppSecret这两个授权码,在后续集成微信sdk中必要使用。
https://i-blog.csdnimg.cn/direct/2e500690621b4fdf8d376a8994415046.png​

1.2、集成微信sdk:

这里我提供下相关sdk导入的参考代码,详细可参考微信开放平台相关demo以及文档:
//entry\src\main\ets\common\utils\微信支付宝三方SDK工具\微信支付宝登录\WXApiWrap.ets
import * as wxopensdk from '@tencent/wechat_open_sdk';
import { CommonConstants } from '../../../constants/CommonConstants';

export type OnWXReq = (req: wxopensdk.BaseReq) => void
export type OnWXResp = (resp: wxopensdk.BaseResp) => void

const kTag = "WXApiEventHandlerImpl"

class WXApiEventHandlerImpl implements wxopensdk.WXApiEventHandler {
private onReqCallbacks: Map<OnWXReq, OnWXReq> = new Map
private onRespCallbacks: Map<OnWXResp, OnWXResp> = new Map

registerOnWXReqCallback(on: OnWXReq) {
 this.onReqCallbacks.set(on, on)
}
unregisterOnWXReqCallback(on: OnWXReq) {
 this.onReqCallbacks.delete(on)
}

registerOnWXRespCallback(on: OnWXResp) {
 this.onRespCallbacks.set(on, on)
}
unregisterOnWXRespCallback(on: OnWXResp) {
 this.onRespCallbacks.delete(on)
}

onReq(req: wxopensdk.BaseReq): void {
 wxopensdk.Log.i(kTag, "onReq:%s", JSON.stringify(req))
 this.onReqCallbacks.forEach((on) => {
   on(req)
 })
}

onResp(resp: wxopensdk.BaseResp): void {
 wxopensdk.Log.i(kTag, "onResp:%s", JSON.stringify(resp))
 this.onRespCallbacks.forEach((on) => {
   on(resp)
 })
}
}
/**
  * !!!这里的appid和secret就是一开始申请的授权码。(填写不正确则无法成功进入微信应用!!!)
  * WXAPP_ID = "wx4e71fe1xxxxxxxxx"
  * WXAPP_SECRET = "305a1eb0dc9dxxxxxxxxxxx"
  */
export const WXApi = wxopensdk.WXAPIFactory.createWXAPI(CommonConstants.WXAPP_ID)
export const WXEventHandler = new WXApiEventHandlerImpl
1.3、分享链接/图片:

以下我以分享链接,以及分享图片到微信作为示例提供参考:
结果:
​​https://i-blog.csdnimg.cn/direct/534acd0f2f0642cea9a324fdb3e01a7c.gif
import * as wxopensdk from '@tencent/wechat_open_sdk'; // 导入微信 SDK
import { image } from "@kit.ImageKit";
import { common } from "@kit.AbilityKit";
import { WXApi } from "../微信支付宝登录/WXApiWrap";


export class WXShareUtil {
static WXWebpageShare(url: string, title: string, message: string) {
 //分享网页链接
 const webpageObject = new wxopensdk.WXWebpageObject()
 webpageObject.webpageUrl = url

 const mediaMessage = new wxopensdk.WXMediaMessage()
 mediaMessage.mediaObject = webpageObject
 mediaMessage.title = title
 mediaMessage.description = message

 getContext().resourceManager.getMediaContent($r("app.media.push"))//链接展示的图片
   .then((thumbData) => {
     const thumbPixel = image.createImageSource(thumbData.buffer).createPixelMapSync()
     image.createImagePacker().packToData(thumbPixel, { format: "image/png", quality: 100 })
       .then((thumbBuffer) => {

         mediaMessage.thumbData = new Uint8Array(thumbBuffer)

         const req = new wxopensdk.SendMessageToWXReq()
         // req.callbackAbility = kDemoEntryAbility
         req.scene = wxopensdk.SendMessageToWXReq.WXSceneSession
         req.message = mediaMessage

         WXApi.sendReq(getContext() as common.UIAbilityContext, req)
       })

   })
}

static WXImageShare(url:string) {
 //分享图片

 let imageObject = new wxopensdk.WXImageObject
 // let buf: buffer.Buffer = buffer.from(url);
 // imageObject.imageData = buf.toString('base64', 0, buf.length);
 imageObject.imageData = url

 let mediaMessage = new wxopensdk.WXMediaMessage()
 mediaMessage.mediaObject = imageObject

 let req = new wxopensdk.SendMessageToWXReq()
 req.scene = wxopensdk.SendMessageToWXReq.WXSceneSession
 req.message = mediaMessage

 WXApi.sendReq(getContext() as common.UIAbilityContext, req)
}
}
1.4、跳转微信小程序:

此外,微信sdk已经支持拉起微信小程序的功能,示例结果如下:
​​https://i-blog.csdnimg.cn/direct/11bbd0d967dd4ebbaf54021199b7eef1.gif
参考代码:
import * as wxopensdk from '@tencent/wechat_open_sdk'; // 导入微信 SDK
import { common } from '@kit.AbilityKit';
import { WXApi } from '../微信支付宝登录/WXApiWrap';

export class WXMiniProgram {
static async LaunchMiniPrograms() {
 try {
   let context = getContext() as common.UIAbilityContext; // 假定我们在组件环境内调用

   let launchMiniProgramReq = new wxopensdk.LaunchMiniProgramReq;
   launchMiniProgramReq.userName = 'gh_dca141cxxxxx'; //拉起的小程序的原始id
   // launchMiniProgramReq.path = path;  //拉起小程序页面的可带参路径,不填默认拉起小程序首页,对于小游戏,可以只传入 query 部分,来实现传参效果,如:传入 "?foo=bar"。
   launchMiniProgramReq.miniprogramType = 0; //拉起小程序的类型 0-正式版 1-开发版 2-体验版
   let success = await WXApi.sendReq(context, launchMiniProgramReq);

 } catch (e) {
 }
}
}

免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!更多信息从访问主页:qidao123.com:ToB企服之家,中国第一个企服评测及商务社交产业平台。
页: [1]
查看完整版本: HarmonyOS NEXT——【鸿蒙分享微信链接、小程序跳转】