---
# System prepended metadata

title: 數據瀏覽平台－Django

---

# 數據瀏覽平台－Django 

這是一個**數據瀏覽**的網頁，以RESTful API來進行實作。
起因是朋友想要方便的瀏覽實驗的數據資料，我就接來做做看了，因為朋友主要用 Python，於是我就試試看用Django 的框架去建立，同是 Python 相容性應該會比較好。以下以我自己的圖片去做測試。
|      Env      |
|:-------------:|
|  Windows 10   |
| Django 3.2.18 |
| Python 3.7.16 |

---

## 首頁
![](https://hackmd.io/_uploads/ryPbqXsr3.jpg)

### 功能簡介
- 點大標題回首頁
- **搜尋功能**會包含數據的**標題**與**內容**
    - 使用Django的`filter()`來實作
- 可直接從[`upload`](#Upload)去上傳數據，不用去後台處理
    - 使用POST來實作Create
- 點數據的標題可以看[**詳細資料**](#Detail)
    - 使用GET來實作Read
- `npy`與`Image`的button是下載數據
    - 使用html的download來實作
- [`Modify`](#Modify) 使用POST來實作Update
- [`Delete`](#Delete) 使用POST來實作Delete
- 換頁為每六筆資料換一頁

## Upload
|![](https://hackmd.io/_uploads/HJsEpQoHn.jpg)|
|-|
## Detail
|![](https://hackmd.io/_uploads/H1ZSJEjH2.jpg)|
|-|
## Modify
|![](https://hackmd.io/_uploads/rJJi1VjSn.jpg)|
|-|
## Delete
|![](https://hackmd.io/_uploads/ryGVl4sH2.jpg)|
|-|


## 自動化新增
朋友希望可以跑完實驗的同時上傳到網站上。
因此我嘗試用外部的script去新增數據，但會遇上csrf的問題，還找不出解決方法，目前是無視他，就可以成功實作。
由於整個網頁是架在實驗室內部使用，所以我打算就以無視csrf來實作這個功能，因此有特別提醒他們不要外流網址。

## 心得
以前有學過 Gin，但這次從零開始學 Django ，在開發上蠻不一樣的，也許是 MVC 和 MVT 的差別，且 Django 的開發指令很方便，覺得對開發和使用上很友善。
前端是我很不熟悉的地方，藉這次機會不只複習後端技術，同時也增加自己對前端的知識和能力。
這次嘗試使用chatgpt來輔助開發，在開發上的資訊確實很有用，但debug的能力還不是很好。而且也許是因為英文的資料比較多，英文的回答會比中文好蠻多的。
未來希望能改善csrf的問題，但其實如果不需要自動化新增，就不會遇到這個問題，只有針對這項功能有無視csrf，其他都是正常執行。

---

## REF

[MDN web docs](https://developer.mozilla.org/zh-TW/docs/Learn/Server-side/Django)
[[Django教學7]善用Django ModelForm快速開發CRUD應用程式教學](https://www.learncodewithmike.com/2020/03/django-modelform.html)
[[Django教學9]6個步驟搞懂Django上傳圖片的功能](https://www.learncodewithmike.com/2020/04/django-image-upload.html)
[Chatgpt](https://chat.openai.com/)