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

打印 上一主题 下一主题

主题 1762|帖子 1762|积分 5286

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

1.1、申请授权码

 首先我们在接入微信sdk之前,必要在微信开放平台申请平台的id授权码和secret用来进行授权。申请secret我们必要填写BundleID和Identifier,那么这两个东西其实对应的就是鸿蒙应用的包名appName以及鸿蒙应用的appid,我们将应用信息填写后等待审核完成后即可获取到应用对应的平台授权码。接入指南 / 鸿蒙接入指南


补充:如果您还未创建鸿蒙项目,详细检察鸿蒙官网项目创建和发布指导:创建HarmonyOS应用/元服务-创建应用-创建项目和应用-AppGallery Connect帮助中心 - 华为HarmonyOS开辟者
1.1.1、检察Bundle ID:

Bundle ID 指的是鸿蒙应用的包名:

1.1.2、检察鸿蒙应用appid:

Identifier 指的是鸿蒙应用的 appId,详情可以在AGC平台上检察:

1.1.3、申请成功并检察授权码:(大概必要等待审核时间一天左右)

申请成功后,将可以在微信开放平台——开辟设置——鸿蒙应用,检察到APPID以及AppSecret这两个授权码,在后续集成微信sdk中必要使用。


1.2、集成微信sdk:

这里我提供下相关sdk导入的参考代码,详细可参考微信开放平台相关demo以及文档:
  1. //entry\src\main\ets\common\utils\微信支付宝三方SDK工具\微信支付宝登录\WXApiWrap.ets
  2. import * as wxopensdk from '@tencent/wechat_open_sdk';
  3. import { CommonConstants } from '../../../constants/CommonConstants';
  4. export type OnWXReq = (req: wxopensdk.BaseReq) => void
  5. export type OnWXResp = (resp: wxopensdk.BaseResp) => void
  6. const kTag = "WXApiEventHandlerImpl"
  7. class WXApiEventHandlerImpl implements wxopensdk.WXApiEventHandler {
  8.   private onReqCallbacks: Map<OnWXReq, OnWXReq> = new Map
  9.   private onRespCallbacks: Map<OnWXResp, OnWXResp> = new Map
  10.   registerOnWXReqCallback(on: OnWXReq) {
  11.    this.onReqCallbacks.set(on, on)
  12.   }
  13.   unregisterOnWXReqCallback(on: OnWXReq) {
  14.    this.onReqCallbacks.delete(on)
  15.   }
  16.   registerOnWXRespCallback(on: OnWXResp) {
  17.    this.onRespCallbacks.set(on, on)
  18.   }
  19.   unregisterOnWXRespCallback(on: OnWXResp) {
  20.    this.onRespCallbacks.delete(on)
  21.   }
  22.   onReq(req: wxopensdk.BaseReq): void {
  23.    wxopensdk.Log.i(kTag, "onReq:%s", JSON.stringify(req))
  24.    this.onReqCallbacks.forEach((on) => {
  25.      on(req)
  26.    })
  27.   }
  28.   onResp(resp: wxopensdk.BaseResp): void {
  29.    wxopensdk.Log.i(kTag, "onResp:%s", JSON.stringify(resp))
  30.    this.onRespCallbacks.forEach((on) => {
  31.      on(resp)
  32.    })
  33.   }
  34. }
  35.   /**
  36.   * !!!这里的appid和secret就是一开始申请的授权码。(填写不正确则无法成功进入微信应用!!!)
  37.   * WXAPP_ID = "wx4e71fe1xxxxxxxxx"
  38.   * WXAPP_SECRET = "305a1eb0dc9dxxxxxxxxxxx"
  39.   */
  40. export const WXApi = wxopensdk.WXAPIFactory.createWXAPI(CommonConstants.WXAPP_ID)
  41. export const WXEventHandler = new WXApiEventHandlerImpl
复制代码

1.3、分享链接/图片:

