> 백엔드 개발 > 파이썬 튜토리얼 > Django 프로젝트 실용 사용자 아바타 업로드 및 접속

Django 프로젝트 실용 사용자 아바타 업로드 및 접속

不言
풀어 주다: 2018-04-21 14:49:06
원래의
2282명이 탐색했습니다.

이 글에서는 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>
로그인 후 복사

urls.py

from django.conf.urls import url
from app01 import views
urlpatterns = [
  url(r&#39;^upload&#39;,views.upload)
]
로그인 후 복사

views.py

rreee

요약

이런 방식으로 파일 업로드에 대한 기본적인 작은 예를 만들었습니다. 여기서 주의할 점이 몇 가지 있습니다.
1. csrf_token 확인을 양식에 추가해야 합니다.
2. 유형 파일의 입력 상자 값은 file
3. 보기 함수에서 파일을 얻으려면 request.FILES.get() 메소드를 사용하십시오
4. 파일 이름은 obj.name을 통해 얻을 수 있습니다

2 파일을 데이터베이스

models.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;)
로그인 후 복사

views.py

from django.db import models
 class User(models.Model):
  username = models.CharField(max_length=16)
  avatar = models.FileField(upload_to=&#39;avatar&#39;)
로그인 후 복사

Summary

에 업로드하세요.

데이터베이스에 파일을 업로드하는 기능이 변경되었습니다. 위에서 구현한 몇 가지 참고 사항이 있습니다.
1. 소위 데이터베이스에 업로드한다는 것은 이미지 자체나 바이너리 코드를 데이터베이스에 저장하는 것을 의미하지 않습니다. 데이터베이스는 파일의 경로만 저장하므로 사용자가 파일을 호출하려고 할 때 경로를 사용하여 서버에서 지정한 위치를 찾을 수 있습니다.
2. ORM을 생성할 때 아바타 필드에는 upload_to=가 있어야 합니다. 업로드된 파일을 저장할 위치를 지정하는 '' 속성
3. 데이터베이스에 추가할 때 파일 필드 속성 할당은 다음과 같이 일반 필드와 동일한 형식입니다: models.User.objects.create(username=name, avatar=avatar)
4. 두 사용자가 업로드한 파일 이름이 동일할 경우 시스템이 자동으로 파일 이름을 변경하며 그 효과는 다음과 같습니다.

추가

기능을 구현했습니다. .파일을 호출할 때 데이터베이스 파일 경로를 통해 저장된 파일 자체를 통해서만 이미지에 액세스하여 웹 페이지에 나타나도록 하면 되는 것 같습니다.

뭔가 구성이 필요합니다. 그렇지 않으면 django가 URL 확인에 실패하게 됩니다. 우리가 정적으로 정적 파일에 직접 액세스할 수 있는 이유는 django가 이미 이를 구성했기 때문입니다.

구성 단계는 다음과 같습니다.

1. urls.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;)
로그인 후 복사

을 구성합니다. 사이트의 settings.py 구성 후 , http://127.0.0.1:8001/media/milk.png를 통해 이미지에 액세스할 수 있습니다.

3 AJAX를 사용하여 파일을 제출


upload.html

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

MEDIA_URL="/media/"   # 跟STATIC_URL类似,指定用户可以通过这个路径找到文件
로그인 후 복사

views.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}),
로그인 후 복사

Summary

1. Ajax 업로드 시 버튼 입력 시 submit을 사용하면 안 됩니다. 2. Ajax 업로드 시 data 매개변수의 값은 더 이상 일반적인 '사전' 유형 값이 아닙니다. , 그러나 FormData 개체입니다

Create 개체 formdata = new FormData()


값 추가 formdata.append('username',$('#name-input').val()) ;

  1. 3.Ajax는 게시물 제출 시 csrf 확인을 추가해야 합니다

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

4. 마지막으로 Ajax를 통해 파일을 업로드할 때 두 가지 매개변수 설정이 있습니다

  1. processData:false

contentType:false

  1. 4 이미지 파일 업로드 시 미리보기 기능이 있습니다
  2. <!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>
    로그인 후 복사

    5 요약

    파일 업로드의 경우 직접 양식 제출이든 Ajax 제출이든 근본적인 문제는 업로드하려는 내용이 일반 문자열이 아니라 파일임을 브라우저에 알리는 것입니다

    어떻게 요청 가중치의 ContentType 매개변수를 통해 브라우저에 알리려면 기본값인
    이 있으므로 일반 문자열을 업로드할 때 이를 지정할 필요가 없습니다. 그리고 파일을 전송하려면 다음을 수행해야 합니다. 별도로 지정하세요. 다음 사항을 요약하면

    1. Form 업로드 시 enctype="multipart/form-data"를 통해 ContentType을 지정하세요.

    2. ajax를 통해 업로드할 경우 processData:false 및 contentType:false를 통해 ContentType을 지정하세요.
    3. 업로드 시 form에서 파일 데이터는 태그를 통해 '래핑'됩니다.

    4. Ajax가 업로드되면 FormData 인스턴스 객체를 통해 데이터가 추가됩니다.

    5. 데이터가 전달된 후에는 request.POST

    대신 request.FILES에 캡슐화됩니다. 관련 권장 사항:

    Django가 CSS 및 js 파일과 정적 이미지를 로드하는 방법

    Django 컨트롤 사용 및 매개변수 전달에 대한 자세한 설명

    위 내용은 Django 프로젝트 실용 사용자 아바타 업로드 및 접속의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
최신 이슈
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