タグ機能の実装をしたいです。Flaskでデータベースを使用したアプリ作成の学習をしています

Question

実現したいこと

データベース上の野菜の一覧から、同一の特徴を持つ野菜だけを抽出して表示する
webアプリを作っています。

欲しいものは、タグ機能の実装です。以下の条件を満たしたものを作成したいです。

• タグの名称を後で変更できる
• 一つのに複数のタグ(10個ほど)を付けることができる
• 現状のFlask、sqlalchemyで実現したいです

発生している問題・分からないこと

https://senews.jp/toxi1/
リンク先の「TOXI法」を参考に
記事のテーブル(Vagitable)と、タグのテーブル(Tag)と、
記事とタグを紐づけるテーブル(Tag_map)の
三種類を用意する方法を実装したいのですが、
絞り込んだ記事を呼び出す方法がわかりません。

用意したテーブル

Vegetable

id	name
1	ピーマン
2	トマト
3	キャベツ

Tag

id	name
1	緑の野菜
2	根菜類
3	葉菜類

Tag_map

id	vegetable_id	tag_id
1	1	3
2	1	1
3	2	3
4	3	1

※ピーマンに緑の野菜＆果菜類
トマトに果菜類
キャベツに緑の野菜＆葉菜類　をタグ付けした例です

該当のソースコード

from flask import Flask, render_template
from flask_sqlalchemy import SQLAlchemy

app = Flask(__name__)
app.config['SQLALCHEMY_DATABASE_URI'] = 'sqlite:///log.db'
db = SQLAlchemy(app)

class Vegetable(db.Model):
  id = db.Column(db.Integer, primary_key=True)
  name = db.Column(db.String, nullable=False)

class Tag(db.Model):
  id = db.Column(db.Integer, primary_key=True)
  name = db.Column(db.String, nullable=False)

class Tag_map(db.Model):
  id = db.Column(db.Integer, primary_key=True)
  vegetable_id = db.Column(db.Integer, nullable=False)
  tag_id = db.Column(db.Integer, nullable=False)

@app.route('/vegetable')
def vegetable(name):
  tags = db.session.query(Tag).all()
  vegetables = db.session.query(Vegetable).all()
  return render_template('vegetable.html', tags=tags, vegetables=vegetables)

@app.route('/vegetable/<tag_id>')
def vegetable_filter(tag_id):
  tags = db.session.query(Tag).all()

# 不明なのは以下の行です。これでは全ての野菜が抽出されてしまいますが
# 上で取得した<tag_id>を使用し、絞り込んだ野菜だけをvegetablesへ格納したいのです。
# (「緑の野菜」タグidである「１」を取得したならば、ピーマンとキャベツのみ格納）

  vegetables = db.session.query(Vegetable).all()

  return render_template('vegetable.html', tags=tags, vegetables=vegetables)

# 絞り込みたいタグを選択できるように一覧表示
{% for tag in tags %}
    <a href="/vegetable/{{tag.id}}">{{tag.name}}</a>
{% endfor %}   

# 絞り込んだ野菜の名前を表示
{% for vegetable in vegetables %}
<p>{{vegetable.name}}</p>
{% endfor %}   

試したこと・調べたこと

• teratailやGoogle等で検索した
• ソースコードを自分なりに変更した
• 知人に聞いた
• その他

上記の詳細・結果

野菜のテーブルにたくさんタグ付け用カラムを用意してみました。

Vegetable

id	name	タグ1	タグ2	タグ3	タグ4	タグ5
1	ピーマン	果菜類	緑の野菜
2	トマト	果菜類
3	キャベツ	緑の野菜

例はタグ少ないですが、たくさんのタグを使用できる設計にしたいのです。
管理が非常に大変で、リネームも難しく
絞り込みのコードも非常に長くなりやめました。

補足

沢山検索し沢山試し非常に苦戦しております。
知恵をお貸しください。よろしくお願いいたします。

Answer 1

Vegetable(野菜)にTag(タグ)を付けて絞り込みたいということですよね？

SQLやDBの勉強をした方が良いと思いますが、とりあえず考え方を記載します。
コードの動作確認をしていないので、もしかしたら動かないかもしれません。
その場合は質問いただくか、デバッグをお願いします。

まず、自分がTOXI法で作成したテーブル3つをご覧ください。

