微信小游戏分享功能

简介: 微信小游戏分享功能
推荐阅读:

今天给大家分享一下微信分享转发功能,话不多说,直接干

方法一:

1.在egret中打开Platfrom.ts文件,添加代码如下(当然,你也可以直接复制粘贴)
在这里插入图片描述
代码如下:

/** 
 * 平台数据接口。
 * 由于每款游戏通常需要发布到多个平台上,所以提取出一个统一的接口用于开发者获取平台数据信息
 * 推荐开发者通过这种方式封装平台逻辑,以保证整体结构的稳定
 * 由于不同平台的接口形式各有不同,白鹭推荐开发者将所有接口封装为基于 Promise 的异步形式
 */
declare interface Platform {

    getUserInfo(): Promise<any>;

    login(): Promise<any>;
        //转发菜单
    showShareMenu(): Promise<any>;

}

class DebugPlatform implements Platform {
    async getUserInfo() {
        return { nickName: "username" }
    }
    async login() {
    }
        //被动分享
    async showShareMenu() {
    }
    
}
if (!window.platform) {
    window.platform = new DebugPlatform();
}
declare let platform: Platform;

declare interface Window {

    platform: Platform
}

2.在Main.ts中调用Platfrom.ts新增加的方法
在这里插入图片描述

private async runGame() {
        await this.loadResource()
        this.createGameScene();
        // const result = await RES.getResAsync("description_json")
        // this.startAnimation(result);
        await platform.login();
        const userInfo = await platform.getUserInfo();
        console.log(userInfo);
        await platform.showShareMenu();
    }

3.打包成微信小游戏
在这里插入图片描述

4.使用微信开发者工具打开微信小游戏项目,打开platfrom.js,添加代码
在这里插入图片描述

showShareMenu() {
    return new Promise((resolve, reject) => {
      wx.showShareMenu({
        withShareTicket: true
      })
      wx.onShareAppMessage(function callback(res){
        return {
          title: '被动分享',
          imageUrl: "resource/assets/bg.jpg",
          success: (res) => {
            console.log("转发成功", res);
          },
          fail: (res) => {
            console.log("转发失败", res)
          },
        }
      })
    })
  }
shareAppMessage() {
    return new Promise((resolve, reject) => {
      wx.shareAppMessage({
          title: '主动分享',
        imageUrl: "http://www.9665.com/uploadfile/2017/0717/20170717043846826.png",
          query: "a=1&b=2&c=3&d=4",
          success: (res) => {
            console.log("转发成功", res);
            resolve(res);
          },
          fail: (err) => {
            console.log("转发失败", err)
            reject(err);
          },
      })
    })
  }

参数可根据实际情况写。
其他分享API同理,API及参数详见https://developers.weixin.qq.com/minigame/dev/document/share/wx.getShareInfo.html
platform.js主动分享代码:
注意:主动分享功能可能在微信开发工具上不体现,因此,博主建议在手机上预览。
下面介绍一个分享成功后显示传入参数的方法
在打开微信开发工具,在game.js中添加代码如下:
在这里插入图片描述

wx.onShow((option) => {
  console.log(option);
})

在手机上预览,进行被动转发,从分享链接打开分享的小游戏,在控制台可以查看到传入的参数如下:
在这里插入图片描述

方法二:

(1)添加微信ts库文件,并放在egret指定位置(没有的朋友可以点击左侧加群下载):
在这里插入图片描述
(2)在egret中新建脚本,并添加分享方法,效果如下:
在这里插入图片描述

class WxShare {
    /**
     * 设置默认分享
     */
    public static setDefaultShare() {
        console.log('set_default_share');
        wx.showShareMenu({
            withShareTicket: true,
            success: (res) => { console.log('setting_success'); console.log(res); },
            fail: (err) => { console.warn(err) }
        });
        wx.onShareAppMessage(function () {
            return {
                title: GameConfig.getShareTitle() || '',
                imageUrl: GameConfig.getShareImg() || ''
            }
        });
    }

    /**
     *主动分享
     */
    public static async shareGame(type?: string, title?: string, imageUrl?: string) {
        // 不传type时,默认为普通分享
        type || (type = 'normalShare');
        // 不传title时,为默认title
        title || (title = GameConfig.getShareTitle());
        // 不传imageUrl时,为默认image
        imageUrl || (imageUrl = GameConfig.getShareImg());

        return new Promise((resolve, reject) => {
            wx.shareAppMessage({
                title: title,
                imageUrl: imageUrl,
                query: "a=1&b=2",
                success: res => {
                    resolve(res);
                    console.log('主动分享成功');
                },
                fail: (err) => { resolve(null); }
            })
        })
    }
}

