‘壹’ 微信小程序怎么实现前端和后端实时通信
主流的后端语言是php,因为维护比较好做,因为国内的后端php人才非常多;或者你用第三方的小程序制作平台搭建小程序,压根不需要懂技术。
‘贰’ 怎么使用 JavaScript 将网站后台的数据变化实时更新到前端
要实现这个功能,要用到ajax获取后端数据,和前端js定时器的知识,
首先自定义一个ajax获取要显示在html页面上的数据的方法,例如方法getdata,这个方法把获取的返回值,通过js动态的显示到html页面要显示的区域,然后再写一个js定时器来实现实时调用数据,如:
<script>
//定时器 异步运行
function hello(){
alert("hello");
}
var t2 = window.setTimeout("hello()",3000); //定时器
//window.clearTimeout(t2);//去掉定时器
</script>
把里面的hello方法换成你ajax获取数据的方法名,然后改下定时器里面的方法名和时间,这里设置的是3秒钟执行一次可以设置成你自己要的数据,就实现了你要的页面实时调用数据了。
‘叁’ 写给产品经理之前端是如何展示后端数据的
移动互联网的迅猛发展让移动APP呈现出爆发之势,这两年更是移动开发程序员的春天。
今天的互联网上充斥着产品与技术的撕逼。也许你会问产品经理到底要不要懂技术?由此引申出,产品经理到底要不要懂设计?产品经理到底要不要懂运营?产品经理到底要不要懂市场?产品经理到底要不要懂业务?这所有问题的来源都是大家对于产品经理的工作认识不一致。
每个人心中都有一个产品经理的定义,产品经理在技术方面更多的是去统筹和规划。不是画画图写写文档就可以了。这里面更多的需要的是对逻辑的梳理和拆分。
例如很简单的一个app内嵌发红包的活动,产品经理需要确定整个活动的流程。从用户进入页面的那一瞬间就应该被产品经理掌控。他的每一个步骤,每一个操作会带来什么结果,有哪些变量会导致活动进程失败,这些都要产品去考虑。等到活动逻辑和过程全部梳理完成,下面就要进行拆分了。还是以发红包为例,红包中金额是客户端写死还是服务端进行计算,红包领取资格需要服务端返回几种结果,每种结果对应客户端的提示是什么,用户领取红包以后服务端需要记录那些信息(帐号,uid,领取时间,金额,是否使用等),客户端哪些地方需要加入计数器进行数据统计。总结起来其实就是,产品经理需要根据开发的每一个环节,将所有内容分类整理,并分发给不同部分的开发进行研发。最后,还需要给测试准备好check list,当测试按照check list测试完成以后,才可以上线。
以上种种都需要产品对前端如何显示后端数据有一个清晰的认识才能规划好数据如何展示。是APP写死呢还是后台返回,在用户任务进行的时候有哪些可能case。只有搞清楚这些,产品才能在实际的开发中掌握好整个项目的流程与进展,才能不被开发给糊弄。
简单的说,前端仅仅将后端返回的数据展示在页面上,不做过多的逻辑处理。前端需要关心的是,数据如何更好的展示出来,页面效果如何做出来,以及其性能问题。
而后端就是负责对这些数据进行处理,提供给前端展示。
前端一般有H5、android、ios等多端界面。数据不要轻易写死在前端里面,不然到时候三端都要修改,费时费力。而将这些变化多数据让后端进行处理,前端将这个数据取出来显示出来就行了。
举个例子吧,下图是一个美团app首页团购的展示效果
上方美食等8个icon一般为固定展示栏目,非特殊情况不会修改。那么前端一般是写死在app中,等到需要更新的时候更新app即可。
而下方猜你喜欢是一个列表,该列表数据经常变化,数据写在服务端维护,app取出数据进行展示即可。
首先,前段对页面的展示是分两步走的。
第一、在本地绘制好界面,当然此时未连api会填充一些假数据,或写一些默认值。
第二、连api进行数据获取,将数据填充进界面。
既然如此,咱们简单看下前端拿到的数据到底长什么样的吧。
现在前端获取到的数据基本是json数据。
不需要特别懂里面每一个的含义,只需要知道,前端通过"title"这个键名(key)就可以拿到"合辑护甲"这个值(value)。 "title": "合辑护甲" 这一整个就是俗称的一个字段。通过该字段前端就可以获取到列表的标题了。当然这个列表只是简单的展示用,还有诸如图片地址、优惠信息、已售份额等信息没有提供,这就是缺少字段的情况。
前后端就是通过这样的一个定义获取/传递数据的。
考虑到后期拓展、需求变更等,一般来说,涉及到计算的、可能有变动的,一律不要让前端来弄。
还是刚才那个例子,在刚才那个列表中有一个“立减5元”的橙黄色tag。
这个tag信息,如果考虑不充分,比如说,后端只提供一个数字5,然后前端在其页面写死“立减x元”,x为填入后端提供的数字,颜色固定为橙黄色。这个如果需求不修改还好,如果后期需要新增一个“满20减5元”的红色tag不傻眼了吗?
到时候只能通过升级app来解决,而且不升级的老用户将永远看不到这个红色的tag。
所以说,考虑到程序的可复用和拓展性,需要产品将后期可能新增或变更的需求考虑好,和前后端进行沟通,让前后端设计好实现,尽量降低程序的耦合和硬编码。这才能使一个产品更加健壮以及让苦逼的程序猿少加班的关键。
那么刚才那个tag的需求如何设计才合理呢?
首先是tag显示文字,全权由后端提供,可以是多个字段,由前端进行拼接。然后是tag的颜色,提供几种样式让前端判断是一种可行的办法,但是直接提供tag的色值给前端的这种方式无疑给前端展示增加了无限的可能。
是不是也要增加一个tag形状的字段呢?
俗话说,过犹不及。tag形状这种东西真的很少变更,字段太多无疑会增加开发的时间成本,而且会让人有一种舍本逐末之感。
前端获取到后端数据后,如果前端不主动刷新重新请求数据的话,这个页面的数据在该页面销毁前会一直保持不变。
如何理解?
首先,第一次进入一个页面,该页面数据为空或默认数据。此时前端会链接api请求数据。数据请求完成后,填充进页面。那么本次联网请求就完成了,在前端不进行二次数据请求之前,该页面会一直保持本次请求的数据。也就是说,就算服务端修改了数据,前端此时是不能事实的进行更新的,因为我前端不知道你数据更新了。
那么在这个需要实时更新页面数据的时候和前端讲这种需求会被前端直接回绝:“做不了”。这个时候产品咋办,怪怪妥协?最后背锅的还是自己,而且自己也不知道是真做不了还是假做不了。
实时刷新也不是不能做,只是做的成本略高,需要和后端进行配合,像微信聊天一样和后端进行长连接(socket),这样服务端数据变更前端就知道数据变更了。
当然如果稍懂页面刷新机制的话,可以要求前端在适当的时机进行页面刷新,如在页面可见的时候进行刷新,这样用户每次看到的都是最新的数据。也可以让用户主动刷新,如新增刷新功能。
产品懂技术这件事情,不仅会降低和开发同学沟通时的难度和被歧视风险,还会提升在面对开发同学意见时的判断力,会降低被技术团队忽悠的几率。同时,在需要向上级解释技术原因导致变更的情况下,也会有助于说服老板。
“闻道有先后,术业有专攻”,要相信自己所接触的开发团队是专业的,靠谱的,相信开发团队为实现需求所做出的技术方案是合理的,最优的。如果有质疑,可以加深沟通,以合适的方式提出自己的质疑。这里要补充一句的是,这个信任过程是需要建立的,也是会根据团队的表现不断变化的;同理,其实团队对于产品经理的信任度也是一样的情况。
吐槽是没有意义的,关键还是要解决问题。如果觉得产品经理不靠谱,那么有没有进行过深入的沟通?如果觉得开发不好沟通,那么有没有进行过了解,不好沟通的原因在哪里?如果当事人本身确实不可沟通,那么有没有考虑和对方的老板沟通,或者通过自己的老板如实反映情况?吐槽是最容易的,解决问题反而会很难。
‘肆’ 怎么使用 JavaScript 将网站后台的数据变化实时更新到前端
html5以前:
实时是不行的,因为http是无状态会话,服务器压根就没办法通知浏览器数据变化。
这种功能,只能设置计划任务,ajax定期去服务器上抓数据,互联网上的数据实时性要求都不会很高,比如的指导,约15s刷新一次数据。
html5,可以考虑websocket与服务器保持一个长链接,🈶️新数据,由服务器主动推送给客户端==>浏览器。这种实现复杂度就稍微大,服务器后端得维护好连接,否则对后台应用就是个灾难。
‘伍’ 微信小程序后台更改代码后怎么实现用户实时更新
一般情况下,用户端只要清空手机缓存,再进入小程序就更新了;如果想实现后台更改后,前端自动更新,可以尝试清空后端缓存数据,后台都有这个按钮。
‘陆’ websocket的jsp怎么获取在线人数
如果有新的用户访问,服务端将消息主动推送给客户端,这样客户端就可以实时统计当前在线人数
‘柒’ 前端技术 问怎么做到不刷新,实时获取这个消息
一般有三种方式:
轮询,也就是页面定时向服务器拉取消息,有未读消息则更新
长连接,页面和服务器建立一个持序的TCP连接,当没有新消息时,服务器阻塞此连接;当新消息到来时,服务器将响应返回到页面并关闭此连接。前端将返回的响应更新到页面上,并马上向服务器再发起一个新的长连接
websocket,前端和服务器建立一个websocket连接,由服务器主动向前端推送消息,前端每次收到来自服务器的消息时将内容更新到页面上。
‘捌’ 怎么使用 JavaScript 将网站后台的数据变化实时更新到前端
实时这个工作现在大体有两种方法
一、前端不断地向后台轮询请求数据查询的接口(不管你是用AJAX还是什么)然后将返回的数据重绘在页面上,这以前端页面为主动的方式。
二、如果浏览器支持Websocket 那么在后台建立一个websocket服务器,与前端页面建立websocket连接,进行从后台到前端的推送,前端接到推送数据后,将数据重绘在页面上。
‘玖’ react 点击下载,后台接到请求,在列表里添加数据,前端获取后台数据实现实时更新
react 本来就可以通过数据来对页面进行更新渲染。
我写了一个例子,你可以看下。我使用setInterval来模拟了数据的更新。
网页链接
importReact,{Component}from'react';
import{render}from'react-dom';
importHellofrom'./Hello';
import'./style.css';
classTestextendsComponent{
render(){
return(
<div>{this.props.data}</div>
)
}
}
classAppextendsComponent{
constructor(){
super();
this.data=1;
this.state={
name:'React'
};
}
componentDidMount(){
setInterval(()=>{
this.setState({data:this.data++})
},2000)
}
render(){
return(
<div>
<Helloname={this.state.name}/>
<p>
:)
</p>
<Testdata={this.state.data}/>
</div>
);
}
}
render(<App/>,document.getElementById('root'));