Partagez plusieurs pièges dans le développement de jeux légers HTML5 sur WeChat

Pendant cette période, l'équipe a réalisé un peu de conception et de développement de produits sur WeChat, ce qui comprend bien sûr également certains travaux opérationnels. J'ai fait beaucoup de choses, y compris des micro-cartes de visite, des micro-récupérations de billets, des micro-activités, des micro-recrutements et d'autres petits cas.

Ce dont je veux parler aujourd'hui, c'est le jeu de lumière le plus actif auquel nous jouons dans WeChat : les prix à micro-rayures. Cette chose peut être utilisée pour gratter des livres, des billets, des colis, et est également utilisée par les clients Scratch. la facture de téléphone.

Prenez d'abord une photo pour avoir une idée de l'apparence spécifique :

                                                                              Quelques écueils que Html5 WebApp doit surmonter :

Les règles de base de ce mini-jeu sont : les utilisateurs sont limités à 2 fois par jour (une fois gratuitement et à nouveau après partage), et vous pouvez gratter des prix tous les jours

À cette fin, l'idée que nous espérons mettre en œuvre est de limiter d'abord le jeu à WeChat uniquement. Le code d'implémentation est le suivant :

　　　　　　if (!HttpContext.Current.Request.Browser.IsMobileDevice)
            {                
            var result = new RedirectResult("url", true);
                filterContext.Result = result;               
                 return;
            }            
            if (string.IsNullOrEmpty(HttpContext.Current.Request.UserAgent))
            {                
            var result = new RedirectResult("url", true);
                filterContext.Result = result;                
                return;
            }            
            if (HttpContext.Current.Request.UserAgent.IndexOf("MicroMessenger") == -1)
            {                
            var result = new RedirectResult("url", true);
                filterContext.Result = result;                
                return;
            }

Ceci La méthode de jugement en utilisant UserAgent semble être utilisée par de nombreuses personnes sur Internet. , mais il y a encore de nombreux pièges s'il n'est pas utilisé :

1. Problème de base : les machines IOS et Android grand public vont bien, mais quand il s'agit de Windows Phone, il sera directement Vous ne pouvez pas jouer après avoir sauté hors de WeChat. La raison en est que le UserAgent par défaut dans WeChat est MicroMessenger

, qui n'existe pas dans la version WeChat de ces machines, donc afin de résoudre le problème du Windows Phone, nous avons ajouté le code suivant :

　　　　　　var useragent = HttpContext.Current.Request.UserAgent.ToLower();            
　　　　　　if (useragent.IndexOf("Windows Phone".ToLower()) != -1)
            {                
            base.OnActionExecuting(filterContext);                
            return;
            }

2. Question avancée : Certains experts utilisent directement des outils plug-in pour forger le UserAgent de MicroMessenger, afin qu'en théorie il puisse être joué dans n'importe quel navigateur qui peut ouvrir des pages Web (grâce à l'ami du groupe @阿(l'altruisme de Bao), pour résoudre ce problème, nous utilisons l'interface du SDK de WeChat : ce n'est que lorsque l'utilisateur l'utilise dans WeChat que l'opération d'initialisation et de scratch du contrôle est effectuée, sinon autre la navigation dans le terminal sera toujours en état de chargement.

　　　　dataForWeixin.callback = function () {            //一些初始化的操作
        }

Concernant l'interface WeChat, merci de lire directement le texte original Je ne publierai pas le code directement ici, sinon il ne sera pas publié. .

L'idée ci-dessus a fait beaucoup, mais il y a encore un bug très fatal dans nos règles commerciales qui n'a pas été résolu. Merci à @冰milkteachildren's shoes pour vos commentaires positifs.

Ce bug est que tant que l'utilisateur efface manuellement les cookies et les informations mises en cache dans WeChat, puis réintègre l'événement, il peut gratter le prix un nombre illimité de fois. En théorie, il gagnera. le prix 100% du temps. En effet, mes règles servent de base pour juger si l'utilisateur actuel de WeChat a gratté le prix dans le cookie. Il semble qu'il n'y ait pas d'autre moyen. Nous voulons utiliser openid, mais notre compte d'abonnement WeChat ne peut pas obtenir openid si nous venons de Moments. Il y a toujours un problème d'appel.

Afin de résoudre ce problème, nous avons finalement trouvé une idée, empruntant l'interface d'autorisation du compte du service WeChat. L'idée de base est la suivante :

L'utilisateur entre dans la page chargement = ". Le programme appelle notre autre service WeChat L'interface d'autorisation du numéro, renvoie openid => Stocke l'openid dans le cookie (s'il n'existe pas ou expire, réexécutez les étapes précédentes) => Déterminez combien de fois l'activité en cours a a été extrait de la base de données sur la base de l'openid. Dans le même temps, ce processus déterminera automatiquement l'utilisateur s'il doit jouer à des jeux dans WeChat, sinon le rappel sera toujours en état de chargement. L'ensemble du processus est relativement fluide après son utilisation. Voici le code lié à l'autorisation :

　　　　#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("http://www.php.cn/{0}&redirect_uri={1}&response_type=code&scope=snsapi_base&state={2}#wechat_redirect", Weixin_AppKey, Weixin_GetOpenIDCallback, ReturnUrl);            
        return url;
        }　　
　　　　#endregion

À ce stade, il est fondamentalement possible de résoudre le problème de savoir comment déterminer l'unicité du courant utilisateur dans WeChat. Le seul risque de cette solution est la fluidité et la stabilité de l’interface de WeChat.

Bien sûr, il existe de nombreux autres problèmes qui doivent être surmontés un par un pendant tout le processus de développement. Par exemple, la mise en œuvre du rappel après le partage sur WeChat est utilisée par de nombreux amis. besoin de prendre en charge grps pour ce petit jeu. Il est impossible d'accéder à ces grands frameworks de jeu, comment faire cela, etc. Je prévois d'écrire quelques articles pour les partager plus tard, donc je vais d'abord me reposer. .

Pour en savoir plus sur plusieurs pièges liés au développement de jeux légers HTML5 sur WeChat, veuillez prêter attention au site Web PHP chinois pour les articles connexes !