野菜一覧はどこで定義されているかというと、Vegetableテーブルです。
タグ一覧は同様に、Tagテーブルです。
そして、最後に、野菜にタグを付けているのは、Tag_Mapテーブルです。

つまり、野菜はVegetableテーブル、タグはTagテーブル、野菜とタグの関連はTag_mapテーブルに記載されています。
よって、野菜のタグは、Tag_mapテーブルを参照すると分かります。

例えば、「ピーマン」が選択されたとします。

ピーマンは、野菜なので、Vegetableテーブルを参照し、nameが「ピーマン」である行を見つけます。
Flask_Sqlalchemyで検索する場合は、例えば以下の様になります。
(※ 書き方は質問文にある書き方に合わせています。
古い書き方です。最新の書き方は以下を参照ください。
Modifying and Querying Data: Select)

vegetables = db.session.query(Vegetable).filter(Vegetable.name=='ピーマン').all()

all()で取得した場合は、Listが取得できるので例えば、 vegetables[0]にピーマンの行が入っています。

vegetablesは以下が入っているのが想定です。

# vegetables
  # List
  #  [0]: {id: 1, name: ピーマン}

movさんが定義したテーブルは、全てidが主キー(Primary Key)の様です。
Tag_mapテーブル のvegetable_id が取得したidの行一覧を取得すれば、ピーマンのTag一覧が分かります。

Tag_mapテーブル からTag一覧を取得するのは、以下のようなコードです。

# vegetables[0].idは'1'
r_tags = db.session.query(Tag_map).filter(Tag_map.vegetable_id==vegetables[0].id).all()

# これは以下を想定
# r_tags
  # [0]: {id: 1, vegetable_id: 1, tag_id: 3}
  # [1]: {id: 2, vegetable_id: 1, tag_id: 1}

これで、ピーマンにくっついているタグ一覧が取得できました。

取得したのは、主キーの状態なので、それを表示しても意味がありません。
そのため、tagの名前を取得します。

tagの名前を取得するにあたり、取得できたタグ(Tag_map:r_tag)が複数あるので、全部取得します。
速度がどうのとかありそうですが、面倒なのでforで回して取得していまいましょう。

tags = []

for tag in r_tags:
    tmp = db.session_query(Tag).filter(Tag.id==tag.id).first()
    if tmp is not None:
        tags.append(tmp)

# tagsはたぶん以下
# tags
  # [0]: {id: 3, name: 葉菜類}
  # [1]: {id: 1, name: 緑の野菜}

これでピーマンのタグ一覧が取得できました。
あとはrender_templateに、tagsを渡してあげればピーマンのタグが表示できます。

と言うわけで、「試したこと・調べたこと」に書いてある、カラムを沢山用意しました、みたいなのは不要です。
現状のテーブルのままでタグが取得できます。
また、野菜に対して、無限にタグをくっつけることができます。(ストレージ容量の最大値が限界)

ちなみに、「カラムを沢山用意しました」というテーブルはSQLアンチパターンの7章に記載があるアンチパターンです。
7章. マルチカラムアトリビュート（複数列属性）
Qiitaの記事は簡易版なので、詳細は本を参照ください。
このパターンで設計すると、例えば10個とか決まった数までしか対応できません。
(10個以上追加しようとすると、RDBMSのカラムの最大値がネックになり、それ以上増やせなくなります。)

上記で分からない場合は、質問いただいても良いですが、実際にDB(例えばMySQLやMariaDB)をインストールして、そこに質問文に書いたテーブルを作成し、データを入れ、SQLを発行してみると良いです。
どういうデータがどういうSQLで取得できるか分かります。
なんどもやってればそのうち、DBの仕組みも分かるようになってくると思います。

Comments

[mav]

わかりやすく、ご丁寧な回答をありがとうございます。

「forで回して取得」という概念は知っていても、
実際に自分で実装することは困難であり、経験と知識の少なさを痛感しました。
今回は、理解できました。派生させていろいろなことができそうで嬉しいです！

新しい書き方の存在に気づきもせず進めておりましたが、
古い書き方に合わせていただき感謝しております。
一旦は仕組みを理解をするために古い書きで試し、理想通りに動作いたしました。

アンチパターンについての記事も非常に興味深く、
恥ずかしながら現段階では理解は難しいですが
徐々に理解できるよう立ち向かって行きたいと思います。
DBを扱えるようになりたいのでまずは何度でも挑戦いたします。
本当にありがとうございます。