你踩过几个？微信H5小游戏开发中的那些坑

calx 发布于2019-08-26 11:54 / 902人阅读

摘要：眼下小游戏特别火，不少团队也陆续启动了微信小游戏的项目，并于立项前期进行技术预研究。但从微信官方文档看却能发现不少坑。对微信小游戏和浏览器之间的运行环境差异无感知，非常友好。微信小程序要求开发者的服务器支持协议。

眼下小游戏特别火，不少团队也陆续启动了微信小游戏的项目，并于立项前期进行技术预研究。但从微信官方文档看 , 却能发现不少坑。

一、运行环境的坑

1.API兼容性

1.1、网络API

BOM的核心是windows，表示的是一个浏览器的实例，在网页中自定义的任何一个对象、变量和函数，都以windows作为其全局对象；缺乏Dom意味着http、websocket及本地存储等通信用的API使用就会遇到问题，好在微信提供了这两个API的私有实现，我们要做的就是适配。

适配的基本思路是检测是否是运行再微信平台，然后利用JS动态语言特性, 对BOM的API进行动态重写 , 优缺点如下：

1、优点是API调用者无需做任何改动,适配成本几乎为0。对微信小游戏和浏览器之间的运行
环境差异无感知，非常友好。

2、缺点是会增加代码体积，但代码体积的增加带来的损失几乎可以忽略不计。
这种适配方案的性价比很高, 适配HTTP代码示例如下:

1.2、微信的模块化

微信小游戏提供了 CommonJS 风格的模块 API，可以通过 module.exports 和 exports 导出模块，通过 require 引入模块 . 这与浏览器引入JS文件的方式截然不同 , 中间有一个隔离层。
让我们举个例子来说明模块化带来的问题。
通常我们在浏览器上使用某个js文件里面自定义的类，通过
标记可以直接使用。

但在微信中不可以这样.需要把API都导入到一个对象上，使用时在加这个前缀.导致很多代码需要修改，那么如何避免增加这个前缀呢？
针对这种情况 , 解决的思路是将所有外部需要用到的方法和对象动态挂靠到window对象上去，将上面的代码稍做修改示例如下:

工作流变化

由于微信小游戏没有Dom和Bom，所以很多依赖Dom和Bom的库都不能直接用，比如 jquery。
微信的这套环境会或多或少会引起我们的工作流变化，使用第三方游戏开发引擎(比如Cocos Createor/Egret/Laya)可以弥补这些问题带来的损失。

二、资源限制

1、每个小游戏允许上传的代码包总大小为 4MB。
解决方法1:压缩js文件，图片资源放在服务器上做预加载。
解决方法2:使用第三方引擎的资源管理功能。

2、微信小程序要求开发者的服务器支持https,wss协议。
解决方案:服务器启用HTTPS。实现的方式有很多,推荐Nginx反向代理。

三、发布审核

小游戏开发完成后发布上线需要具备如下的资格：
1: 服务器域名备案
2: https wss支持
3: 软件著作权证书复印件+盖章签名
4: 微信公众平台帐号及AppID
5: 开发者工具wechat_devtools_1.02.1803210_x64
6: 游戏自审报告复印件+签名
7: iOS开发中帐号(可选,没有则填空)
8: 游戏版号(开通微信支付需要)
9:企业开发者身份+对公帐号(开通微信支付需要)

GPU云服务器云服务器游戏开发中的人工智能. 微信开发游戏html 微信小程序那些平台微信h5

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/107797.html

小程序开发坑点总结

摘要：整个小程序所有分包大小不超过单个分包主包大小不能超过微信小程序主流框架对比应该算是最早发布的小程序开发框架，提供了类的语法风格和特性，现阶段应该也是应用最广泛的框架吧。不过微信官方为了防止下载离线包的时间过程，也严格限制了小程序包的体积。那些年我们踩过的坑css样式不能引用本地图片资源，只能引用线上资源(background-image)，引用本地图片资源只能用标签。{{}}不能执行...

lowett 2019-08-30 15:44 评论0 收藏0
flex布局踩过的那些坑

摘要：接下来说说我踩过的那些坑布局版本兼容问题布局自提出之后，变化过好几个版本标志标志标志新增了对项的规定草案阶段兼容方案父级布局不用考虑其他属性都对应相关的版本方案，目前项目中是只写最新的方案，由自动添加兼容方案。接触H5项目后，开始了解到flex布局，功能非常之强大，用起来相当之舒服。基本的知识介绍就不说了，参考http://www.ruanyifeng.com/blo...。接下来...

刘玉平 2019-08-29 11:07 评论0 收藏0