スクリプトのお勉強 技術

Djangoアプリサンプル – 画像ファイルアップロード + 顔モザイク(画像アップロード編)

投稿日:2019年6月12日 更新日:

仕事で使用している、Djangoについて、サンプルを作成してみようと思います。ここでは、画像ファイルのアップロードと顔モザイクを行うwebアプリを作成してみようと思います。

この記事ではファイルアップロードを扱います。

Django テンプレート

Djangoアプリのサンプルを作るうえで、何らかのテンプレートを基にして作成しようと考えました。

その方が早い、というのもありますが、毎回ゼロから作るのも大変なだけだからです。

django-starter-template

以下のテンプレートを使用してみました。
見たところ、シンプルでコードを追加しやすいためです。

https://github.com/fasouto/django-starter-template

ただ、仕事で使うなら、もう少し、CSS(SASS)が追加済みだったりするといいかもしれません。

プロジェクト作成準備

一つ上のディレクトリ(make_project)で、django-adminコマンドを起動できるよう設定し、 実際に使用するプロジェクト(django_upload)を作成します。

### 作成準備
$ mkdir make_project
$ cd make_project
$ python3.6 -m venv ./venv
$ source venv/bin/activate
$ pip install django
$ django-admin startproject --template=https://github.com/fasouto/django-starter-template/archive/master.zip --extension=py,md,html,txt django_upload
### ここから実際のプロジェクト作成
$ cd django_upload
### ImageField用
$ pipenv install pillow
$ export SECRET_KEY='phil-dunphy98!-bananas12'
$ export DJANGO_SETTINGS_MODULE="django_upload.settings.production"
$ pipenv run python manage.py runserver 0.0.0.0:18889

MEDIA_ROOTは設定済みだったので、設定は追加していません。

まずはファイルアップロード

テンプレートができたら、あとは以下を追加します。

upload_formのURLを準備します。upload_formという行を追加しました。

app/base/urls.py

urlpatterns = [
    url(r'^$', home, name='home'),
    url(r'upload_form$', upload_file, name='upload_form'),
]

views.pyはテンプレートで用意してあるので、それに以下を追記しました。

app/base/views.py

def upload_file(request):
    if request.method == 'POST':
        form = UploadForm(request.POST, request.FILES)
        if form.is_valid():
            download_url = form.save()
            context = {
                'download_url': download_url,
                'form': form,
            }
            return render(request, 'base/upload.html', context)
    else:
        form = UploadForm()
    return render(request, 'base/upload.html', {'form': form})

forms.pyは新規で準備しました。

app/base/forms.py

rom django import forms
from django.core.files.storage import default_storage


class UploadForm(forms.Form):
    file = forms.ImageField(label='画像ファイル')

    def save(self):
        upload_file = self.cleaned_data['file']
        file_name = default_storage.save(upload_file.name, upload_file)
        return default_storage.url(file_name)

apps/base/views.pyでrenderしている、テンプレートは以下です。

apps/base/templates/base/upload.html

<form action="" method="POST" enctype="multipart/form-data">
  {{ form.as_p }}
  {% csrf_token %}
  <button type="submit">送信</button>
</form>

{% if download_url %}
<a href="{{ download_url }}">{{ download_url }}</a>
{% endif %}

起動

以下で起動します。

$ pipenv run python manage.py runserver 0.0.0.0:18889

アップロード画面

アップロード画面です。

アップロード後

/media/DSC_0718.JPGをクリックすると画像が出てきます。

おわりに

とりあえず画像アップロード方法だけ説明しました。

次は、アップロードした画像を加工する方法を書いてみます。

アップロードの参考

https://docs.djangoproject.com/en/2.2/topics/http/file-uploads/
https://ymgsapo.com/2018/11/05/show-image-imagefield/

-スクリプトのお勉強, 技術

執筆者:

関連記事

Thunderbird プラグイン WebExtensions版開発方法を調べた

初めに 最近のメールは、中身だけ見てもスパムかどうかわからないぐらい、精巧にできてます。 一方、各プロバイダでは対応ができていることも多いです。例えば、私はメールはOCNなのですが、OCNは&#822 …

Selenium + Python によるアップロードアプリの動作確認プログラム作成

私の周りでは、なぜかSeleniumが流行っている模様です。 私自身は、Webアプリ的なのも作ってますが、あまり使ってなかったので、使ってみようと思います。 前回作成した、Djangoのupload_ …

unconstant – perlライブラリ

ちょっとだけperlの機能修正をしたので、そのときに使用したライブラリについて書こうと思います。 perlのunconstant です。 use constantの解除 use constantとは固 …

Pipenvでライブラリ(*.whl)をキャッシュする方法

仕事でWebアプリケーションを作成した場合、ガンガンとライブラリのバージョンを上げたりはしない場合があります。 そして、長期間放置されるタイプのWebアプリケーションの場合、使用しているライブラリが、 …

言語別ログイン機能パスワード保存処理方針

ちょっと前に、ログイン機能を作成した際、パスワードを暗号化するか、という議論を目にしたことがありました。 昔だと、「パスワードを暗号化しない」方で実装していましたが、最近はセキュリティが当たり前になっ …

google オプトアウト Click here to opt-out.