02.第2步:使用 Flask建立後端server【使用Python Flask框架快速建置網站】

更新於 發佈於 閱讀時間約 3 分鐘

【建置環境說明】

開發環境是win11,python是3.10.7版本,編碼的工具是Visual Studio Code(簡稱vscode)

【本篇說明】

為了讓前端網頁(HTML)能和後端伺服器(server)互動,以 Flask建立web服務。

輸入以下程式碼:(這邊使用vscode開啟編碼,我取名為server.py,可自行取名)

from flask import Flask, render_template   # 從 flask模組載入 Flask、render_template

app = Flask(__name__) # 建立一個 Flask 物件,並命名為app,其中__name__ 表示目前執行的程式

@app.route("/") # 使用函式裝飾器,建立一個路由(或稱路徑),執行時可針對路徑"/"發出請求,作為API負責前端與後端之間的互動

def index(): # 發出請求後會執行index()函式

return render_template('firstscreen.html') # 會使用樣板引擎回傳(firstscreen.html)網頁的內容

if __name__ == '__main__': # 當執行__name__時,app開始執行

app.run()

★★★【補充】除了以下第3點需自行修改,其餘程式碼可以直接複製貼上:

1.@app.route("/"),裡面路徑"/",可以自訂,比如@app.route("/home")

2.def index(),定義函式名稱,也可寫成其他,比如def first()

3.return render_template('firstscreen.html'),裡面的firstscreen.html,可依照自己的html檔案,比如是myhome.html,程式碼改成return render_template('myhome.html')

【本篇小結】

這樣就完成 Flask建立web服務了!接下來就進入步驟3:建立前端HTML網頁。

【本篇結束】

在自學路上難免遇到困難,只要堅持到底,相信就會有所成果,期勉大家一同努力。



留言
avatar-img
留言分享你的想法!
avatar-img
艾肯比工程師
0會員
48內容數
主要分享應用程式開發過程、遭遇困難及解決技巧,提供給自學或獨立開發者做為參考,希望能對您們有所幫助。
你可能也想看
Thumbnail
打開 jupyter notebook 寫一段 python 程式,可以完成五花八門的工作,這是玩程式最簡便的方式,其中可以獲得很多快樂,在現今這種資訊發達的時代,幾乎沒有門檻,只要願意,人人可享用。 下一步,希望程式可以隨時待命聽我吩咐,不想每次都要開電腦,啟動開發環境,只為完成一個重複性高
Thumbnail
打開 jupyter notebook 寫一段 python 程式,可以完成五花八門的工作,這是玩程式最簡便的方式,其中可以獲得很多快樂,在現今這種資訊發達的時代,幾乎沒有門檻,只要願意,人人可享用。 下一步,希望程式可以隨時待命聽我吩咐,不想每次都要開電腦,啟動開發環境,只為完成一個重複性高
Thumbnail
你好,在下最近在學習開發web,學了html css js,也得出一些心得,由於網路上已有許多教學,所以我會著重在如何開發出to do List,以及解釋我寫的程式碼。相關的教學我會直接貼網址。如果我有什麼地方出錯,或者是可以寫得更好,歡迎在下方留言,討論。 首先先介紹我的開發環境: 我用了vs
Thumbnail
你好,在下最近在學習開發web,學了html css js,也得出一些心得,由於網路上已有許多教學,所以我會著重在如何開發出to do List,以及解釋我寫的程式碼。相關的教學我會直接貼網址。如果我有什麼地方出錯,或者是可以寫得更好,歡迎在下方留言,討論。 首先先介紹我的開發環境: 我用了vs
Thumbnail
接續上一篇 Step2:VC#專案建立 Step3:IIS新建站台 Step4:VC#架設到IIS中
Thumbnail
接續上一篇 Step2:VC#專案建立 Step3:IIS新建站台 Step4:VC#架設到IIS中
Thumbnail
# 簡介 身為一位專注於 Vue.js 的前端開發者,這是我第一次嘗試構建 Flutter 網頁應用。讓我們開始吧! ## 第一次嘗試 ### 第一步:創建一個 Flutter 應用 首先,通過運行以下命令來創建一個新的 Flutter 項目: ```sh flutter
Thumbnail
# 簡介 身為一位專注於 Vue.js 的前端開發者,這是我第一次嘗試構建 Flutter 網頁應用。讓我們開始吧! ## 第一次嘗試 ### 第一步:創建一個 Flutter 應用 首先,通過運行以下命令來創建一個新的 Flutter 項目: ```sh flutter
Thumbnail
什麼是Python python是電腦程式語言的一種,如同python官方網站上的介紹 "Python是一種程式語,可讓你更快速地工作並更有效的整合系統"。簡單地說,就是你可用python這個程式語言去告訴電腦你想要作什麼,讓電腦來幫你完成你要作的事情。
Thumbnail
什麼是Python python是電腦程式語言的一種,如同python官方網站上的介紹 "Python是一種程式語,可讓你更快速地工作並更有效的整合系統"。簡單地說,就是你可用python這個程式語言去告訴電腦你想要作什麼,讓電腦來幫你完成你要作的事情。
Thumbnail
前段時間我們有介紹「【Python 軍火庫🧨 - websockets】雙向溝通的渠道」, 這種方式可以達到基本的連線沒問題,但隨著資安意識的抬頭, 我們的websocket連線也會需要在通道之上進行加密, 那麼我們將根據使用情境來教您如何選用適當的連線。 Server端 我們的Serve
Thumbnail
前段時間我們有介紹「【Python 軍火庫🧨 - websockets】雙向溝通的渠道」, 這種方式可以達到基本的連線沒問題,但隨著資安意識的抬頭, 我們的websocket連線也會需要在通道之上進行加密, 那麼我們將根據使用情境來教您如何選用適當的連線。 Server端 我們的Serve
Thumbnail
你知道IG是用Django開發的嗎? 正在學習或使用Django、Flask框架開發後端的你,是否也常在享受Python語法的舒適之餘,仍然煩惱著是否該學習效率更好的GO或Laravel。
Thumbnail
你知道IG是用Django開發的嗎? 正在學習或使用Django、Flask框架開發後端的你,是否也常在享受Python語法的舒適之餘,仍然煩惱著是否該學習效率更好的GO或Laravel。
Thumbnail
軟體系統的發展歷程大多相似,首重解決基本需求、提供操作介面,進而提升安全性、擴充功能、優化操作。
Thumbnail
軟體系統的發展歷程大多相似,首重解決基本需求、提供操作介面,進而提升安全性、擴充功能、優化操作。
追蹤感興趣的內容從 Google News 追蹤更多 vocus 的最新精選內容追蹤 Google News