(3)在main.ts中调用被动分享:
在这里插入图片描述

// 设置默认分享
WxShare.setDefaultShare();

(4)自定义主动分享按钮,添加监听事件(绿框里面的内容可根据实际情况填写):
在这里插入图片描述
(5)在main.ts的返回前台时进行主动分享的输出,以获取分享成功时主动分享方法传出的query参数:
在这里插入图片描述
注意:在这个时候,你如果直接粘贴代码或许会出现下面错误:
在这里插入图片描述
这个时候我们的解决办法是跳转到onShow函数,去为这个函数添加一个形参,如res等。
在这里插入图片描述

相关文章
|
5月前
|
存储 缓存 Unix
微信小游戏制作工具中实现计时功能
微信小游戏制作工具中实现计时功能
148 0
|
4月前
|
编解码 数据可视化 小程序
微信小游戏开发(第一篇
微信小游戏开发(第一篇
156 0
|
5月前
微信小游戏制作工具中的分享功能怎么用?
微信小游戏制作工具中的分享功能怎么用?
30 0
|
10月前
|
Java Maven
集成一个以官网(微信,QQ,微博)为标准的登录分享功能
今天要分享的是一个老生常谈的一个功能,也是网上一搜一大片的技术点,没什么技术含量,就是整合一下,提供一下方便,相对于友盟,ShareSdk中夹杂着一些别的功能,此文封装的绝对纯净,除了官网所提供的,不夹杂任何的代码逻辑,登录就是登录,分享就是分享,实实在在的以官网为标准。
|
12月前
|
存储 Serverless
微信小游戏制作工具中的函数应该如何使用
在微信小游戏制作工具中是没有私有函数这个概念的,也就是说所有的函数都是公共的,大家都可以使用,而且函数也没有返回值的概念,想拿到函数运行的结果只能通过设置一个全局变量,将结果存储在全局变量中,然后通过这个全局变量来使用。这种方法有很多的弊端,尤其是在有大量的克隆体存在时,每个克隆体都使用同一个函数,都去设置同一个全局变量,就会造成意想不到的结果。
219 0
|
12月前
|
移动开发 数据可视化 开发工具
微信小游戏制作工具与 Scratch 的区别
不少同学问微信小游戏制作工具跟 Scratch 有什么不同,它们看上去是有一些类似的,比如说都是使用的积木化的编程方式(这应该是最大的相似点),它们之间到底是不是一个东西呢?我要学习的话应该选择哪个呢? 我今天专门录制了一段短视频,从两个角度来分析了它们之间的区别。如果你更愿意看视频的话,可以忽略下方的文字,直接看视频(另外欢迎大家关注我的视频号,学习更多与做游戏有关的知识和内容)。
210 0
|
12月前
微信小游戏无代码开发视频教程合集3
嗨!大家好,我是小蚂蚁。 昨天给大家整理了一份图文教程的合集资料,有同学问了,有没有视频学习资料呀!俺就喜欢喜欢看视!这个咱也有。这篇给大家整理一下今年录制的几个视频的合集,建议收藏,假期安排时间,好好学习。悄悄的做个游戏,然后惊艳很多人。 这些视频都是免费的,强烈建议收藏,另外如果对你有帮助的话,欢迎点赞,分享鼓励小蚂蚁继续创作。
80 0
|
12月前
微信小游戏无代码开发视频教程合集2
嗨!大家好,我是小蚂蚁。 有同学问了,有没有视频学习资料呀!俺就喜欢喜欢看视频学呢!这个咱也有。这篇给大家整理一下今年录制的几个视频教程的合集,建议收藏,假期安排时间,好好学习。悄悄的做个游戏,然后惊艳很多人。 强烈建议收藏,另外如果视频对你有帮助的话,欢迎点赞,分享鼓励小蚂蚁继续创作。
65 0
|
12月前
|
开发工具
微信小游戏无代码开发视频教程合集1
昨天给大家整理了一份图文的合集资料,有同学问了,有没有视频学习资料呀!俺就喜欢喜欢看视频学呢!这个咱也有。这篇给大家整理一下今年录制的几个视频教程的合集,建议收藏,假期安排时间,好好学习。悄悄的做个游戏,然后惊艳很多人。 强烈建议收藏,另外如果视频对你有帮助的话,欢迎点赞,分享鼓励小蚂蚁继续创作。
80 0
|
12月前
|
缓存 小程序 数据库
微信小游戏开发系列教程
嗨!大家好,我是小蚂蚁。这里整理了一下公众号中写过的一些教程文章,它们已经帮助过很多人做出了自己的第一款游戏,希望还能够继续帮助更多想要做游戏的朋友,进入游戏开发世界的大门。
77 0

热门文章

最新文章