.png)
記事一覧を表示する
投稿された一筆書きの絵の記事タイトルを、1ページあたり最大5件まで表示します。5件以上ある場合のページ遷移（ページネーション）については、後のセクション（「5件ずつ記事のページを遷移する」）で解説します。まずは、最新の記事タイトル5件を表示する処理を実装します。
etc.pyファイルをコーディングする
記事タイトルを表示する前に、タグなどが投稿された場合にタグの機能を無効化する「エスケープ」の処理が必要です。その処理を「get_html」関数で行います。
import html
import re
def get_html(text):
text = re.sub(re.compile('<.*?>'), ' ', text)
text = text.replace('<','<')
text = text.replace('>','>')
text = text.replace('&','&')
text = text.replace('\"','"')
text = text.replace('\'','’')
text = text.replace('\n','<br />')
return html.unescape(text)
def random_load(cur):
xy = ''
sql = 'SELECT xy FROM article WHERE id = (SELECT ABS(RANDOM()) % (SELECT MAX(id) FROM article) + 1) LIMIT 1;'
for row in cur.execute(sql):
if row[0] != None:
xy = row[0]
if (xy != ''):
print('<script>loadPos("{}");</script>'.format(xy))
サンプルコードの解説
モジュールを読み込みます。
get_html関数で、HTMLタグをエスケープします。
「text」引数の'<'、'>'、'&'、'\"'、'\''、'\n'のHTMLとして意味を持つ記号を単なる文字列に変換します。
「unescape」関数は一見「アンエスケープ（エスケープしない）」ように見えますが、正しくは「Unicode Escape」です。ユニコードになった文字列を人間が読める文字列にエスケープします。
home.pyファイルをコーディングする
第4回で作ったデータベース「bezierbbs.db」ファイルからデータを取得します。記事を降順（idが大きいものから小さいものへの順番で）に取得します。
記事のオフセット（OFFSET、偏り）として「select」変数を、記事の表示最大数（ARTICLE_NUM = 5）ずつをページの先頭にしてセットします。GETのselectパラメータがない場合は'1'番目です。ちなみに、このselect変数はSQL文のSELECT文とは別物です。
import pages.etc as etc
def html(form,cur):
select = int(form.getfirst('select', '1'))
print('''
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>一筆書きBBS</title>
<link href="css/pc.css" rel="stylesheet" type="text/css" />
<link href="css/mobile.css" rel="stylesheet" type="text/css" media="only screen and (max-width:1023px)" />
<script type="text/javascript" src="js/main.js"></script>
</head>
<body>
<div id="left">
<header>
<h1>一筆書きBBS</h1>
<nav>
<a href="?page=home">HOME</a>
<a href="?page=draw">DRAW</a>
<a href="?page=about">ABOUT</a>
</nav>
</header>
<h2>記事</h2>
<ul>
''')
title = ''
speaker = ''
date = ''
ARTICLE_NUM = 5
data = (ARTICLE_NUM,(select-1)*ARTICLE_NUM)
sql = '''SELECT id,title,speaker,date FROM article ORDER BY id DESC LIMIT ? OFFSET ?''' #
for row in cur.execute(sql,data):
if row[0] != None:
id = row[0]
if row[1] != None:
title = etc.get_html(row[1])
if row[2] != None:
speaker = etc.get_html(row[2])
if row[3] != None:
date = row[3]
print('''
<li><a href="?page=comment&article_id={}">{}</a><br />{}<br />{}</li>
'''.format(id,title,date,speaker))
print('</ul>')
etc.random_load(cur)
サンプルコードの解説
select変数はGETしたselectパラメータから取得します。
「title」変数に記事タイトルを、「speaker」変数に発言者名を、「date」変数に日時を、「ARTICLE_NUM」変数（定数として使うので全て大文字に）は一度に表示する最大件数を5件にします。
SQL文は、「article」テーブルの「id」カラムを降順に（ORDER BY id DESC）、LIMITで最大5件、OFFSETでオフセットを（select-1）*ARTICLE_NUM件目からの、レコードを取得します。
row[0]にarticleテーブルのidカラムが、row[1]にtitleカラムが、row[2]にspeakerカラムが、row[3]にdateカラムが取得できます。
コメントページへのリンクをタイトルにHTML5文書を出力します。
