# Line Notify with Django
> 2023/4/1 林冠曄
# Abstract
這個教學要教你如何用 django + line notify。
關於 Line notify 的使用請參考[這篇文章](/FHCwdlJ6RIyX8JkmmwZIrA)。
這邊我們會著重在 Django 的使用，此次介紹如何建立一個 `template` 並透過表單來取得使用者數據。
完成這篇教學之後，你可以在網站上設定一個表單，使用者填寫表單後，你會在 Line 上面收到訊息。

# Startapp and Configure
在 `shell` 中執行

python manage.py startapp line_notify

`settings.py`中安裝`app`

INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
#     你新增的apps
    'line_notify',
]

`urls.py`

from django.contrib import admin
from django.urls import path, include

urlpatterns = [
    path('admin/', admin.site.urls),
    path('line/', include('line_notify.urls')),
]

`line_notify/urls.py`

from django.urls import path
from . import views

urlpatterns = [
    path('sned_message', views.send_message, name='send_message'),
]

`line_notify/views.py`

from django.shortcuts import render
from django.http import HttpResponse

def send_message(request):
    return HttpResponse('my line notify')

到這邊設定完畢，我們新增了一個 app、一個 view，並設定路徑 `/line/send` 會連結到這個畫面。
現在我們先簡單的放上一個 `HttpResponse` 來測試。

# Templates
## Set up
我們現在要來新增一個 `html` 檔案，並讓他跟後台進行溝通。
- 在 `line_notify` 中新增一個「資料夾」名為 `templates`
- 在 `templates` 中新增一個「資料夾」名為 `line_notify`
- 在 `line_notify` 中新增一個「檔案」名為 `send_message.html`

最後一個檔案名稱可以自訂，其他請跟我一樣。

`send_message.html`

<h1>Contact Me</h1>

現在回到 `line_notify/views.py`

from django.shortcuts import render
from django.http import HttpResponse

def send_message(request):
    return render(request, 'line_notify/send_message.html')

這邊我們使用剛剛建立的模板。此時你再一次進入 `/line/send_message` 就會看到大標題 Contact Me 了。
到這邊我們基本設定完畢，現在來設定我們的表格，這樣使用者才可以填資料。

## `send_message.html`
建立一個表單，包含一個輸入框跟一個送出按鈕。
注意，`{% csrf_token %}` 一定要加上去。

<h1>Contact Me</h1>
<form method='post'>{% csrf_token %}
    <input type='text' name='message' placeholder='請輸入留言...'>
    <button type='submit'>送出</button>
</form>

## `views.py`
我們直接引入[這篇文章](/FHCwdlJ6RIyX8JkmmwZIrA)中的程式碼。
並在底下修改`send_message`來讓剛剛表單的資訊傳送到`LineMessage`中。

from django.shortcuts import render
from django.http import HttpResponse
import requests

def LineMessage(token, msg):
	headers = {
		"Authorization": "Bearer "+token,
		"Content-Type":"application/x-www-form-urlencoded"
	}
	payload = {
      'message' : msg,
					}

	r = requests.post('https://notify-api.line.me/api/notify', headers = headers, params = payload)
	return r.status_code


def send_message(request):
    token = '這裡改成你自己的token'
    if request.method == 'POST':
        message = request.POST.get('message')
        LineMessage(token, message)
        return HttpResponse('<h1>感謝你的留言！</h1>')
    return render(request, 'line_notify/send_message.html')

- 20: 當收到網頁那邊的`POST`也就是按下送出後。
- 21: 將剛剛 `send_message.html` 中的 `name='message'` 裡的內容取出。
- 22: 送出 Line 訊息。
- 23: 回傳一個感謝留言的字樣。

到這邊我們簡易的 Line Notify 就完成。你可以根據自己的需求修改，加入自己的專案。

# 變漂漂
再來是我自己進行的一些小修改，你可以參考看看。
## `send_message.html`

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/css/bootstrap.min.css" integrity="sha384-xOolHFLEh07PJGoPkLv1IbcEPTNtaed2xpHsD9ESMhqIYd0nLMwNLD69Npy4HI+N" crossorigin="anonymous">


<div class='container'>
<h1>Contact Me</h1>
<form method='post'>{% csrf_token %}
<div class='form-group'>
    <input type='text' name='name' placeholder=' * 你的名字' required>
</div>
<div class='form-group'>
    <textarea class='form-control' type='text' name='message' placeholder='* 請輸入留言...' required></textarea>    
</div>
    <button type='submit' class='btn btn-outline-secondary'>送出</button>
</form>    
</div>
<div class='container'>
{% if result %}
<h1>{{name}}，感謝您的訊息！您的訊息如下：</h1>
{{result}}
{% endif %}
</div>

## `line_notify/views.py`

from django.shortcuts import render
from django.http import HttpResponse
import requests

def LineMessage(token, msg):
	headers = {
		"Authorization": "Bearer "+token,
		"Content-Type":"application/x-www-form-urlencoded"
	}
	payload = {
      'message' : msg,
					}

	r = requests.post('https://notify-api.line.me/api/notify', headers = headers, params = payload)
	return r.status_code


def send_message(request):
    token = 'VFTNuLsKI9hItMfPY4tXwtGgoaCZCqNCCoDmYx6OBo3'
    if request.method == 'POST':
        name = request.POST.get('name')
        m = request.POST.get('message')
        message = f"""
        來自{name}的訊息：
        {m}
        """
        LineMessage(token, message)
        return render(request, 'line_notify/send_message.html', {'result':m, 'name':name})
    return render(request, 'line_notify/send_message.html')

## 執行結果

- 上面我用了 Bootstrap 來美化，並做了一些修改，有的我這個教學沒有講到。你可以先研究看看，我之後的教學也會提。