質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

88.04%

ファイルアップロードを成功させたい

解決済

回答 1

投稿 編集

  • 評価
  • クリップ 0
  • VIEW 294

score 76

前提・実現したいこと

恐縮ですが、以下2点実現したいことがあります。
・ファイルアップロードを成功させたい
・違う種類のメディアファイルは別々のフォルダに格納したい

発生している問題・エラーメッセージ

現状、別々のフォルダにファイルを格納する以前に、一つのフォルダにファイルアップロードが出来ていない状況です。
フォーム内を全て埋め送信を行なったのですが、index.htmlのformの上にThis field is required.とエラーメッセージが表示されてしまいました。
以下の画像は、プロジェクトディレクトリ下に設置した「media/documents」フォルダになります。
イメージ説明

該当のソースコード

以下は、index.htmlになります。

{% load static %}
<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" type="text/css" href="{% static 'uploader/css/style.css' %}">
    <title>Document</title>
</head>
<body>
    <div>
        <p>YoutubeUploader</p>
      {% for field in form %}
            {{ field.errors }}
          {% endfor %}
        <form method="post" action="{% url 'uploader:result' %}" enctype="multipart/form-data">
            {% csrf_token %}
            <p>タイトル: <input type="text" name="title"></p>
            <p>説明: <textarea class="description" name="説明" rows="5" cols="50"></textarea></p>
            <p>タグ: <textarea class="description" name="説明" rows="5" cols="50"></textarea></p>
            <p>カテゴリ:
                <select name="category">
                    <option>映画とアニメ</option>
                    <option>自転車と乗り物</option>
                    <option>音楽</option>
                    <option>ペットと動物</option>
                    <option>スポーツ</option>
                    <option>旅行とイベント</option>
                    <option>ゲーム</option>
                    <option selected>ブログ</option>
                    <option>コメディ</option>
                    <option>エンターテインメント</option>
                    <option>ニュースと政治</option>
                    <option>ハウツーとスタイル</option>
                    <option>教育</option>
                    <option>化学と技術</option>
                    <option>非営利団体と社会活動</option>
                </select>
            </p>
            <p>client_secret(JSON): <input type="file" name="certification_file"></p>
            <p>動画ファイル: <input type="file" name="movie_file"></p>
            <button type="submit">アップロード</button>
        </form>
    </div>
</body>
</html>


以下は、views.pyです

from django.shortcuts import render
from django.urls import path
import http.client  # httplibはPython3はhttp.clientへ移行
import httplib2
import os
import random
import sys
import time

from apiclient.discovery import build
from apiclient.errors import HttpError
from apiclient.http import MediaFileUpload
from oauth2client.client import flow_from_clientsecrets
from oauth2client.file import Storage
from oauth2client.tools import argparser, run_flow
from .forms import DocumentForm
from django.http import HttpResponse, HttpResponseRedirect
from django.shortcuts import redirect

# Create your views here.
def index(request):
    return render(request,'uploader/index.html')


def result(request):
    if request.method == 'POST':
        form = DocumentForm(request.POST, request.FILES)
        if form.is_valid():
            form.save()
            return redirect(request,'uploader/result.html')
    else:
        form = DocumentForm()

    return render(request, 'uploader/index.html', {
        'form': form
    })


以下は、forms.pyになります

from django import forms
from .models import Document
from django.core.validators import MinLengthValidator

class DocumentForm(forms.ModelForm):
    class Meta:
        model = Document
        fields = ('description', 'document', )

以下は、models.pyになります。

from django.db import models

# Create your models here.
class Document(models.Model):
    description = models.CharField(max_length=255, blank=True)
    document = models.FileField(upload_to='documents/')
    uploaded_at = models.DateTimeField(auto_now_add=True)

試したこと

入力フィールドは全て埋め、「client_secret(JSON)」にはJSONファイル、「動画ファイル」にはmp4ファイルを指定しました。

補足情報(FW/ツールのバージョンなど)

OSはMac OS,エディターはVSCodeを使用しております。

  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 過去に投稿した質問と同じ内容の質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

回答 1

checkベストアンサー

0

テンプレートのinputnameDocumentFormの対応ができていません。
OAuth2や、もしかしたらOIDCとか気になりますが、まずは、下記テンプレートでいかがでしょうか。

load static %}
<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" type="text/css" href="{% static 'uploader/css/style.css' %}">
    <title>Document</title>
</head>
<body>
    <div>
        <p>YoutubeUploader</p>
      {% for field in form %}
            {{ field.errors }}
          {% endfor %}
        <form method="post" action="{% url 'uploader:result' %}" enctype="multipart/form-data">
            {% csrf_token %}
            {{ form }}
            <button type="submit">アップロード</button>
        </form>
    </div>
</body>
</html>

投稿

編集

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2020/07/05 10:58

    ご回答頂きまして、ありがとうございます。
    行き詰まってしまっていた為、助かりました。iinputのnameはモデルと対応をしていたのですね。
    Djangoのテンプレート構文の{{ form }}は、既にHTML,CSSを作成していた為、使用は見送る形としたのですが、一度使用してみましたら、forms.pyやmodelとの連携が確認出来、大変勉強になりました。

    キャンセル

  • 2020/07/05 11:02 編集

    すみません。実は、どうしても解決できない点があり、誠に恐縮なのですが、ご助言頂きたい質問がございます。
    その質問と言いますのは、「https://teratail.com/questions/275006」こちらになります。
    お手数をおかけし申し訳ないのですが、お手すきの際にでもチェック頂けましたら幸いです。

    キャンセル

15分調べてもわからないことは、teratailで質問しよう!

  • ただいまの回答率 88.04%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる

関連した質問

同じタグがついた質問を見る