对于链接,点击获取标题时,本质发送ajax请求,然后去链接抓取信息,发布又是发送ajax请求

  发布信息,还要有发布者的信息,并在信息表需要记录发布者的用户名,发布者的头像,发布者的id,而这些信息可以通过session获得(前提是设置session要设置了这些信息)

对于文字,没什么好说的,就一个发布时需要发送ajax请求

对于图片,选择图片和上传图片一起做,即选择完图片,图片就上传到后台,并且在页面上展示图片效果,本质上也是偷偷发请求,而且绑定不是常见的onclick事件,而是onchange事件,即input(文件)一旦发生改变就触发的事件

  由于文件是特殊的数据,不可能通过ajax发字符串的形式发送请求了,所以我们要用到form提交的方式,但是这样又会刷新页面,所以要用到form+iframe形式来发送请求

首先看看前端html怎么写

 请求通过iframe这个管道提交过去,并且上传成功要把图片显示出来,问题又来了,onchange事件只是监听input文件变化并发请求,那我怎么知道上传成功了???

  ---那就引出iframe的onload事件,当iframe上传文件成功时,执行它

  图片在页面上的展示效果,通过img标签src属性,所以在文件上传成功还是创建一个img标签

function UploadImage(ths){
//如果上传成功(用完这个通道)就执行UploadImageComplete函数
document.getElementById('upload_img_iframe').onload = UploadImageComplete;
//提交请求
document.getElementById('upload_img_form').target = 'upload_img_iframe';
document.getElementById('upload_img_form').submit();
} function UploadImageComplete(){
var origin = $("#upload_img_iframe").contents().find("body").text();
//获取上传成功的内容 {'status': True, 'path': file_path}
var obj = JSON.parse(origin);
if(obj.status){
//创建img标签,通过src属性直接把图片展示在页面上
var img = document.createElement('img');
img.src = obj.path;
$("#upload_img_form").append(img);
//隐藏上传图片样式
$('#fakeFile').addClass('hide');
//显示重新上传样式
$('#reUploadImage').removeClass('hide');
}
} function ReUploadImage(ths){
$(ths).addClass('hide');
$("#upload_img_form").find('img').remove();
$('#fakeFile').removeClass('hide');
}

后台只要获取传过来的文件,并把它写入指定的路径下,只要在controllers下home.py写入下面代码

class UploadImageHandler(BaseRequestHandler):

    def post(self, *args, **kwargs):
file_metas = self.request.files["image"]
# print(file_metas)
for meta in file_metas:
file_name = meta['filename']
file_path = os.path.join('statics','upload', generate_md5(file_name))
with open(file_path, 'wb') as up:
up.write(meta['body']) ret = {'status': True, 'path': file_path}
self.write(json.dumps(ret))

