微信开发HTML5轻游戏中的几个坑
发表于 09:40|
来源深海的博客|
摘要：基于微信开发的HTML5游戏，开发者需要克服哪些坑呢？又该如何推广呢？本文转自深海的博客，他分享了具体开发实现过程中，基于微信的Html5 WebApp需要注意哪些细节以及如何用代码实现。
【编者按】现如今微信为各种移动Web的小应用提供了肥沃的土壤，于是乎形形色色的应用孕育而出。人人都可以做开发，但不是每个人都能开发出好的应用，在开发过程中开发者会应注意哪些“坑”呢？本文转自，他分享了在具体开发实现过程中基于微信的Html5 WebApp需要注意的细节以及如何用代码实现。&全文如下：不同于传统的手游商店下载模式，HTML5 手机网页游戏是可以直接运行在微信内置的浏览器里。这段时间团队一直在做微信端的一些产品设计和开发，当然也包含一定的运营工作。做过的东西也不少，微名片、微抢票、微活动、微招聘等一些小case。今天想说的是我们在微信中被玩的最活跃的轻游戏--微刮奖，这东西可以被用来刮书、刮门票、刮套餐，还有客户要用来刮电话费。先上图，感知一下具体样子：而我想分享的是我们在具体开发实现过程中，基于微信的Html5 WebApp需要去克服的一些坑：这个小游戏的基本规则是：限定用户每天刮书次数是2次 （自由刮一次和分享后再刮一次），每天都可刮奖为此，我们希望实现的思路首先是限定在只能使用微信中玩，实现代码如下：if (!HttpContext.Current.Request.Browser.IsMobileDevice)
var result = new RedirectResult("url", true);
filterContext.Result =
if (string.IsNullOrEmpty(HttpContext.Current.Request.UserAgent))
var result = new RedirectResult("url", true);
filterContext.Result =
if (HttpContext.Current.Request.UserAgent.IndexOf("MicroMessenger") == -1)
var result = new RedirectResult("url", true);
filterContext.Result =
}这招通过UserAgent的判断思路貌似网上大家也用的比较多，不用却依然存在挺多坑：1. 初级问题：iOS和主流Android机器没问题，但碰到Windows Phone，就直接在微信中跳出去无法玩。原因是微信中默认的UserAgent是MicroMessenger，在这些机器的微信版本中不存在，所以为了解决Windows Phone，我们加入了如下代码：　var useragent = HttpContext.Current.Request.UserAgent.ToLower();
if (useragent.IndexOf("Windows Phone".ToLower()) != -1)
base.OnActionExecuting(filterContext);
}2. 高级问题：有高人直接使用一些插件工具，伪造MicroMessenger的UserAgent，这样理论上就可以在任何可以打开网页的浏览器中玩了，解决此问题，我们利用的是微信的sdk中接口：仅当用户在微信中使用时执行控件初始化刮奖操作，否则其他终端浏览就会一直处于loading状态。　dataForWeixin.callback = function () {
//一些初始化的操作
}关于微信的接口大家直接阅读原文，这边不直接贴代码出来了，不然贴不下。上面的思路做了很多事，但对我们的业务规则来说还有一个很致命的bug没有解决。这个bug就是只要用户手动清除微信中的cookie和缓存信息，然后重新进入活动，就能无限次刮奖，理论上是百分百中奖了。这是由于我的规则将判断当前微信用户是否刮过奖的判断依据放在了cookie中，貌似除此以外也没有其他办法。想利用openid，但我们的微信订阅号，如果从朋友圈过来的话都无法获取openid，还是依然存在上诉问题。&为了解决这个问题，最后我们终于找到了一条思路，借用微信服务号的授权接口，基本思路如下：用户进入页面loading=》程序调用我们另外一个微信服务号的授权接口，返回openid=》将openid存入cookie（若不存在或过期，则重新执行前面步骤）=》根据openid从数据库判断本期活动刮了几次，同时，这个过程会自动判断用户是否在微信中玩游戏，否则回调将一直处于loading状态。整个过程使用下来，还比较流畅。这边贴一下授权相关的代码：#region 微信授权
public ActionResult WeixinLogin(string CurrentUrl)
string url = WeixinOAuth2.Authorize(Server.UrlEncode(CurrentUrl));
return RedirectPermanent(url);
public ActionResult WeixinCallback()
if (!string.IsNullOrEmpty(Request["code"]))
// 获取AccessToken参数
var param = WeixinOAuth2.GetAccessToken(Request["code"]);
string url = string.Format("{0}#access_token={1}&openid={2}&expires_in={3}&state={4}", ConfigHelper.GetValue("Weixin_Callback"), param.access_token,param.openid,param.expires_in, Server.UrlDecode(Request.QueryString["state"]));
//重新跳转到回调页面，保持腾讯登录相同风格
return Redirect(url);
return View();
　　　　/// &summary&
/// 授权请求页面
/// &/summary&
/// &param name="flag"&0为获取微信基本信息 1为获取微信openid接口&/param&
/// &returns&&/returns&
public static string Authorize(string ReturnUrl)
string url=string.Format("https://open.weixin.qq.com/connect/oauth2/authorize?appid={0}&redirect_uri={1}&response_type=code&scope=snsapi_base&state={2}#wechat_redirect", Weixin_AppKey, Weixin_GetOpenIDCallback, ReturnUrl);
　　　　#endregion至此，在微信中解决如何判断当前用户的唯一性问题，基本上完全可以搞定。针对这套方案唯一存在的风险就是微信的接口的通畅性和稳定性。当然，在整个开发过程中还有很多其他问题需要一一克服，比如，微信分享后回调的实现，相应很多朋友都要用，还比如这种小游戏我们甚至需要支持grps下流程访问，不可能那些很大的游戏框架，这怎么搞等等问题，这些打算后面再慢慢写些文章分享，今天的东西够多了，先歇歇去。原文出自：由CSDN和《程序员》杂志联合主办的&&将于8月23日在北京举行，主办方还邀请了来自于一线的微信开发商技术负责人或资深工程师从企业应用开发高级篇、智能客服与LBS、微信支付、微信上的HTML5社交应用、微信小店开发等角度为与会者带来实战分享（&&）。目前报名处于优惠票价阶段，通过申请加入CSDN CTO俱乐部即可享受8折购票价格（票款中均含午餐），在前完成付款的同学还将免费获赠微信开发图书一本（两选一，活动现场发放）。光开发出一款产品还不行，还需有得到有效的推广，那么如何利用免费的方式来推广呢？前Zynga中国总经理、云智联CEO田行智将带来《》的主题分享，解读《碰碰里》是如何验证0推广、无任何激励手段，但却拥有每天100K 自然增长的微信HTML5应用。欢迎大家到现场与田行智深度沟通。目前，&（持续关注更新）。另外，主委会还开设了&，欢迎技术精英自荐和互相推荐，也可以直接联系&。此外，主办方还特别开设了&（&）现在就去&。微信开发者QQ群：（已满）和微信开发者② QQ群：，欢迎加入交流。相关阅读：&关注&，了解更多研发资讯，参与互动讨论；当然您可以向我们推荐更多有趣、有质量的文章。&
推荐阅读相关主题：
CSDN官方微信
扫描二维码,向CSDN吐槽
微信号：CSDNnews
相关热门文章微信“跳一跳”代练兴起，为何这种小游戏还需要代练？微信“跳一跳”代练兴起，为何这种小游戏还需要代练？安全净化百家号最近微信小游戏《跳一跳》火爆朋友圈。类这和当初的QQ农场有点类似。不同的是，跳一跳没有收费项目。还滋生了一个“灰色产业”——所谓的代练和辅助工具。因为有排行榜的存在，很多人都想冲向第一，提升一下“逼格”，结果发现：有难度。但回头一看，排行榜还有一万多分的，有人就不平衡了，差距啊。于是就想到：有没有工具啊、代练啊之类的？找马云问一下呗。一查，真的有，也不贵，花小钱提升一下逼格，也值啊。真的值？十几块钱事小，自己用了多年的微信封了怎么办？大家都知道，最近很多人手机装多个微信客户端的，都给封号了，还有安卓模拟器，最好都别用。腾讯在17年下半年一直在打压大量发布信息的号，安卓模拟器和多开就是重点排查对象的。而这些所谓的跳一跳游戏“辅助”、“工具”，都需要用安卓模拟器登录微信。账号安全且先不说，搞不好游戏没刷上去，还被官方当做营销号给封了就不值当了。这个“跳一跳”小游戏冲分其实不难，安静下来手动冲个三百分应该没啥问题。附一份指南：其中又有：下水道停2秒+5分魔方 停2秒+10分便利店停2秒+15分播放器停2秒+30分微信号也算是蛮重要的东西，切记不要老是去使用第三方工具。2018年第一帖，祝所有读者：新年新气象！本文仅代表作者观点，不代表百度立场。系作者授权百家号发表，未经许可不得转载。安全净化百家号最近更新：简介:绿色生活提倡环保，健康生活幸福人生。作者最新文章相关文章你可能知道微信小游戏“怎么跳”，但你绝对不知道微信“怎么赚”你可能知道微信小游戏“怎么跳”，但你绝对不知道微信“怎么赚”一首日光卫百家号“跳！跳！跳！”，大家应该被最近微信这个跳一跳小游戏吸引着了吧。这个小游戏是微信小程序的一个类目，它即点即玩，无需下载安装，可以和微信内的好友一起玩，比如PK、围观等，享受小游戏带来的乐趣，吸引着众多人玩。微信如今不仅仅只是聊天发信息，微信开发团队现在开发出了很多有趣的小程序，而这个“跳一跳”就在其中。不过，今天的主题不在这个“跳一跳”，而在于“赚一赚”。我们都知道微信跟很多平台有合作，最被大家熟知的要数拼多多了，互联网服务和电商结合在一起，确实很吸引人。腾讯入股拼多多，拼多多借助微信的力量可以说发展的越来越好，如今可算是3+10的用户量。在拼多多上，我们可以开一个拼多多店铺，然后我们专业的老师(zf五五三六六)指导你去其他平台采集高销量的商品到自己店铺上出售，等有买家购买了就能赚取差价。好好做的话，基本上一个店铺一个月收益两千到七千左右是可以的。“跳一跳”确实很好玩，虽然只是个小程序，但是带给人们的刺激感不言而喻。不过，我们在玩过游戏后，不如来“赚一赚”。即使不会也没关系，这方面不需要囤货，也不需要给店铺做装修和推广，只要有高效的指导，运营好店铺，怕是自己也会开心的跳起来。本文仅代表作者观点，不代表百度立场。系作者授权百家号发表，未经许可不得转载。一首日光卫百家号最近更新：简介:一个人的态度，决定他的高度。作者最新文章相关文章24小时热文
未来3区科技
今日体育热点
6秒后自动进入首页