Rumah pembangunan bahagian belakang Tutorial Python Django项目实战之用户头像上传与访问

Django项目实战之用户头像上传与访问

Apr 21, 2018 pm 02:49 PM
django avatar pengguna

这篇文章主要介绍了Django项目实战之用户头像上传与访问的示例,现在分享给大家,也给大家做个参考。一起过来看看吧

1 将文件保存到服务器本地

upload.html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
</head>
<body>
<form action="" method="post" enctype="multipart/form-data">
  {% csrf_token %}
  <p>用户名:<input type="text" name="username"></p>
  <p>头像<input type="file" name="avatar"></p>
  <input type="submit" value="提交">
</form>
</body>
</html>
Salin selepas log masuk

urls.py

from django.conf.urls import url
from app01 import views
urlpatterns = [
  url(r&#39;^upload&#39;,views.upload)
]
Salin selepas log masuk

views.py

from django.shortcuts import render,HttpResponse 
def upload(request):
  if request.method == &#39;POST&#39;:
    name = request.POST.get(&#39;username&#39;)
    avatar = request.FILES.get(&#39;avatar&#39;)
    with open(avatar.name,&#39;wb&#39;) as f:
      for line in avatar:
        f.write(line)
    return HttpResponse(&#39;ok&#39;)
  return render(request,&#39;upload.html&#39;)
Salin selepas log masuk

总结

这样,我们就做好了一个基本的文件上传小示例,这里需要注意的有几点:
1.form表单里需要加上csrf_token验证
2.文件的input框的type的值为file
3.在视图函数中获取文件要用request.FILES.get()方法
4.通过obj.name可以获取文件的名字

2 将文件上传到数据库

models.py

from django.db import models
 class User(models.Model):
  username = models.CharField(max_length=16)
  avatar = models.FileField(upload_to=&#39;avatar&#39;)
Salin selepas log masuk

views.py

def upload(request):
  if request.method == &#39;POST&#39;:
    name = request.POST.get(&#39;username&#39;)
    avatar = request.FILES.get(&#39;avatar&#39;)
    models.User.objects.create(username=name,avatar=avatar)
    return HttpResponse(&#39;ok&#39;) 
  return render(request,&#39;upload.html&#39;)
Salin selepas log masuk

总结

上面已经实现了将文件上传到数据库的功能,需要注意的有几点:
1.所谓的上传到数据库,不是讲图片本身或者二进制码放在数据库,实际上也是将文件上传到服务器本地,数据库只是存了一个文件的路径,这样用户要调用文件的时候就可以通过路径去服务器指定的位置找了
2.创建ORM的时候,avatar字段要有一个upload_to=''的属性,指定上传后的文件放在哪里
3.往数据库添加的时候,文件字段属性赋值跟普通字段在形式上是一样的,如:models.User.objects.create(username=name,avatar=avatar)
4.如果有两个用户上传的文件名重复,系统会自动将文件改名,效果如下:

附加

功能我们是实现了,看起来我们在调用文件的时候,只需要通过数据库文件路径已经保存的文件本身就可以访问图片,让它出现在网页上,其实并不是这样,

我们需要配置一些东西,django才可以找的到,不然的话就会过不了urls验证,而我们之所以可以直接访问static里的静态文件,是因为django已经帮我们配置好了。

配置步骤如下:

1、在站点的setting.py里配置

MEDIA_ROOT=os.path.join(BASE_DIR,"blog","media") #blog是项目名,media是约定成俗的文件夹名

MEDIA_URL="/media/"   # 跟STATIC_URL类似,指定用户可以通过这个路径找到文件
Salin selepas log masuk

2、在urls.py里配置

from django.views.static import serve
from upload import settings        #upload是站点名
url(r&#39;^media/(?P<path>.*)$&#39;, serve, {&#39;document_root&#39;: settings.MEDIA_ROOT}),
Salin selepas log masuk

配置完后,就可以通过http://127.0.0.1:8001/media/milk.png访问到图片了

3 用AJAX提交文件

upload.html

<!DOCTYPE html>

<html lang="en">
<head>
  <meta charset="UTF-8">
</head>
<body>
<form>
  {% csrf_token %}
  <p>用户名:<input id="name-input" type="text"></p>

  <p>头像<input id="avatar-input" type="file"></p>
  <input id="submit-btn" type="button" value="提交">
</form>
<script src="/static/js/jquery-3.2.1.min.js"></script>
<script>
  $(&#39;#submit-btn&#39;).on(&#39;click&#39;,function () {
    formdata = new FormData();
    formdata.append(&#39;username&#39;,$(&#39;#name-input&#39;).val());
    formdata.append("avatar",$("#avatar")[0].files[0]);
    formdata.append("csrfmiddlewaretoken",$("[name=&#39;csrfmiddlewaretoken&#39;]").val()); 
 $.ajax({
 processData:false,contentType:false,url:&#39;/upload&#39;, type:&#39;post&#39;, data:formdata,success:function (arg)
 { 
if (arg.state == 1){ alert(&#39;成功!&#39;) }
else { alert(&#39;失败!&#39;) } } }) });
 </script>
 </body> 
</html>
Salin selepas log masuk

views.py

from django.shortcuts import render,HttpResponse
from django.http import JsonResponse
from app01 import models
def upload(request):
  if request.method == &#39;POST&#39;:
    name = request.POST.get(&#39;username&#39;)
    avatar = request.FILES.get(&#39;avatar&#39;)
    try:
      models.User.objects.create(username=name,avatar=avatar)
      data = {&#39;state&#39;:1}
    except:
      data = {&#39;state&#39;:0}
    return JsonResponse(data)
  return render(request,&#39;upload.html&#39;)
Salin selepas log masuk

总结

1.Ajax上传的时候,按钮的tpye一定不要用submit
2.Ajax上传的时候data参数的值不再是一个普通‘字典'类型的值,而是一个FormData对像

  1. 创建对象formdata = new FormData();

  2. 往里面添加值formdata.append('username',$('#name-input').val());

3.Ajax在做post提交的时候要加上csrf验证

  1. formdata.append("csrfmiddlewaretoken",$("[name='csrfmiddlewaretoken']").val());

4.最后,Ajax上传文件的时候要有两个参数设置

  1. processData:false

  2. contentType:false

4 上传图片文件的时候有预览功能

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
</head>
<body>
<form>
  <!----用一个label标签将上传文件输入框跟图片绑定一起,
     点击图片的时候就相当于点击了上传文件的按钮---->
  <label><img id="avatar-img" src="/static/img/default.png" width="80px" height="80px">
    <p>头像<input id="avatar-input" hidden type="file"></p>

  </label>
  <input id="submit-btn" type="button" value="提交">
</form>
<script src="/static/js/jquery-3.2.1.min.js"></script>
<script>
  // 上传文件按钮(label里的图片)点击事件
  $(&#39;#avatar-input&#39;).on(&#39;change&#39;,function () {
    // 获取用户最后一次选择的图片
    var choose_file=$(this)[0].files[0];
    // 创建一个新的FileReader对象,用来读取文件信息
    var reader=new FileReader();
    // 读取用户上传的图片的路径
    reader.readAsDataURL(choose_file);
    // 读取完毕之后,将图片的src属性修改成用户上传的图片的本地路径
    reader.onload=function () {
       $("#avatar-img").attr("src",reader.result)
    }
  });
</script>
Salin selepas log masuk

5 大总结

对于文件上传,不管是直接form提交也好,Ajax提交也好,根本问题是要告诉浏览器你要上传的是一个文件而不是普通的字符串

而怎么样告诉浏览器呢,就是通过请求体重的ContentType参数,我们上传普通的字符串的时候不用指定,因为它有默认值,

而如果要传文件的话,就要另外指定了。总结以下几点
 1.form表单上传的话是通过 enctype="multipart/form-data" 来指定ContentType
 2.ajax上传的话是通过  processData:false 和 contentType:false来指定ContentType
 3.form上传的时候,文件数据是通过标签来‘'包裹‘'数据,
 4.ajax上传的时候,是通过一个 FormData 实例对象来添加数据,传递的时候传递这个对象就行了
 5.数据传递过去之后,是封装在request.FILES里,而不是request.POST里

相关推荐:

Django如何加载css和js文件以及静态图片

django控件及传参使用详解

Atas ialah kandungan terperinci Django项目实战之用户头像上传与访问. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Alat AI Hot

Undresser.AI Undress

Undresser.AI Undress

Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover

AI Clothes Remover

Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool

Undress AI Tool

Gambar buka pakaian secara percuma

Clothoff.io

Clothoff.io

Penyingkiran pakaian AI

AI Hentai Generator

AI Hentai Generator

Menjana ai hentai secara percuma.

Artikel Panas

R.E.P.O. Kristal tenaga dijelaskan dan apa yang mereka lakukan (kristal kuning)
1 bulan yang lalu By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Tetapan grafik terbaik
1 bulan yang lalu By 尊渡假赌尊渡假赌尊渡假赌
Akan R.E.P.O. Ada Crossplay?
1 bulan yang lalu By 尊渡假赌尊渡假赌尊渡假赌

Alat panas

Notepad++7.3.1

Notepad++7.3.1

Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina

SublimeText3 versi Cina

Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1

Hantar Studio 13.0.1

Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6

Dreamweaver CS6

Alat pembangunan web visual

SublimeText3 versi Mac

SublimeText3 versi Mac

Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Bagaimana untuk menggunakan akaun Xiaohongshu untuk mencari pengguna? Bolehkah saya mencari nombor telefon bimbit saya? Bagaimana untuk menggunakan akaun Xiaohongshu untuk mencari pengguna? Bolehkah saya mencari nombor telefon bimbit saya? Mar 22, 2024 am 08:40 AM

Dengan perkembangan pesat media sosial, Xiaohongshu telah menjadi salah satu platform sosial yang paling popular. Pengguna boleh membuat akaun Xiaohongshu untuk menunjukkan identiti peribadi mereka dan berkomunikasi serta berinteraksi dengan pengguna lain. Jika anda perlu mencari nombor Xiaohongshu pengguna, anda boleh mengikuti langkah mudah ini. 1. Bagaimana untuk menggunakan akaun Xiaohongshu untuk mencari pengguna? 1. Buka APP Xiaohongshu, klik butang "Temui" di penjuru kanan sebelah bawah, dan kemudian pilih pilihan "Nota". 2. Dalam senarai nota, cari nota yang disiarkan oleh pengguna yang ingin anda cari. Klik untuk memasuki halaman butiran nota. 3. Pada halaman butiran nota, klik butang "Ikuti" di bawah avatar pengguna untuk memasuki halaman utama peribadi pengguna. 4. Di penjuru kanan sebelah atas halaman utama peribadi pengguna, klik butang tiga titik dan pilih "Maklumat Peribadi"

Log masuk ke Ubuntu sebagai pengguna super Log masuk ke Ubuntu sebagai pengguna super Mar 20, 2024 am 10:55 AM

Dalam sistem Ubuntu, pengguna root biasanya dilumpuhkan. Untuk mengaktifkan pengguna root, anda boleh menggunakan arahan passwd untuk menetapkan kata laluan dan kemudian menggunakan arahan su untuk log masuk sebagai root. Pengguna akar ialah pengguna dengan hak pentadbiran sistem tanpa had. Dia mempunyai kebenaran untuk mengakses dan mengubah suai fail, pengurusan pengguna, pemasangan dan pengalihan keluar perisian, dan perubahan konfigurasi sistem. Terdapat perbezaan yang jelas antara pengguna akar dan pengguna biasa Pengguna akar mempunyai kuasa tertinggi dan hak kawalan yang lebih luas dalam sistem. Pengguna akar boleh melaksanakan perintah sistem yang penting dan mengedit fail sistem, yang tidak boleh dilakukan oleh pengguna biasa. Dalam panduan ini, saya akan meneroka pengguna akar Ubuntu, cara log masuk sebagai akar, dan bagaimana ia berbeza daripada pengguna biasa. Notis

Apakah sudo dan mengapa ia penting? Apakah sudo dan mengapa ia penting? Feb 21, 2024 pm 07:01 PM

sudo (eksekusi superuser) ialah arahan utama dalam sistem Linux dan Unix yang membenarkan pengguna biasa menjalankan perintah tertentu dengan keistimewaan root. Fungsi sudo dicerminkan terutamanya dalam aspek berikut: Menyediakan kawalan kebenaran: sudo mencapai kawalan ketat ke atas sumber sistem dan operasi sensitif dengan membenarkan pengguna mendapatkan kebenaran superuser buat sementara waktu. Pengguna biasa hanya boleh mendapatkan keistimewaan sementara melalui sudo apabila diperlukan, dan tidak perlu log masuk sebagai pengguna super sepanjang masa. Keselamatan yang dipertingkatkan: Dengan menggunakan sudo, anda boleh mengelak daripada menggunakan akaun akar semasa operasi rutin. Menggunakan akaun akar untuk semua operasi boleh menyebabkan kerosakan sistem yang tidak dijangka, kerana sebarang operasi yang salah atau cuai akan mempunyai kebenaran penuh. dan

Django vs. Flask: Analisis perbandingan rangka kerja web Python Django vs. Flask: Analisis perbandingan rangka kerja web Python Jan 19, 2024 am 08:36 AM

Django dan Flask adalah kedua-duanya peneraju dalam rangka kerja Web Python, dan kedua-duanya mempunyai kelebihan dan senario yang boleh digunakan. Artikel ini akan menjalankan analisis perbandingan kedua-dua rangka kerja ini dan memberikan contoh kod khusus. Pengenalan Pembangunan Django ialah rangka kerja Web berciri penuh, tujuan utamanya adalah untuk membangunkan aplikasi Web yang kompleks dengan cepat. Django menyediakan banyak fungsi terbina dalam, seperti ORM (Pemetaan Hubungan Objek), borang, pengesahan, bahagian belakang pengurusan, dsb. Ciri-ciri ini membolehkan Django mengendalikan besar

Kebaikan dan Keburukan Rangka Kerja Django: Semua yang Anda Perlu Tahu Kebaikan dan Keburukan Rangka Kerja Django: Semua yang Anda Perlu Tahu Jan 19, 2024 am 09:09 AM

Django ialah rangka kerja pembangunan lengkap yang merangkumi semua aspek kitaran hayat pembangunan web. Pada masa ini, rangka kerja ini merupakan salah satu rangka kerja web yang paling popular di seluruh dunia. Jika anda bercadang untuk menggunakan Django untuk membina aplikasi web anda sendiri, maka anda perlu memahami kelebihan dan kekurangan rangka kerja Django. Berikut ialah semua yang anda perlu ketahui, termasuk contoh kod khusus. Kelebihan Django: 1. Pembangunan pesat-Djang boleh membangunkan aplikasi web dengan cepat. Ia menyediakan perpustakaan yang kaya dan dalaman

Analisis mekanisme penyimpanan kata laluan pengguna dalam sistem Linux Analisis mekanisme penyimpanan kata laluan pengguna dalam sistem Linux Mar 20, 2024 pm 04:27 PM

Analisis mekanisme penyimpanan kata laluan pengguna dalam sistem Linux Dalam sistem Linux, penyimpanan kata laluan pengguna adalah salah satu mekanisme keselamatan yang sangat penting. Artikel ini akan menganalisis mekanisme penyimpanan kata laluan pengguna dalam sistem Linux, termasuk storan kata laluan yang disulitkan, proses pengesahan kata laluan dan cara mengurus kata laluan pengguna dengan selamat. Pada masa yang sama, contoh kod khusus akan digunakan untuk menunjukkan proses operasi sebenar penyimpanan kata laluan. 1. Penyimpanan kata laluan yang disulitkan Dalam sistem Linux, kata laluan pengguna tidak disimpan dalam sistem dalam teks biasa, tetapi disulitkan dan disimpan. L

Bagaimana untuk menukar nama akaun dan avatar dalam Win10 - Panduan langkah demi langkah terperinci Bagaimana untuk menukar nama akaun dan avatar dalam Win10 - Panduan langkah demi langkah terperinci Jan 14, 2024 pm 01:45 PM

Selepas mendaftar akaun win10, ramai rakan merasakan bahawa avatar lalai mereka tidak kelihatan sangat bagus datang dan lihat. Cara menukar nama akaun dan avatar win10: 1. Pertama klik pada sudut kiri bawah untuk bermula. 2. Kemudian klik pada avatar di atas dalam menu pop timbul. 3. Selepas memasukkan, klik "Tukar Tetapan Akaun". 4. Kemudian klik "Semak imbas" di bawah avatar. 5. Cari foto yang anda mahu gunakan sebagai avatar anda dan pilihnya. 6. Akhirnya, pengubahsuaian berjaya diselesaikan.

Cara menaik taraf versi Django: langkah dan pertimbangan Cara menaik taraf versi Django: langkah dan pertimbangan Jan 19, 2024 am 10:16 AM

Cara menaik taraf versi Django: langkah dan pertimbangan, contoh kod khusus diperlukan Pengenalan: Django ialah rangka kerja Web Python yang berkuasa yang sentiasa dikemas kini dan dinaik taraf untuk memberikan prestasi yang lebih baik dan lebih banyak ciri. Walau bagaimanapun, bagi pembangun yang menggunakan versi lama Django, menaik taraf Django mungkin menghadapi beberapa cabaran. Artikel ini akan memperkenalkan langkah dan langkah berjaga-jaga tentang cara untuk meningkatkan versi Django dan memberikan contoh kod khusus. 1. Sandarkan fail projek sebelum menaik taraf Djan

See all articles