# 智慧客服 3/19 上課內容
###### tags: `智慧客服`
[virtualenv](https://pypi.org/project/virtualenv/)

[python](https://www.python.org/downloads/windows/)

* 直接下一頁


* 執行位址
#### 資料夾使用者權限設定




"c:\program files\python39\python.exe" -m pip install --upgrade pip

ctrl+c 2次 離開cmd
#### 環境變數的部分

#### 桌面建一個資料夾 再拖入cmd

+ cd


virtualenv . 建立環境
cd Scripts
* activate 啟動

在(ve)環境下 安裝 Flask

建ve2

kk建立資料夾

進入kk的資料環境

都跟上面動作重複

```clike=
C:\> pip install virtualenv # 安裝虛擬環境的套件virtualenv
C:\> mkdir flask_learning
C:\> cd flask_learning
C:\flask_learning> virtualenv . # .表示在目前的目錄新建虛擬環境
C:\flask_learning> cd Scripts
C:\flask_learning\Scripts> activate # 進入虛擬環境
(flask_learning) C:\flask_learning\Scripts> deactivate # 離開虛擬環境
C:\flask_learning\Scripts>
```
#### 確認套件有安裝

[github](https://github.com/benctw/flask)




* git clone https://github.com/benctw/flask.git
* dir 查看專案內容
#### vs Code


* 我有改圖示 不一樣正常的

* 快速尋找章節
*
#### github

* 建立副本 在自己帳號下
#### vs Code



C:\Users\Student\Desktop\ve\Scripts\python.exe

* ctrl+j 執行終端機

* 當成文字

## 修正一下位子
vsCode開啟位子

可以把裡面刪掉

#### 安裝
[Azure](https://docs.microsoft.com/zh-tw/cli/azure/install-azure-cli)


確認安裝成功

az --version


az login


#### 上傳

name 後面是接專案名稱

不存在 會自動建立

更新

#### 查看

#### vsCode


```clike=
from flask import Flask
app = Flask(__name__)
@app.route('/')
def homepage():
return '資策會'
@app.route('/hello')
def hello():
return 'h'
@app.route('/user/<username>')
def user(username):
return f'hello {username}'
if __name__ == "__main__":
app.run(host='127.0.0.1', port=5000, debug=True)
```
* 範例3有

```clike=
@app.route('/')
def homepage():
return 'Homepage'
@app.route('/hello')
def hello():
return 'Hello, World'
@app.route('/user/<username>')
def show_user_profile(username):
# show the user profile for that user
return 'User %s' % escape(username)
@app.route('/post/<int:post_id>')
def show_post(post_id):
# show the post with the given id, the id is an integer
return 'Post %d' % post_id
@app.route('/path/<path:subpath>')
def show_subpath(subpath):
# show the subpath after /path/
return 'Subpath %s' % escape(subpath)
```
#### 範例4

```clike=
from flask import Flask, url_for , redirect
from markupsafe import escape
app = Flask(__name__)
@app.route('/')
def index():
return 'index'
@app.route('/login')
def login():
return 'login'
@app.route('/user')
@app.route('/user/<username>')
def profile(username=None):
if username:
return '{}\'s profile'.format(escape(username))
else:
return redirect(url_for('index'))
with app.test_request_context():
print(url_for('index'))
print(url_for('login'))
print(url_for('login', next='/'))
print(url_for('profile', username='John Doe'))
if __name__ == "__main__":
app.run(host='127.0.0.1', port=5000, debug=True)
```


#### 範例5
* postman


* 顯示圖片


* 樣板


```clike=
from flask import Flask, url_for, request , render_template
from markupsafe import escape
def do_the_login():
return "do_the_login"
def show_the_login_form():
return "show_the_login_form"
app = Flask(__name__)
@app.route('/')
def index():
return render_template('index.html')
@app.route('/login', methods=['GET', 'POST'])
def login():
if request.method == 'POST':
return do_the_login()
else:
return show_the_login_form()
if __name__ == "__main__":
app.run(host='127.0.0.1', port=5000, debug=True)
```
#### Bootstrap
[Bootstrap](https://getbootstrap.com/docs/5.0/getting-started/download/)







#### index.html
```clike=
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Homepage</title>
<link rel="stylesheet" href="/static/css/bootstrap.css">
</head>
<body>
{% include 'navbar.html' %}
<script src="/static/js/bootstrap.js"></script>
</body>
</html>
```
#### login.html
```clike=
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Login</title>
<link rel="stylesheet" href="/static/css/bootstrap.css">
</head>
<body>
{% include 'navbar.html' %}
<div class="container">
<form action="/login" method="POST">
<div class="mb-3">
<label for="exampleInputEmail1" class="form-label">Email address</label>
<input name="email" type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp">
<div id="emailHelp" class="form-text">We'll never share your email with anyone else.</div>
</div>
<div class="mb-3">
<label for="exampleInputPassword1" class="form-label">Password</label>
<input name="password" type="password" class="form-control" id="exampleInputPassword1">
</div>
<button type="submit" class="btn btn-primary">Submit</button>
</form>
</div>
<script src="/static/js/bootstrap.js"></script>
</body>
</html>
```
#### navbar.html

```clike=
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<div class="container-fluid">
<a class="navbar-brand" href="#">Navbar</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="/">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/login">Login</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/logout">Logout</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
Dropdown
</a>
<ul class="dropdown-menu" aria-labelledby="navbarDropdown">
<li><a class="dropdown-item" href="#">Action</a></li>
<li><a class="dropdown-item" href="#">Another action</a></li>
<li><hr class="dropdown-divider"></li>
<li><a class="dropdown-item" href="#">Something else here</a></li>
</ul>
</li>
<li class="nav-item">
<a class="nav-link disabled" href="#" tabindex="-1" aria-disabled="true">Disabled</a>
</li>
</ul>
<form class="d-flex">
<input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">
<button class="btn btn-outline-success" type="submit">Search</button>
</form>
</div>
</div>
</nav>
```
#### 5 app.py
```clike=
from flask import Flask, url_for, request, render_template, redirect, make_response
from markupsafe import escape
import time
def do_the_login(email, password):
if email=='benctw@gmail.com' and password=='kk123':
resp = make_response(redirect(url_for('hello', useremail=email)))
resp.set_cookie('useremail', email, expires = time.time()+60*60*24*7)
return resp
else:
return redirect(url_for('error', errorcode=6000))
app = Flask(__name__)
@app.route('/')
def index():
return render_template('index.html')
@app.route('/login', methods=['GET', 'POST'])
def login():
if request.method == 'POST':
email = request.form['email']
password = request.form['password']
return do_the_login(email, password)
else:
if request.cookies.get('useremail'):
return redirect(url_for('hello', useremail=request.cookies.get('useremail')))
else:
return render_template('login.html')
@app.route('/logout')
def logout():
resp = make_response(url_for('success',success=3001))
resp.set_cookie('useremail','',expires=0)
return resp
@app.route('/hello')
def hello():
useremail = request.args.get('useremail', '')
return render_template('hello.html',useremail=useremail)
@app.route('/success/<int:successcode>')
def success(successcode):
return render_template('success.html', successcode=errorcode)
@app.route('/error/<int:errorcode>')
def error(errorcode):
return render_template('error.html', errorcode=errorcode)
if __name__ == "__main__":
app.run(host='127.0.0.1', port=5000, debug=True)
```


div.xxxx 快捷
[參考老師](https://the.annswer.org/t/topic/312)
[jinja語法](https://jinja.palletsprojects.com/en/2.11.x/templates/)
[jinja老師的](https://the.annswer.org/t/topic/328)
#### 網站


#### error.html

```clike=
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>error</title>
<link rel="stylesheet" href="/static/css/bootstrap.css">
</head>
<body>
{% include 'navbar.html' %}
<div class="container">
{% if errorcode==6000 %}帳號或密碼錯誤
{% elif errorcode==6001 %}資料庫連線錯誤
{% endif %}
</div>
<script src="/static/js/bootstrap.js"></script>
</body>
</html>
```

#### success.html
```clike=
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>success</title>
<link rel="stylesheet" href="/static/css/bootstrap.css">
</head>
<body>
{% include 'navbar.html' %}
<div class="container">
{% if successcode==3000 %}登入成功
{% elif successcode==3001 %}登出成功
{% endif %}
</div>
<script src="/static/js/bootstrap.js"></script>
</body>
</html>
```
#### hello.html
```clike=
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Hello</title>
<link rel="stylesheet" href="/static/css/bootstrap.css">
</head>
<body>
{% include 'navbar.html' %}
<div class="container">hello</div>
<script src="/static/js/bootstrap.js"></script>
</body>
</html>
```
#### page_nor_found.html
```clike=
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>404 Page not found</title>
<link rel="stylesheet" href="/static/css/bootstrap.css">
</head>
<body>
{% include 'navbar.html'%}
<div>
找不到頁面
</div>
<script src="/static/js/bootstrap.js"></script>
</body>
</html>
```
#### sql
[sqlitestudio](https://sqlitestudio.pl/)











#### vscode


```clike=
from flask import Flask, url_for, request, render_template, redirect, make_response, g
from markupsafe import escape
import time, sqlite3
def do_the_login(email, password):
sql = f'select * from `user` where `email`="{email}" and `password`="{password}"'
cursor = g.conn.cursor()
cursor.execute(sql)
data = cursor.fetchone()
return data if data else False
app = Flask(__name__)
@app.before_request
def before():
g.user_email=''
# 連接資料庫
g.conn = sqlite3.connect('flaskdb.db')
@app.teardown_request
def teardown(exception):
# 關閉連線資源
g.conn.close()
@app.route('/')
def index():
return render_template('index.html')
@app.route('/login', methods=['GET', 'POST'])
def login():
if request.method == 'POST':
email = request.form['email']
password = request.form['password']
if do_the_login(email, password):
resp = make_response(redirect(url_for('hello', useremail=email)))
resp.set_cookie('useremail', email, expires = time.time()+60*60*24*7)
return resp
else:
return redirect(url_for('error', errorcode=6000))
else:
if request.cookies.get('useremail'):
return redirect(url_for('hello', useremail=request.cookies.get('useremail')))
else:
return render_template('login.html')
@app.route('/logout')
def logout():
resp = make_response(redirect(url_for('success', successcode=3001)))
resp.set_cookie('useremail', '', expires=0)
return resp
@app.route('/hello')
def hello():
useremail = request.args.get('useremail', '')
return render_template('hello.html', useremail=useremail)
@app.route('/success/<int:successcode>')
def success(successcode):
return render_template('success.html', successcode=successcode)
@app.route('/error/<int:errorcode>')
def error(errorcode):
return render_template('error.html', errorcode=errorcode)
@app.errorhandler(404)
def page_not_found(error):
return render_template('page_not_found.html')
if __name__ == "__main__":
app.run(host='127.0.0.1', port=5000, debug=True)
```
#### cmd