以下我以分享链接,以及分享图片到微信作为示例提供参考:
结果:
​​

  1. import * as wxopensdk from '@tencent/wechat_open_sdk'; // 导入微信 SDK
  2. import { image } from "@kit.ImageKit";
  3. import { common } from "@kit.AbilityKit";
  4. import { WXApi } from "../微信支付宝登录/WXApiWrap";
  5. export class WXShareUtil {
  6.   static WXWebpageShare(url: string, title: string, message: string) {
  7.    //分享网页链接
  8.    const webpageObject = new wxopensdk.WXWebpageObject()
  9.    webpageObject.webpageUrl = url
  10.    const mediaMessage = new wxopensdk.WXMediaMessage()
  11.    mediaMessage.mediaObject = webpageObject
  12.    mediaMessage.title = title
  13.    mediaMessage.description = message
  14.    getContext().resourceManager.getMediaContent($r("app.media.push"))//链接展示的图片
  15.      .then((thumbData) => {
  16.        const thumbPixel = image.createImageSource(thumbData.buffer).createPixelMapSync()
  17.        image.createImagePacker().packToData(thumbPixel, { format: "image/png", quality: 100 })
  18.          .then((thumbBuffer) => {
  19.            mediaMessage.thumbData = new Uint8Array(thumbBuffer)
  20.            const req = new wxopensdk.SendMessageToWXReq()
  21.            // req.callbackAbility = kDemoEntryAbility
  22.            req.scene = wxopensdk.SendMessageToWXReq.WXSceneSession
  23.            req.message = mediaMessage
  24.            WXApi.sendReq(getContext() as common.UIAbilityContext, req)
  25.          })
  26.      })
  27.   }
  28.   static WXImageShare(url:string) {
  29.    //分享图片
  30.    let imageObject = new wxopensdk.WXImageObject
  31.    // let buf: buffer.Buffer = buffer.from(url);
  32.    // imageObject.imageData = buf.toString('base64', 0, buf.length);
  33.    imageObject.imageData = url
  34.    let mediaMessage = new wxopensdk.WXMediaMessage()
  35.    mediaMessage.mediaObject = imageObject
  36.    let req = new wxopensdk.SendMessageToWXReq()
  37.    req.scene = wxopensdk.SendMessageToWXReq.WXSceneSession
  38.    req.message = mediaMessage
  39.    WXApi.sendReq(getContext() as common.UIAbilityContext, req)
  40.   }
  41. }
复制代码

1.4、跳转微信小程序:

此外,微信sdk已经支持拉起微信小程序的功能,示例结果如下:
​​

参考代码:
  1. import * as wxopensdk from '@tencent/wechat_open_sdk'; // 导入微信 SDK
  2. import { common } from '@kit.AbilityKit';
  3. import { WXApi } from '../微信支付宝登录/WXApiWrap';
  4. export class WXMiniProgram {
  5.   static async LaunchMiniPrograms() {
  6.    try {
  7.      let context = getContext() as common.UIAbilityContext; // 假定我们在组件环境内调用
  8.      let launchMiniProgramReq = new wxopensdk.LaunchMiniProgramReq;
  9.      launchMiniProgramReq.userName = 'gh_dca141cxxxxx'; //拉起的小程序的原始id
  10.      // launchMiniProgramReq.path = path;    //拉起小程序页面的可带参路径,不填默认拉起小程序首页,对于小游戏,可以只传入 query 部分,来实现传参效果,如:传入 "?foo=bar"。
  11.      launchMiniProgramReq.miniprogramType = 0; //拉起小程序的类型 0-正式版 1-开发版 2-体验版
  12.      let success = await WXApi.sendReq(context, launchMiniProgramReq);
  13.    } catch (e) {
  14.    }
  15.   }
  16. }
复制代码


免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!更多信息从访问主页:qidao123.com:ToB企服之家,中国第一个企服评测及商务社交产业平台。

本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有账号?立即注册

x
回复

使用道具 举报

0 个回复

倒序浏览

快速回复

您需要登录后才可以回帖 登录 or 立即注册

本版积分规则

罪恶克星

论坛元老
这个人很懒什么都没写!
快速回复 返回顶部 返回列表