腾讯云开发者社区-腾讯云

开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

Golang语言社区

Golang语言社区（www.Golang.LTD）专业分享Go语言基础、提高等最新最前沿动态。

专栏作者

1903

文章

2784827

阅读量

585

订阅数

居于H5的多文件、大文件、多线程上传解决方案

文件上传在web应用中是比较常见的功能，前段时间做了一个多文件、大文件、多线程文件上传的功能，使用效果还不错，总结分享下。一、功能性需求与非功能性需求要求操作便利，一次选择多个文件进行上传；支持大文件上传（1G），同时需要保证上传期间用户电脑不出现卡死等体验；交互友好，能够及时反馈上传的进度；服务端的安全性，不因上传文件功能导致JVM内存溢出影响其他功能使用；最大限度利用网络上行带宽，提高上传速度；二、设计分析对于大文件的处理，无论是用户端还是服务端，如果一次性进行读取发送、接收都是不

2018-03-27

3.1K0

从web图片裁剪出发：了解H5中的Blob

刚开始做前端的时候，有个功能卡住我了，就是裁剪并上传头像。当时两个方案摆在我面前，一个是flash，我不会。另一个是通过iframe上传图片，然后再上传坐标由后端裁剪，而我最终的选择是后者。有人会疑惑，为什么不用H5的Canvas和FormData，第一要考虑ie8的兼容性，第二那时候眼界没到，这种新东西光是听听都怕。　　后来随着Mobile项目越做越多，类似的功能开发得也越来越多，Canvas+FormData成为了标配方案。但做的多了却一直没有静下心来研究，浏览器怎么使用H5的方式裁剪并把文件发送出去

2018-03-27

2K0

H5移动开发--强制手机横屏显示

在H5开发手机游戏中，横屏游戏还是主流；竖屏游戏思路一样，本节不做讨论。直接上代码 <!doctype html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <title>h5 手机游戏开发</title> <link rel="stylesheet" href="css/test.css" />

2018-03-27

5.6K0

打造专属自己的html5拼图小游戏

