classdojo中文版下载 学生怎样上传照片

当Sam Chaudhary和Liam Don从英国搬到硅谷开创自己的教育初创公司的时候,他们忽然发现,竟然没有可以容身之处,而且也没有支持他们的人脉。作为把自己的家庭,朋友,女友等等一切生活抛弃掉,准备投身创业的两人而言,现实给了他们沉重的打击。&这段岁月真是暗无天日啊。&Chaudhary说道。不过Chaudhary和Don没有放弃,仍然坚持走在创业的路上,因为他们知道,自己仍然希望可以改变教育现状。他们最初的想法,是利用一种技术帮助改善学生群体行为表现的动态特性,用Chaudhary的话说,就是&一个绝对没有问题的解决方案&。他们开始尽其所能的寻找当前教育的问题所在,采访过数百名老师,并做了数以千计的调研。他们发现,老师们所遇到的最大问题并非在教学内容,也不是在认知方面,而是存在于学生的表现行为上面。&40%的老师把时间花在处理学生表现行为的工作上,&Chaudhary说道。&年底的时候,你干脆就别让孩子们上学去了,不如把他们送回家。&Chaudhary同样发现,这也是许多年轻教师所遇到的最痛苦的问题,更是众多老师选择离开教师行业的最大原因。在从企业孵化初期获得了160万美元种子轮融资后,Chaudhary和Don推出ClassDojo。根据Chaudhary透露,目前ClassDojo有1500万老师和学生在使用。今天,他们还高效率的对其移动App应用发布了更新,为教师提供了一个不受地理位置限制的全功能平台,无论在操场,还是在午餐室,都能使用。该平台本身就拥有许多功能,比如记录出勤率,跟踪学生表现,查看进度报告等等。但是,为什么是技术解决了学生表现行为这么一个技术含量较低的问题呢?两个原因,Chaudhary说道:持续性和数据。Chaudhary表示,针对学生行为表现这个问题,尽管老师自己也有一些技术含量较低的解决方案,但往往会随着时间的推移失去效果。另一方面,ClassDojo可以提供提醒功能,举个例子,ClassDojo会提醒老师两个月没管小Johnny了,是该给他上上紧箍咒了。Chaudhary说道,&这些学生中,有许多人的生活乱七八糟,&而ClassDojo则强调持续参与管理的重要性。至于数据,对于Chaudhary和他的员工而言,也绝不仅仅是一个时髦的术语。&技术的魅力所在,就是可以获得每一个学生,每一位家长的数据,甚至还可以收集一些非常难以管理的资料,&Chaudhary补充道。&这是一个&无形资产&&。老师们也可以利用ClassDojo分享一些具体的数据,而不仅仅是局限在给家长发送学生的考试分数上。ClassDojo是众多教育初创公司中的一个,通过定位教师,他们巧妙的绕过了复杂的教育政策限制。通过极佳的口碑传送,ClassDojo现在已经构建了属于自己的用户群体。那么,如果这款产品是免费的,那么企业又靠什么维持生计呢?Chaudhary正在考虑为家长提供一个付费版本。他说道,&孩子们的行为表现,不仅仅是学校老师需要面对的问题。&Chaudhary的行为表现管理理念,很大程度是基于一些机构(比如:促进社会情绪能力学习合作组织CASEL)对社交和情绪学习研究上的。他表示,提供一些像糖果或玩具这样的小奖励效果不对太好,而且也无法改变人们的长期行为表现。相反,他更相信参与度和正面鼓励的作用。&许多老师采用责备和惩罚的方法,向学生灌输纪律的重要性,我们从不这么做,因为只有监狱才这么干。&这么做到最后,学生会感觉学校就是一所监狱。(via
译/快鲤鱼)
24小时报不停
懒熊体育完成1200万Pre-A 融资,华人文化基金领投
美国科技投资人百强榜单出炉,徐小平首次入百强
苹果官网正在更新信息,尚未开启预定iPhone SE
松下将撤回2018财年销售额目标,今后以车载电池为核心
Uber诉印度Ola使用下流手段:9万假用户发订单折腾司机
谷歌打造YouTube Connect直播应用,与FB的Facebook Live正面交锋
2016福布斯全球最佳创投人榜揭晓,IDG李骁军成最年轻中国投资人
祸不单行!在谷歌和Facebook双重挤压下,雅虎网络广告营收今年将逆市暴跌14%
神州专车拟今年上市,阿里回应入股其传言:出行领域没有新计划
传阿里近30亿战略投资神州专车,双方称不知情
酷派2015年净利润23亿港元,同比下滑41.09%
小心!!QQ微信聊天涉诈骗关键字可能被暂停对话
男女同工同酬在亚马逊实现咯!特别在男性主导的高科技行业
实时社交视频平台天鸽互动2015年收入减少2.1%,引入日韩主播
在Kickstarter筹集2000万美元的Pebble,现裁员25%,难道可穿戴行业还在阵痛期?
慧理财App获2000万人民币天使融资,联想乐基金领投
苹果音乐扩张进入视频,再度签下独家Vice影视版权《The Score》
各地新能源车补贴政策或3月底4月初密集出台,由消费转向使用环节
掌趣科技遭股东大宗交易减持1000万股,仍是持5%以上的股东
立思辰拟收购360教育100%股权,后者承诺2016年净利润2000万元
优客工场与无界空间达成战略股权合作,将参与对方A轮融资
自从Facebook COO桑德伯格来后,年营收增长了逾64倍,并成功上市
全球最大成人网站Pornhub与娱乐内容提供商BaDoinkVR达成合作,推免费VR内容
Facebook正开启反骚扰功能,新工具可探测“克隆”帐号
三星电子开发物联网操作系统,或为简化版Tizen操作系统
中国概念股周三多数下跌,斯凯跌超7%
圆通PK申通争夺快递第一股,阿里系半年净赚5亿
马云博鳌首提“eWTP”:帮助中小企业全球贸易
三大电信运营商今年削减804亿资本支出,用以建设4G基站
滴滴程维:无人驾驶六年内可商业化
传Apple Pay将支持移动网站,直接挑战PayPal
无需苹果帮忙:以色列软件公司帮FBI解锁iPhone
华谊兄弟去年净利近10亿元,拟10转10派1元
滴滴程维:中国互联网出行跟美国并驾齐驱
游久游戏股东刘亮、代琳被证监会立案调查
中国VR用户行为研究报告: 2.86亿VR潜在用户
拉勾网完成2.2亿C轮融资,弘道资本领投
网红时尚媒体快美妆获近三千万元A轮融资
航班管家获海航、民航等9.33亿元投资,2015年交易额近200亿元
小牛电动获3000万美金A+轮投资,凤凰祥瑞领投
博鳌论坛点赞马云,世界需要eWTP
精英创客社群VHouse与千唐创投启动2亿规模创投基金
科大讯飞发停牌公告,拟收购在线教育公司乐知行
天猫同步首发iPhone SE,24日开始现货订购
高德推出首款汽车导航硬件,必须匹配捷豹路虎
玛莎拉蒂SUV天猫首发,18秒100台车售罄
中国电信2015年净利润200亿元,同比增长13%
DaoCloud完成千万美元A轮融资
神州数码宣布停牌:子公司筹划重大事项
人力资源SaaS平台e成完成数千万美金B轮融资
汪涵首档网综《火星情报局》今日发布,音乐界段子手薛之谦担任“高级特工”
谷歌正开发iOS输入法,将植入搜索
中国联通王晓初:已投入244亿元用于提速降费
Facebook新功能:自动识别哪些李鬼账号假冒您
优步年内进军河北五城,分享经济助力京津冀一体化
夏普股价暴跌7%,传鸿海将收购价格降低17%
苹果iPhone SE和9.7寸iPad Pro均搭载2GB内存
传任天堂今年底将停产游戏主机Wii U
传苹果公司7月推新款13英寸和15英寸MacBook当前访客身份:游客 [
:不同系统的资源权限也不同,应该由server一并管理...
:还需要加入下面的依赖吧? &dependency&
:java的gc线程属于守护线程,守护线程是在程序中不...
:本文这段话有问题-----“每个key都弱引用指向thr...
:如果用线程池的话还是会泄露的
:楼主牛逼。。。
:正好这次的作业可以借鉴一下
:图都挂了。。。
:图都挂了。。。
今日访问:84
昨日访问:87
本周访问:314
本月访问:2615
所有访问:102593
Servlet3.0.1与dojo实现图片AJAX上传与下载,附lastmodified实现
发表于2年前( 00:58)&&
阅读(1124)&|&评论()
0人收藏此文章,
在servlet2.5中,并没有处理文件上传二进制流的API,一般都是借用Apache Commons下的fileUploader。在servlet3.0以后,文件上传的request处理已经被纳入servlet jsr. 各大主流web容器也都支持了新的jcr。而servlet3.0.1则更进一步支持文件上传,tomcat8完全实现了servlet3.0.1. 这篇文章将使用servlet3.0.1做后端,dojo做前端,制作一个图片AJAX上传于下载网站。
tomcat8, eclipse+maven,dojo1.9
首先需要生成一个webapp的maven项目。本次开发用到了tomcat的servlet api, jsp api以及jstl,因此需要在pom.xml中声明所需的依赖。为了不超过字数上限,我只列出依赖的ID。
&&&&tomcat-servlet-api
&&&&tomcat-jsp-api
我们将有两个servlet和一个JSP
index.jsp, 负责界面展示。对应的URL为&
UploaderServlet, 负责处理dojo发送的AJAX图片上传请求,并返回JSON格式的消息。对应的URL为&
ImagesServlet, 负责处理对上传后的图片访问请求。对应的URL为
Servlet3可以使用annotation config,也可以使用传统的web.xml。我们还是用web.xml.
&?xml&version="1.0"&encoding="UTF-8"?&
&web-app&version="3.0"&xmlns="/xml/ns/javaee"&xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"&xsi:schemaLocation="/xml/ns/javaee&&&&&&&&&&&&&&&&&&&&&&&/xml/ns/javaee/web-app_3_0.xsd"&
&&&display-name&Archetype&Created&Web&Application&/display-name&
&&&context-param&
&&&&&!--&&定义上传图片最终存放的文件夹。&--&
&&&&&param-name&shareFolder&/param-name&
&&&&&param-value&d:/share/data&/param-value&
&&&/context-param&
&&&servlet&
&&&&&servlet-name&imageUploader&/servlet-name&
&&&&&servlet-class&servlets.UploaderServlet&/servlet-class&
&&&&&multipart-config&
&&&&&&&!--临时存放上传文件的地方--&
&&&&&&&location&d:/share/tmp&/location&
&&&&&&&!--允许上传的文件最大值,约10MB。默认值为&-1,表示没有限制。--&
&&&&&&&max-file-size&&/max-file-size&
&&&&&&&!--针对该&multipart/form-data&请求的最大数量,默认值为&-1,表示没有限制。--&
&&&&&&&max-request-size&&/max-request-size&
&&&&&&&!--当数据量大于约10MB时,内容将被写入tmp目录下的文件。--&
&&&&&&&file-size-threshold&&/file-size-threshold&&&
&&&&&/multipart-config&
&&&/servlet&
&&&servlet-mapping&
&&&&&servlet-name&imageUploader&/servlet-name&
&&&&&url-pattern&/ajaxUploader&/url-pattern&
&&&/servlet-mapping&
&&&servlet&
&&&&&servlet-name&imageAccess&/servlet-name&
&&&&&servlet-class&servlets.ImagesServlet&/servlet-class&
&&&/servlet&
&&&servlet-mapping&
&&&&&servlet-name&imageAccess&/servlet-name&
&&&&&url-pattern&*.png&/url-pattern&
&&&&&url-pattern&*.jpg&/url-pattern&
&&&&&url-pattern&*.gif&/url-pattern&
&&&/servlet-mapping&
&/web-app&
从上可见,所有的图片访问均由ImagesServlet处理,文件上传由UploaderServlet处理。UploaderServlet下面配置了文件上传的限制,请看注释。另外我还声明了一个context-param,作用请看注释。
UploaderServlet
使用request.getPart()方法,可以得到文件上传part的对象。将上传的流保存在指定的目录文件中。
特别注意的是,此servlet响应的将是dojo.io.iframe发送来的AJAX请求,因此,返回JSON格式的响应,将是最好的选择。
响应dojo.io.iframe的JSON格式,必须包含在下面的结构中。这是dojo.io.iframe所能解析的结构,也是必须遵循的规则, 响应的,response header必须设置为text/html。
&&&&JSON_DATA
UploadServlet的部分代码如下:
public&class&UploaderServlet&extends&HttpServlet&{
&&&&@Override
&&&&protected&void&doPost(HttpServletRequest&req,&HttpServletResponse&resp)
&&&&&&&&&&&&throws&ServletException,&IOException&{
&&&&&&&&try&{
&&&&&&&&&&&&Part&image&=&req.getPart("image");
&&&&&&&&&&&&//servlet3.0.1新加入的方法,在3中,我们只能通过header来自己解析filename.
&&&&&&&&&&&&String&imageName&=&image.getSubmittedFileName();
&&&&&&&&&&&&String&shareFolder&=&req.getServletContext().getInitParameter("shareFolder");
&&&&&&&&&&&&File&imageFile&=&new&File(shareFolder,&imageName);
&&&&&&&&&&&&FileOutputStream&fos=
&&&&&&&&&&&&InputStream&is&=
&&&&&&&&&&&&try&{
&&&&&&&&&&&&&&&&fos&=&new&FileOutputStream(imageFile);
&&&&&&&&&&&&&&&&is&=&image.getInputStream();
&&&&&&&&&&&&&&&&byte[]&bytes&=&new&byte[4096];
&&&&&&&&&&&&&&&&int&bytesReaded&=&-1;
&&&&&&&&&&&&&&&&while&((bytesReaded=is.read(bytes))!=-1)&{
&&&&&&&&&&&&&&&&&&&&fos.write(bytes,&0,&bytesReaded);
&&&&&&&&&&&&&&&&}
&&&&&&&&&&&&&&&&fos.flush();
&&&&&&&&&&&&}&finally&{
&&&&&&&&&&&&&&&&//关闭所有的流。
&&&&&&&&&&&&}
&&&&&&&&&&&&sendCreated(resp,&imageName);
&&&&&&&&}&catch&(Exception&e)&{
&&&&&&&&&&&&e.printStackTrace();
&&&&&&&&&&&&sendError(resp);
&&&&&&&&&&&&
&&&&private&void&sendError(HttpServletResponse&resp)&{
&&&&&&&&resp.setStatus(200);
&&&&&&&&resp.setContentType("text/charset=UTF-8");
&&&&&&&&StringBuilder&body&=&new&StringBuilder()
&&&&&&&&&&&&.append("&html&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&")
&&&&&&&&&&&&.append("&&&boby&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&")
&&&&&&&&&&&&.append("&&&&&textarea&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&")
&&&&&&&&&&&&.append("&&&&&&&{status:500,&message:'Can't&load&your&image.'}&&")
&&&&&&&&&&&&.append("&&&&&/textarea&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&")
&&&&&&&&&&&&.append("&&&/body&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&")
&&&&&&&&&&&&.append("&/html&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&");
&&&&&&&&resp.setContentLength(body.length());
&&&&&&&&PrintWriter&
&&&&&&&&try&{
&&&&&&&&&&&&out&=&resp.getWriter();
&&&&&&&&&&&&out.print(body.toString());
&&&&&&&&&&&&out.flush();
&&&&&&&&&&&&out.close();
&&&&&&&&}&catch&(IOException&e)&{
&&&&&&&&&&&&e.printStackTrace();
&&&&private&void&sendCreated(HttpServletResponse&resp,&String&image)&{
&&&&&&&&resp.setStatus(200);
&&&&&&&&resp.setContentType("text/charset=UTF-8");
&&&&&&&&StringBuilder&body&=&new&StringBuilder()
&&&&&&&&&&&&.append("&html&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&")
&&&&&&&&&&&&.append("&&&boby&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&")
&&&&&&&&&&&&.append("&&&&&textarea&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&")
&&&&&&&&&&&&.append(String.format("{status:201,&image:'%s',&message:'File&created.'}",&image))
&&&&&&&&&&&&.append("&&&&&/textarea&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&")
&&&&&&&&&&&&.append("&&&/body&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&")
&&&&&&&&&&&&.append("&/html&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&");
&&&&&&&&resp.setContentLength(body.length());
&&&&&&&&PrintWriter&
&&&&&&&&try&{
&&&&&&&&&&&&out&=&resp.getWriter();
&&&&&&&&&&&&out.print(body.toString());
&&&&&&&&&&&&out.flush();
&&&&&&&&&&&&out.close();
&&&&&&&&}&catch&(IOException&e)&{
&&&&&&&&&&&&e.printStackTrace();
ImagesServlet
处理图片访问请求的servlet。只需要将存放的文件以字节流的形式输出到response中即可。在输出流之前,我们还要检查If-Modified-Since和If-None-Match两个header。如果图片没有修改过,则返回304. 如果修改过,则输出流,并设置新的Last-Modified和ETag两个header。
public&class&ImagesServlet&extends&HttpServlet&{
&&&&@Override
&&&&public&void&doGet(HttpServletRequest&request,&HttpServletResponse&response)&{
&&&&&&&&String&path&=&request.getRequestURI();
&&&&&&&&String&imageName&=&path.substring(path.lastIndexOf('/')+1);
&&&&&&&&File&image&=&new&File(request.getServletContext().getInitParameter("shareFolder"),&imageName);
&&&&&&&&if&(!image.exists())&{
&&&&&&&&&&&&response.setStatus(404);
&&&&&&&&&&&&
&&&&&&&&long&lastModified&=&image.lastModified();
&&&&&&&&long&ifModifiedSince&=&request.getDateHeader("If-Modified-Since");
&&&&&&&&if&((lastModified&/&1000&*&1000)&&=&ifModifiedSince)&{
&&&&&&&&&&&&response.setStatus(304);
&&&&&&&&&&&&
&&&&&&&&response.setStatus(200);
&&&&&&&&String&mimeType&=&request.getServletContext().getMimeType(imageName);
&&&&&&&&if(mimeType==null)&{mimeType&=&"application/octet-stream";}
&&&&&&&&response.addHeader("content-type",&mimeType);
&&&&&&&&response.setContentLength((int)image.length());
&&&&&&&&response.addDateHeader("Last-Modified",&lastModified);
&&&&&&&&String&isDownload&=&request.getParameter("download");
&&&&&&&&if&(isDownload!=null&&"true".equals(isDownload))&{
&&&&&&&&&&&&//force&download
&&&&&&&&&&&&String&headerKey&=&"Content-Disposition";
&&&&&&&&&&&&String&headerValue&=&String.format("&filename=\"%s\"",&imageName);
&&&&&&&&&&&&response.setHeader(headerKey,&headerValue);
&&&&&&&&FileInputStream&in=
&&&&&&&&ServletOutputStream&out=
&&&&&&&&try&{
&&&&&&&&&&&&in&=&new&FileInputStream(image);
&&&&&&&&&&&&out&=&response.getOutputStream();
&&&&&&&&&&&&byte[]&bytes&=&new&byte[4096];
&&&&&&&&&&&&int&bytesReaded&=&-1;
&&&&&&&&&&&&while&((bytesReaded&=&in.read(bytes))!=-1)&{
&&&&&&&&&&&&&&&&out.write(bytes,&0,&bytesReaded);
&&&&&&&&&&&&}
&&&&&&&&&&&&out.flush();
&&&&&&&&}&catch&(Exception&e)&{
&&&&&&&&&&&&e.printStackTrace();
&&&&&&&&&&&&response.setStatus(500);
&&&&&&&&}&finally&{
&&&&&&&&&&&&//关闭所有的流。
前端开发重要是对index.jsp的内容展示方面进行开发。作为网站的welcome页面,也是唯一的页面,它将承载所有的用户交互。在此页面上只包含两个功能:
图片上传Form。
已经上传的图片的展现。
使用dojo.io.iframe进行无刷新的图片上传。图片上传成功以后,会接受服务器返回的JSON对象,其中含有图片的信息。然后使用JS将图片插入到所有图片的前面。
当刷新本页面时,JSP会扫面图片文件夹。列出所有的图片,并将preview显示在页面上。我们可以点击download以下载图片,也可以点击view,使得浏览器直接打开图片。
以下是部分代码。
&script&src="///ajax/libs/dojo/1.9.2/dojo/dojo.js"&&/script&
&script&type="text/javascript"&
&&require(["dojo/io/iframe",&"dojo/dom-construct","dojo/on","dojo/dom","dojo/query","dojo/string",&"dojo/domReady!"],&
&&&&&&function(ioIframe,domConst,on,dom,query,string){
&&&&var&upload=function()&{
&&&&&&ioIframe.send({
&&&&&&&&url:'${pageContext.request.contextPath&}/ajaxUploader',&
&&&&&&&&form:'uploader',
&&&&&&&&handleAs:'json',
&&&&&&&&load:&function(response,&ioArgs){
&&&&&&&&&&if&(response.status&==&201)&{
&&&&&&&&&&&&var&nodeHtml&=&&!--创建新image的preview的html--&
&&&&&&&&&&&&var&node&=&domConst.toDom(nodeHtml);
&&&&&&&&&&&&domConst.place(node,&'icons',&'first');
&&&&&&&&&&}&else&{
&&&&&&&&&&&&alert(response.message);
&&&&&&&&&&}
&&&&&&&&&&&&&&return&
&&&&&&&&&&},
&&&&&&&&&&//&Callback&on&errors:
&&&&&&&&&&error:&function(response,&ioArgs){
&&&&&&&&&&&&alert(response);
&&&&&&&&&&&&&&return&
&&&&&&&&&&}
&&&&on(dom.byId("uploadButton"),&"click",&upload);
&&&&&&&form&enctype="multipart/form-data"&id="uploader"&method="post"&
&&&&&&&&&div&&label&Please&select&a&image:&/label&&input&type="file"&name="image"/&&/div&
&&&&&&&&&div&&input&type="button"&value="Upload"&id="uploadButton"&&/div&
&&&&&&&/form&
&&&&&div&id="icons"&
&&&&&&&String&shareFolder&=&request.getServletContext().getInitParameter("shareFolder");
&&&&&&&File&dir&=&new&File(shareFolder);
&&&&&&&String[]&list&=&dir.list();
&&&&&&&pageContext.setAttribute("list",&list);
&&&&&&&c:forEach&var="image"&items="${list&}"&
&&&&&&&&&!--创建每个image的preview--&
&&&&&&&/c:forEach&
&&&&&/div&
最终的UI效果
源代码下载地址
更多开发者职位上
1)">1)">1" ng-class="{current:{{currentPage==page}}}" ng-repeat="page in pages"><li class='page' ng-if="(endIndex<li class='page next' ng-if="(currentPage
相关文章阅读

我要回帖

更多关于 classdojo电脑下载 的文章

 

随机推荐