ryotankの備考録日記

趣味の電子工作についての備考録などなど

基板設計記録WEBアプリその24

今回は、実際に画像へアクセスするのをやってみるのと
Djanogoで画像をアップロードする方法について学ぶ

画像をアップロードする為には、以下のような設定が必要

1.Pillowのインストール
2.モデルフィールド「ImageField」を作成し、データベーステーブルを作成する
3.アップロード画面の作成



2.モデルフィールド「ImageField」を作成

#ImageFieldの基本構文
ImageField(upload_to=None, hgiht_field=None, width=None,
	max_length=100)

引数を設定しない場合は、settings.pyの「PDR_ROOT」フォルダ直下に
データが保存される

任意のフォルダに保存したい場合は、次のようなステップで
フォルダを"指定する"必要がある

1.PDR_ROOTで指定したフォルダ内に任意のフォルダを作る
2.ImageFieldのオプション「upload_to」でフォルダ名を指定する

例えば「images」というフォルダに保存する場合は
実際にフォルダを作成した上で、下記の通りとする

class ImageUpload(models.Model):
   title = models.CharField(max_length=100)
   img = models.ImageUpload(upload_to="images") #このような感じ

   def __str__(self):
      return self.title

アップロード画面の作成
ここでは、簡単にするためモデルフォームクラスを使用する

forms.py

from django import forms
from .models import ImageUpload

class ImageUploadForm(forms.ModelForm):
    class class Meta:
        model = ImageUpload
        fields = "__all__"

views.py
フォームをテンプレートへ渡す
「CreateView」を使って進める

from django.views.generic.edit import CreateView
from .forms import ImageUploadForm

class ImageUploadView(CreateView):
    template_name = "nippo/image-upload.html"
    form_class = ImageUploadForm
    success_url = "/"


image-upalod.html
テンプレートでフォームを表示する

{% extends 'base.html' %}

{% block contet %}
    <form method="POST" enctype="multipart/form-data">{% csrf_token %}
        {{ form.as_p }}
        <button type="submit">送信</button>
    </form>
{% endblock %}
1. enctype="multipart/form-data"
2. {% csrf_token %}

urls.py
ビュークラスとURLを紐付けします

from django.urls import path
from .views import ImageUploadView

urlpatterns = [
    path("image-upload/", ImageUploadView.as_view(), name="image-upload")
]

以上で、任意のフォルダにユーザーが画像を保存できるページが完成する


画像を追加するのでデータベース関連のものを
書き換えなければならない

次回は、画像データを追加したデータベースのER図やら
テーブル定義書などを改めて考える
ただ実装は、少しあとになりそう

また、PDRの進捗状況をパワポみたいなもので
可視化するかな