前端web worker的作用及请求外部数据

因为在写前端的时候有一个需求:需要每隔1.5s.就去请求一下服务,刷新前端页面的数据;但同时也不能影响前端客户的操作体验;一般我们都是知道前端的javascript是同步的,如果太频繁的去请求后台的数据,就会造成拥堵,影响用户的体验。这个时候就需要用到web worker的作用:后台会启动一个worker线程来重新执行新代码,可以创建多个worker线程。这样就不会与主线程有冲突啦,也不会影响用户的体验啦。不过Web worker也有一些使用限制:无法访问DOM节点,无法访问全局变量或是全局函数。所以之前用的是jQuery Ajax发送请求的,这里就不能用了;只能用原生的ajax请求啦。现在直接上代码了

第一步:先要创建一个worker对象,就相当于你创建一个新线程

var worker =new Worker("../../js/worker.js"); //创建一个Worker对象并向它传递将在新线程中执行的脚本的URL

第二步 :向worker对象(线程方法)传参数 

worker.postMessage(mar_skt);            //向worker发送数据

第三步:worker对象接受传过来的参数,同时也可以会向主线程发送数据

onmessage =function (event){
    var mar_skt = event.data;   //通过evt.data获得发送来的数据
    getHq(mar_skt);       //将获取到的数据发送会主线程
}

第四步:主线程接受worker子线程 请求外部返回的数据

worker.onmessage =function(evt){        //接收worker传过来的数据函数
    var data = evt.data;                //输出worker发送来的数据
    showHq(data);                       //展示行情
}

下面是我的代码

开始在HQ.js文件主线程中创建一个worker对象子线程,

然后在子线程worker.js文件文件中,去执行任务,把请求到的数据返回给住线程

  • 1
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

huidoo888

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值