关键词: Flask HTML5 CSS Javascript Max-Min Search AI
摘要
本次嵌入式作业,完成了井字棋HTML5 APP小游戏的开发,并实现了真机调试,真机安装。本APP前端借助
HTML5+CSS+JavaScript,并采用了jQuery框架。
前端实现了及其细腻的动画,赏心悦目的用户界面,以及良好的异步操作性能。
游戏中与人对战的AI使用Min-Max搜索,由运行在阿里云服务器上的python程序实现。前后端通信采用了现代的 A JAX CROD(ajax跨域)通信技术,利用HTTP协议将json格式的数据在前后端POST。利用Min-Max搜索的深度,可以调节难度。
实验中AI通信良好,一定难度下可以实现保证和棋或赢棋。
本实验利用HBuilderX, appUploader实现了IOS上APP真机联调与开发者协议下APP的安装。本教程的脱水版即将发布CSDN与Github上的个人博客。
目录
基于jQuery与Flask前后端框架,借助A JAX跨域通信技术的人工智能井字棋小游戏 HTML5 APP 的开发
目录
基本概念
HTML5 APP
HTML5历史
HTML5的新特性
HTML5与Flash
Flash将退出历史舞台
HTML5的优势
利用HTML5开发APP的优势成本比较
难度比较
市场推广比较前端与后端
前端后端
后端框架
Min-Max搜索设计流程
需求分析详细说明
结构设计与系统集成前端设计
后端设计瀑布模型
APP功能描述
Icon与启动画面开始界面
短按长按落子设置界面
游戏结束网络错误网络延时
设计教程
IOS开发者证书,APP描述文件获得苹果开发者账号
申请p12证书与描述文件
三、申请ios描述文件(mobileprovision)
HBuilderX打包HTML5APP应用
免费开发者账号打包的app只能通过爱思助手安装! 用Chrome在PC上调试应用
先打开chrome调试
Elements功能调试JS代码
抓包
用JQuery实现开场动画
HTML内容设置CSS
设置动画效果
用JQuery实现用户触发的动画(以落子为例)
用JQuery的A JAX实现HTTP通信——在保持异步回调的前提下保证通信结果获得处理
Flask Web框架的使用——A JAX跨域通信JSON需要的特殊处理Min-Max搜索的实现
感想与心得