html5 worker 实例(一) 为什么测试不到效果


Posted in HTML / CSS onJune 24, 2013

很多人在测试worker api的时候,总是会出现异常,根本测试不到效果。
在使用worker的时候有个必须注意的地方,就是单纯的文本文件是实现不了worker的,你写的实际代码 必须部署到服务器(tomcat.jBoss等)才能运行worker api。
下面写个简单例子

js代码test.js(worker)

复制代码
代码如下:

function messageHandler(e) {
postMessage("worker says: " + e.data + " too");
}
addEventListener("message", messageHandler, true);
postMessage("2222222222");

html代码 index.html

复制代码
代码如下:

<!DOCTYPE html>
<html>
<head>
<title>index.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
</head>
<body>
<script type="text/javascript">
if(typeof(Worker)!=="undefined"){
console.log("zhichi worke");
}else{
console.log("no support!");
}
function messageHandler(e){
console.log(e.data);
}
function errorHandler(e){
console.log(e.message, e);
}
var myWorker = new Worker("task.js");
myWorker.addEventListener("message", messageHandler, true);
myWorker.addEventListener("error", errorHandler, true);
myWorker.postMessage("1 fangsong d");
</script>
</body>
</html>

不是之后直接访问index.html页面,然后在浏览器的console面板中将看到worker发送的字符串(实际应用中一般使用json传送)。
HTML / CSS 相关文章推荐
CSS3 clip-path 用法介绍详解
Mar 01 HTML / CSS
CSS3教程(9):设置RGB颜色
Apr 02 HTML / CSS
CSS改变网页中鼠标选中文字背景颜色例子
Apr 23 HTML / CSS
CSS3 Pie工具推荐--让IE6-8支持一些优秀的CSS3特性
Sep 02 HTML / CSS
HTML5之多线程(Web Worker)
Jan 02 HTML / CSS
html5 Canvas绘制线条 closePath()实例代码
May 10 HTML / CSS
HTML5重塑Web世界它将如何改变互联网
Dec 17 HTML / CSS
HTML5实现简单图片上传所遇到的问题及解决办法
Jan 20 HTML / CSS
HTML5各种头部meta标签的功能(推荐)
Mar 13 HTML / CSS
HTML5中的网络存储实现方式
Apr 28 HTML / CSS
Canvas实现放大镜效果完整案例分析(附代码)
Nov 26 HTML / CSS
关于flex 上下文中自动 margin的问题(完整例子)
May 20 HTML / CSS
HTML5的表单(绝对特别强大的功能)使用示例
Jun 20 #HTML / CSS
利用HTML5画出一个坦克的形状具体实现代码
Jun 20 #HTML / CSS
HTML5 Canvas——用路径描画线条实例介绍
Jun 09 #HTML / CSS
html5的画布canvas——画出简单的矩形、三角形实例代码
Jun 09 #HTML / CSS
html5的画布canvas——画出弧线、旋转的图形实例代码+效果图
Jun 09 #HTML / CSS
HTML5视频支持检测(检查浏览器是否支持视频播放)
Jun 08 #HTML / CSS
HTML5中如何显示视频呢 HTML5视频播放demo
Jun 08 #HTML / CSS
You might like
用PHP创建PDF中文文档
2006/10/09 PHP
zf框架的校验器InArray使用示例
2014/03/13 PHP
使用phpexcel类实现excel导入mysql数据库功能(实例代码)
2016/05/12 PHP
Zend Framework教程之Zend_Helpers动作助手ViewRenderer用法详解
2016/07/20 PHP
一个收集图片的bookmarlet(js 刷新页面中的图片)
2010/05/27 Javascript
浅谈JS闭包中的循环绑定处理程序
2014/11/09 Javascript
.NET微信公众号开发之创建自定义菜单
2015/07/16 Javascript
详解vuex 中的 state 在组件中如何监听
2017/05/23 Javascript
AngularJS页面带参跳转及参数解析操作示例
2017/06/28 Javascript
setTimeout与setInterval的区别浅析
2019/03/23 Javascript
vue 引用自定义ttf、otf、在线字体的方法
2019/05/09 Javascript
微信小程序环境下将文件上传到OSS的方法步骤
2019/05/31 Javascript
17道题让你彻底理解JS中的类型转换
2019/08/08 Javascript
js定时器出现第一次延迟的原因及解决方法
2021/01/04 Javascript
Python中的默认参数实例分析
2018/01/29 Python
Python线程下使用锁的技巧分享
2018/09/13 Python
Python3.4学习笔记之类型判断,异常处理,终止程序操作小结
2019/03/01 Python
Python jieba结巴分词原理及用法解析
2020/11/05 Python
详解CSS3实现响应式手风琴效果
2020/06/10 HTML / CSS
新奇的小玩意:IWOOT
2016/07/21 全球购物
丝芙兰中国官方商城:SEPHORA中国
2018/01/10 全球购物
类如何去实现接口
2013/12/19 面试题
网络安全方面的面试题
2015/11/04 面试题
常用UNIX 命令(Linux的常用命令)
2015/12/26 面试题
毕业学生推荐信
2013/12/01 职场文书
会计学个人自荐信模板
2013/12/13 职场文书
毕业生个人求职信范文分享
2014/01/05 职场文书
知识竞赛活动方案
2014/02/18 职场文书
医药销售自我评价200字
2014/09/11 职场文书
公证书格式
2015/01/23 职场文书
三孔导游词
2015/02/05 职场文书
钱学森电影观后感
2015/06/04 职场文书
小学中队长竞选稿
2015/11/20 职场文书
Pytorch中TensorBoard及torchsummary的使用详解
2021/05/12 Python
python 常用的异步框架汇总整理
2021/06/18 Python
MySQL into_Mysql中replace与replace into用法案例详解
2021/09/14 MySQL