当前位置: 代码迷 >> HTML/CSS >> cocos2d-html5初探学习札记(1)-配置环境
  详细解决方案

cocos2d-html5初探学习札记(1)-配置环境

热度:535   发布时间:2012-06-20 20:37:21.0
cocos2d-html5初探学习笔记(1)-配置环境

小满(bill man)个人原创,欢迎转载,转载请注明地址,小满(bill man)的专栏地址http://blog.csdn.net/bill_man

期盼已久的cocos2d-html5版本终于在日前发布了alpha版本,从本篇文章开始我将我的自学cocos2d-html5历程与大家分享。

本篇介绍配置环境,为什么需要配置环境呢,这是由于浏览器的一些限制,浏览器禁止在本地访问诸如XMLHttpRequest函数,而cocos2d引擎中的很多文件的读取都要依赖于这些方法,所以我们需要将文件上传到一个web服务器上,或者上传到一个本地的开发环境中,如MacMAMPwindowsWAMP。否则浏览器就会出现如下的报错(chrome浏览器)

其实抛开引擎的角度,单纯从html5的角度讲,有些特性也需要将文件上传到一个web服务器上,或者上传到一个本地的开发环境中,比如图像的像素级操作,如果图像和控制画布的javascript不在同一个位置,那么画布对于访问这个图像的像素级操作会有严格的限制。

我这里选择的是XAMPP,另外测试的浏览器我选择的是chrome,由于其提供了很不错的开发者支持,js的编辑器我采用的事editplus

首先从http://www.apachefriends.org/en/xampp.html下载XAMPP,我选择的是windows版本的,然后从如下列表中选择第一个


然后有三个版本可供选择,分别是安装版,zip压缩版,7zip压缩版,这里我选择的是zip压缩版。下载完成解压便可以使用


解压完成后点击setup_xampp.bat便可完成安装,然后点击xampp_start.exe使用,需要停止时点击xampp_stop.exe。然后打开我们的浏览器在地址栏中输入如下地址出现如下页面可以证明安装成功地址:http://localhost/xampp/index.php


然后是下载cocos2d-html5,网址为

http://cocos2d-x.googlecode.com/files/cocos2d-html5-v0.5.0-alpha.zip 

下载之后解压,将目录下的全部文件拷贝到xampp的目录htdocs下,在浏览器中输入如下网址http://localhost/index.html。看到如下界面,证明我们之前的操作成功。


然后我们可以尝试启动下这几个例子:

Helloworld


从下一篇开始我将逐个介绍cocos2d-html5的例子。

如有错误之处,希望大家多多指正