Flask部落格開發 Tinymce編輯器

2022-05-17 09:48:02 字數 2275 閱讀 7433

之前flask部落格的文字編輯器使用的是markdown,對部署洗該語法的使用者不夠友好,因此這裡為部落格新增個簡單易用的tinymce文字編輯器。

github見:

。tinymce_setup.js是配置檔案,設定了文字編輯器的語言、按鈕等。

為了和其它表單的風格保持一致,這裡仍使用了flask-wtf表單。配置檔案tinymce_setup.js中標識了id為content的標籤作為tinymce編輯器顯示,這裡為editor欄位新增了相應的指示。測試發現,表單的editor顯示為tinymce後,使用驗證函式無法對輸入進行判斷,這裡將輸入的判斷放入檢視函式中。

class

editorform(flaskform):

title = stringfield('

標題', validators=[datarequired(), length(1, 64)])

editor = textareafield('

正文', id = '

content')

submit = submitfield('

發表')

使用request.method判斷請求為post後,判斷輸入是否為空,若無輸入則給予flask訊息提醒。若已登入的使用者具有寫部落格的許可權,則輸入的內容作為post的body_html屬性建立新的部落格。tinymce將輸入的文字內容轉為html**,因此這裡使用body_html,而不使用body。

@main.route('

/editor

', methods=['

get', '

post'])

@login_required

defeditor():

'''編輯器介面

'''form =editorform()

if request.method == '

post':

ifnot

form.editor.data:

flash(

'write something.')

return render_template('

editor.html

', form=form)

ifcurrent_user.can(permission.write_articles):

print

(request.form)

post = post(title=request.form['

title'],

body_html=request.form['

editor'],

author=current_user._get_current_object())

db.session.add(post)

db.session.commit()

return redirect(url_for('

.post

', id=post.id))

return render_template('

editor.html

', form = form)

在editor.html中加入tinymce.min.js、tinymce_setup.js這兩個檔案。使用wtf.quick_form渲染編輯器表單。

提交後,由於沒有關聯到任何渲染樣式,**自然無法高亮:

大功告成。

用Flask開發部落格實戰教程(1)

最後,你應該還能夠很舒服地 熟練地 編寫 python 強烈推薦熟悉 python 的 python 模組和包 現在我們必須開始安裝 flask 以及一些我們會用到的擴充套件。我首選的方式就是建立乙個 虛擬環境 這個環境能夠安裝所有的東西,而你的主 python 不會受到影響。另外乙個好處就是這種方...

心得 基於Flask技術的web部落格開發總結

flask主要依賴werkzeng和jinja2模板。werkzeng提供route,debug和web服務,jinja2模板提供網頁前端展示功能。bootstrap是twitter的乙個開源框架,它提供的使用者介面的元件可以方便地在flask中復用。表現層狀態轉移 representational...

flask訪問404 FLASK部落格系列3 路由

斷更了幾天,我又回來了。今天我們來講講路由。這個路由可不是我們家裡用的路由,flask路由規則都是基於werkzeug的路由模組的,它還提供了很多強大的功能。現代 web 應用都使用有意義的 url 這樣有助於使用者記憶,網頁會更得到使用者的青睞,提高回頭率。從上篇文章我們知道,使用route de...