抽屉之Tornado实战(4)--发帖及上传图片的更多相关文章

  1. 抽屉之Tornado实战(1)--分析与架构

    抽屉之Tornado实战(1)--分析与架构   项目模拟地址:http://dig.chouti.com/ 知识点应用: AJAX  用于偷偷发请求 原生ajax jQuery  ajax($.aj ...

  2. 抽屉之Tornado实战(9)--装饰器实现用户登录状态验证

    当然今天讲的验证,不只Tornado会用,以后用到web框架都会用到,最常见的场景就是只有用户登陆了才能执行某些操作,所以在执行这些操作前要先做登陆状态的验证. 比如:点赞,发布,评论等需要验证,都需 ...

  3. 抽屉之Tornado实战(6)--session工厂(工厂方法模式)

    我之前写的session一般保存在服务器的内存里,那可以保存在缓存,或是数据库,那问题来了,不同地方,保存方式是不同的,所以需要定义不同的类,cache/redis/memcached类 sessio ...

  4. 抽屉之Tornado实战(5)--点赞与评论树

    点赞 点赞的过程:数字增加,并在后台点赞表记录数据 需要发过去的数据:用户id,新闻id 用户id从session里获得,那新闻id怎么获取呢?这想到分页是循环新闻列表来展示内容,循环的新闻id可以做 ...

  5. 抽屉之Tornado实战(7)--form表单验证

    在这里,我们把form表单验证的代码进行工具化了,以后稍微修改一下参数就可以拿来用了 先贴上代码 forms.py from backend.form import fields class Base ...

  6. 抽屉之Tornado实战(3)--注册

    知识点应用:标签绑定事件,jQuery获取用户值-->AJAX发送数据-->后台路由系统-->业务逻辑处理-->ORM数据操作-->write返回-->AJAX回调 ...

  7. 抽屉之Tornado实战(2)--数据库表设计

    经过我们上次分析,数据库要有最基本的四张表,用户表,消息表,类型表,点赞表,评论表,接下来我们看着怎么设计吧 首先我们要清楚,表设计的代码是写在models下的 用户表 #一张表对应一个类 class ...

  8. Tornado实战

    抽屉之Tornado实战(1)--分析与架构 抽屉之Tornado实战(2)--数据库表设计 抽屉之Tornado实战(3)--注册 抽屉之Tornado实战(4)--发帖及上传图片 抽屉之Torna ...

  9. Tornado实战项目(伪JD商城)

    预备知识 在之前tornado商城项目中,在开始之前需要引入一些项目设计知识,如接口,抽象方法抽象类,组合,程序设计原则等,个人理解项目的合理设计可增加其灵活性, 降低数据之间的耦合性,提高稳定性,下 ...

随机推荐

  1. Ubuntu python3 安装pip

    python2:sudo apt-get install python-pip python3:sudo apt-get install python3-pip 切换python2和python3的版 ...

  2. SILK 预测模块分析

    SILK是一种新结构的基于噪声整形量化算法的编解码框架.不同于类CELP的AMR,EVRC,G729,Speex等标准. 类CELP的结构都是以码本激励为量化框架的编码器.但是这里并不讨论NSQ结构和 ...

  3. Kubernetes集群部署之二CA证书制作

    创建TLS证书和秘钥 kubernetes 系统的各组件需要使用 TLS 证书对通信进行加密,本文档使用 CloudFlare 的 PKI 工具集 cfssl 来生成 Certificate Auth ...

  4. 同样的so,放到不同的project中,就会报错

    网上看到的帖子,笔记一下 最近在看蓝斯的一篇文章基于Platinum库的DMS实现(android) 把其中的so文件直接拷贝到了另外一个project中,jin文件也一样,唯一不同的是包名. 运行报 ...

  5. [hive] hive 安装、配置

    一.hive安装 1.官网下载 1.2.2版本 http://apache.fayea.com/hive/hive-1.2.2/ 2. 解压,此处目录为 /opt/hadoop/hive-1.2.2 ...

  6. [AWS] SSO: Single sign-on

    由单点登录到aws的http服务. From: https://www.jianshu.com/p/613e44d4a464 单点登录SSO(Single Sign On)说得简单点就是在一个多系统共 ...

  7. osx 10.11 一键制作U盘傻瓜工具最新版 无需任何命令

    osx 10.11 最新版U盘制作工具   无需任何命令   纯傻瓜式  !!!只要把app下载下来放在应用程序  鼠标点点就可以做了... 下载地址:http://diskmakerx.com/do ...

  8. 【中间件安全】Weblogic 安全加固规范

    1. 适用情况 适用于使用Weblogic进行部署的Web网站. 2. 技能要求 熟悉Weblogic安装部署,熟悉Weblogic常见漏洞利用方式,并能针对站点使用Weblogic进行安全加固. 3 ...

  9. Markdown 代码

    我们使用三个反引号来标记代码,语法及效果如下: ```python #!/usr/bin/env python #-*- coding:utf- -*- print("Hello World ...

  10. kafka+zookeeper环境配置(linux环境单机版)

    版本: CentOS-6.5-x86_64 zookeeper-3.4.6 kafka_2.10-0.10.1.0 一.zookeeper下载与安装 1)下载 $ wget http://mirror ...