利用canvas切出小块图片我们知道现在的拼图游戏都是由九张小图片依次排列组成的，就是类似九宫格那样。那么以前的做法就是我们利用Photoshop这样的工具把原始大图【尺寸一般都是正方形的哦】切成九张小块的正方形小图，但是这种做法有点不灵活，如果我们要更换图片的话，就得重新去切图，好麻烦。。。不过没关系，现在我们有了canvas！利用canvas我们可以很轻松的做到这些。核心代码如下： var image = new Image(); image.onload = function() {

2018-03-27

1.3K0

H5本地存储详细使用教程--上

H5本地存储有两个API，一个是Web Storage，还有一个是Web SQL。不管是哪一个，都是基于JavaScript语言来使用，接下来我就教你怎么使用H5本地存储，本文篇幅较大，JS代码较多，请耐心阅读。一、Web Storage教程 1、概述：对于Web Storage来说，实际上是Cookies存储的进化版。如果了解Cookie的人几乎一看Web Storage就会用，如果你从来没用过没了解过Cookie，没关系，看了这篇文章照样轻松玩转Web Storage。首先，学习Web Stora

2018-03-27

2.6K0

HTML5游戏引擎深度测评

最近看到网上一篇文章，标题叫做《2016年最火的 15 款 HTML5 游戏引擎》。目前针对HTML5游戏的解决方案已经非常多，但谁好谁差却没有对比性资料。特意花了几天时间，针对文章中出现的12款免费开源引擎做了一次相对完整的对比分析，希望能对大家有所帮助。针对技术类产品对比，通常有多个维度进行对比，不仅仅是技术层面，还有许多非技术层面的内容会影响我们的使用结果。本文从如下几个维度进行多重对比。 2D与3D 编程语言设计理念&功能工作流性能学习资料商业应用 2D与3D、编程语言对比2D与3

2018-03-27

7.8K0

11个基础的HTML5动画工具

如今，在Web开发中最为流行的语言就是HTML5了，它帮助开发者将多样化的内容展现给用户。在过去两三年中，我们共同看到了HTML5的发展，它逐渐在网络的世界中积累了名气和流行度。HTML常常会给我们带来新的技术和特性，使得前端技术不断的发展强大。HTML5受到欢迎的原因也在于它给用户带来的极大便利，当前的大多数浏览器，如Chrome、Firefox、IE等都对它给予支持。 HTML5使得开发者能为你的网站创建出惊人的动画效果。这些很棒的动画效果会为你的网站增添更多吸引力，接着会带来更多的生意。这些用HTML

2018-03-27

1.8K0

【Golang语言社区】H5游戏开发-从零开始开发一款H5小游戏(五) 必要的包装，游戏规则和场景设计

到这里我们已经讲了游戏的整体设计和实现。一个游戏要完整，还需要给它制定一个评分机制，它是整个游戏的关键所在。就好比一部电影，特效再好看，如果剧情狗血，那也是一部烂片。相信大家都玩过一些简单但很吸引人的小游戏。比如很久以前微信上的打飞机，围住神经猫，还有前段时间大火的slither.io。他们都简单易玩，但却能让人肾上腺素飙升，百玩不腻。所以一款好玩的小游戏必须具备了这样的特点，简单易玩，却能给人制造紧张感，有时还能利用一些攀比心理。本游戏也基本具备了这样的特点。计分实现游戏以秒数作为计分，随着时间的

2018-03-27

1.2K0

【Golang语言社区】H5游戏开发-纯javascript模仿微信打飞机小游戏

游戏微信 html5 javascript

纯JavaScript模仿微信打飞机游戏，做网页小游戏的借鉴下，界面设计是竖长形仿手机屏幕风格，游戏效果流畅。具有分数统计，里面的JS封装类中包括有创建飞机类、飞机移动行为控制，创建子弹类，产生min到max之间的随机数，判断本方飞机是否移出边界,如果移出边界,则取消mousemove事件,反之加上mousemove事件，为暂停界面的继续按钮添加暂停事件，创建敌方飞机类、碰撞判断、完成界面的初始化，敌方小飞机一个，我方飞机一个。 //获得主界面 var mainDiv=document.getElem

2018-03-27

2.1K0

【Golang语言社区】H5游戏开发--JavaScript学习：21点游戏

html5 javascript 游戏

一、游戏规则 21点游戏的规则有很多种，我在写这个21点游戏的时候，选取了一种规则，描述如下： 1、游戏共有两名玩家，玩家1（庄家）和玩家2，在我编写的这个21点中，玩家1是电脑，玩家2是你，电脑坐庄。 2、一开始，给你和庄家各发两张牌，你可以看到你的两张牌，庄家的牌一张是明牌，一张是暗牌（暗牌是扣过来的牌，你不知道具体点数是多少）。 3、你和庄家的牌都是从一副牌里发出来的，共计52张（不要大小Joker）。 4、A可以当做1点和11点用，J、Q、K当做10点用，其他牌按面值计算点数。 5、发牌后，你可以选

2018-03-27

1.6K0

HTML5之客户端存储数据

在客户端存储数据 HTML5 提供了两种在客户端存储数据的新方法：localStorage - 没有时间限制的数据存储;sessionStorage - 针对一个 session 的数据存储之前，这些都是由 cookie 完成的。但是 cookie 不适合大量数据的存储，因为它们由每个对服务器的请求来传递，这使得 cookie 速度很慢而且效率也不高。在 HTML5 中，数据不是由每个服务器请求传递的，而是只有在请求时使用数据。它使在不影响网站性能的情况下存储大量数据成为可能。对于不同的网站，数据存储于不同

2018-03-27

1.7K0

【Golang语言社区】前端编程- 从零开始开发一款H5小游戏(一) 重温canvas的基础用法

初衷从萌发写一个小游戏的想法到完成游戏开发用了大概一周的业余时间。这个过程积累了一些经验，也算是参透了一些游戏开发的原理。在这里打算写一个系列教程，讲述怎样从零开始开发一款小游戏。让新者少走弯路，快速入手。也能让自己总结反思，发现问题。在开始介绍如何写游戏前有必要重温一下canvas。它是本游戏的地基，建房子要快，首先地基要牢固。 Canvas Canvas 对一个做前端的人来说再熟悉不过，html5中新增的这个功能为网页创造了无限可能，极大促进了网页富应用的开发。而canvas对于大部分前端来说又是

2018-03-27

1K0

【Golang语言社区】H5游戏开发--从零开始开发一款H5小游戏(二) 创造游戏世界，启动发条

go 游戏 html5

上一节介绍了canvas的基础用法，了解了游戏开发所要用到的API。这篇文章开始，我将介绍怎么运用这些API来完成各种各样的游戏效果。这个过程更重要的是参透一些游戏开发的思路和想法，而不是仅仅知道怎么写代码来完成这个游戏。先用一张图来了解一下整个游戏的构成。 Map表示整个背景地图，作用很简单，就是渲染黑色背景。 Player 表示玩家粒子，它尾巴中带有生命点，我们用Life类来表示。 Enemy为红色的敌人粒子，因为技能粒子和Enemy粒子具有很多共性，所以Skill粒子继承自Enemy粒子。粒子之间

2018-03-27

1.3K0

【H5游戏实例】JS+canvas实现人机大战之五子棋

go 游戏 html5

html代码如下： <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>五子棋</title> <link rel="stylesheet" type="text/css" href="css/style.css"/> </head> <body> <canvas id="chess" width="450px" height="450px"><

2018-03-27

1.8K0

【Golang语言社区】H5游戏开发从零开始开发一款H5小游戏(三) 攻守阵营，赋予粒子新的生命

每个游戏都会包含场景和角色。要实现一个游戏角色，就要清楚角色在场景中的位置，以及它的运动规律，并能通过数学表达式表现出来。场景坐标 canvas 2d的场景坐标系采用平面笛卡尔坐标系统，左上角为原点(0,0)，向右为x轴正方向，向下为y轴正方向，坐标系统的1个单位相当于屏幕的1个像素。这对我们进行角色定位至关重要。 Enemy粒子游戏中的敌人为无数的红色粒子，往同一个方向做匀速运动，每个粒子具有不同的大小。入口处通过一个循环来创建Enemy粒子，随机生成粒子的位置x, y。并保证每个粒子都位于上图坐标

2018-03-27

8130

观察 | H5游戏画面重大突破引擎技术革新媲美手游

从H5游戏诞生以来，总是被人们认为品质不如手游。但技术的发展是迅速的，现在已经出现了一款画面能媲美主流手游品质的H5游戏。这款产品就是由腾讯正版授权，知名H5游戏公司蝴蝶互动研发的《御天传奇H5》。

2018-03-27

9310

【Golang语言社区】H5游戏开发-从零开始开发一款H5小游戏(四) 撞击吧粒子，炫酷技能的实现

go 游戏 html5

本游戏有五种技能粒子，分别是 "护盾"，"重力场"，"时间变慢"，"使敌人变小"，"增加生命"。Player粒子吃了技能粒子后就能表现各种特殊效果。碰撞检测游戏中Player粒子可能会撞击到Enemy粒子，也可能吃到Skill粒子。我们怎么来判断呢？画布中两个粒子的碰撞检测其实很简单，如果是圆形粒子，只需要判断两个粒子圆心的距离是否小于两个圆半径之和就行了。 //index.js function collision(enemy, player) { const disX = player.x

2018-03-27

1K0

【Golang语言社区前端编程】如何选择 H5 游戏引擎

go 游戏 html5

原生手游市场已是红海，腾讯、网易等寡头独霸天下，H5游戏市场或将成为下一个风口。据笔者所知，很多H5游戏开发团队由于选择引擎不慎导致项目甚至团队夭折。如何选择适合团队和项目的引擎，笔者通过学习和项目实践，总结微薄经验，供大家参考，非技术人员也可以将本篇内容作为引擎选择的重要关注点。选择H5游戏引擎的思考维度 1、开发语言的支持 2、2D、3D、VR的支持 3、性能 4、引擎的应用广度 5、设计理念 6、工作流支持力度 7、商业化成熟案例 8、学习资源与技术支持能力首先，我们要知道，当前主流的游戏引擎有哪

2018-03-27

2.4K0

HTML5 游戏引擎深度测评

html5 游戏开源

最近看到网上一篇文章，标题叫做《 2016年最火的 15 款 HTML5 游戏引擎》。目前针对HTML5游戏的解决方案已经非常多，但谁好谁差却没有对比性资料。特意花了几天时间，针对文章中出现的12款免费开源引擎做了一次相对完整的对比分析，希望能对大家有所帮助。针对技术类产品对比，通常有多个维度进行对比，不仅仅是技术层面，还有许多非技术层面的内容会影响我们的使用结果。本文从如下几个维度进行多重对比。 2D与3D 编程语言设计理念&功能工作流性能学习资料商业应用 2D与3D、编程语言对比 2D与

2018-03-22

5.9K0

技术干货分享：如何选择 HTML5 游戏引擎

原生手游市场已是红海，腾讯、网易等寡头独霸天下，H5游戏市场或将成为下一个风口。据笔者所知，很多H5游戏开发团队由于选择引擎不慎导致项目甚至团队夭折。如何选择适合团队和项目的引擎，笔者通过学习和项目实践，总结微薄经验，供大家参考，非技术人员也可以将本篇内容作为引擎选择的重要关注点。选择H5游戏引擎的思考维度 1、开发语言的支持 2、2D、3D、VR的支持 3、性能 4、引擎的应用广度 5、设计理念 6、工作流支持力度 7、商业化成熟案例 8、学习资源与技术支持能力首先，我们要知道，当前主流的游戏引擎有哪

2018-03-22

2.1K0

点击加载更多

社区活动

腾讯技术创作狂欢月

“码”上创作 21 天，分 10000 元奖品池！

Python精品学习库

代码在线跑，知识轻松学

博客搬家 | 分享价值百万资源包

自行/邀约他人一键搬运博客，速成社区影响力并领取好礼

技术创作特训营·精选知识专栏

往期视频·千货材料·成员作品最新动态