H5开发流程

    H5其实就是一个微型网页，一个H5的开发时间很少，但是需要用到的功能确实很多，下面就来总结一下一个H5的开发流程。

一、需求分析

        H5也是一个小型的网站，网站的开发就离不开需求分析，只有做好需求分析后才能更好的设计页面，设计接口。下面简单介绍一下接口的设置准则。

      与后端数据的交流一般有两种方式；同步和异步，同步传递的数据可以通过头文件中传递，在php页面中通过php变量的方式获取：$sharekey。而异步获取数据时就要通过接口请求，接口的后台返回值格式和前端的传入值格式要开发人员自己协调，但是微信内为了保证数据安全，一般都会传入五个值：name、key、ukey、timestamp、nonce。

二、处理设计稿

       设计提供的psd稿，需要前端人员根据自己的需要来规整psd稿，将psd按照一个特定的规则还放置，然后通过ps脚本文件来处理psd，生成自己需要的图片文件，将每一个图片里面的信息赋值给图片名，然后再在通过php去读取该图片的信息，生成自己需要的数据格式，即前端页面需要的配置表。

   注：具体的ps脚本文件和php批处理文件存放在我的百度网盘中工作积累文件夹。

三、生成简单页面

      php生成了config文件，然后通过js写配置表，生成简单的页面，然后再在该页面中添加逻辑。我们开发时会通过一个loading.js实现图片资源的预加载和读取配置表。

四、微信分享设置

       微信分享也是一个必不可少的功能，这个功能的实现需要后台去配置公众号等，而前端只需要传递分享标题，分享语和分享图片。微信分享开发的配置在微信开发者文档里面有介绍。

五、音频设置

        音频的问题中，我们在原生audio的基础上写了一个sound对象来操作，如果需要多音频播放，也可以用howler.js库。

六、统计

     可以通过learnCound来实现统计，自己编写的AV.analytics.js文件添加到项目中，然后通过log()添加统计

也可以使用百度统计，具体见官方文档。

七、上传七牛云cdn加速

上传cdn很简单，可以使用工具QsunSync，上传时要设置路径方式和上传方法

今天的文章H5开发流程分享到此就结束了，感谢您的阅读，如果确实帮到您，您可以动动手指转发给其他人。