1. 先设置路由
url(r‘^upload_img‘, upload_img),
2. 建立函数
def upload(request): ???return render(request,‘upload.html‘)
3. 编写upload.html
//这次我们先学jquery方式
<body> ???<h1>上传图片</h1> ???<input type="file" name="fafafa"> ???<input type="button" value="点我点我" onclik = "uploadImg()"> ???<script src="/static/jquery-3.2.1.js"></script> ????????<script> ???????function uploadImg() { ???????????????} ???????????}) ???????????????????} ???</script></body>
4. 运行一下页面
5. 继续编写 upload.html
<body> ???<h1>上传图片</h1> ???<input id="fafafa" type="file" name="fafafa"> ???<input type="button" value="点我点我" onclik = "uploadImg()"> ???<script src="/static/jquery-3.2.1.js"></script> ???<script> ???????function uploadImg() { ???????????//获取文件 ???????????//上传文件 ???????????//预览 ???????????var formData = new FormData(); ??????????????????//data对象 上传的图片先给这个对象然后传递给data ???????????formData.append(‘a1‘,$(‘#fafafa‘)[0].files[0]); // 这就是取到的图片文件 固定格式 ???????????console.log(formData); ???????????$ajax({ ???????????????url:‘/upload_img/‘, ???????????????type:‘POST‘, ???????????????data:formData, ????????????????????????????????//数据上传到后台 ???????????????prosessData:false, ???????????????contentType:false, ???????????????success:function (arg) { ???????????????????console.log(arg) ???????????????} ???????????}) ???????????????????} ???</script></body>
6. 建立函数 upload_img
def upload_img(request): ???obj = ?request.FILES.get(‘a1‘) ???print(obj) ???return HttpResponse(‘999‘)
7. 继续完善函数
def upload_img(request): ???obj = ?request.FILES.get(‘a1‘) ???with open(obj.name,mode=‘wb‘) as f: ???????for chunk in obj.chunks(): ???????????f.write(chunk) ???return HttpResponse(‘999‘)
8.
BBS功能之Ajax上传图片
原文地址:http://www.cnblogs.com/lipingzong/p/7567508.html