使用 Django、Twilio 和 Pinata 建立安全的匿名回饋系統

在本指南中，我將引導您使用 Django、用於簡訊通知的 Twilio、用於安全媒體上傳的 Pinata 以及用於響應式樣式的 TailwindCSS 建立安全匿名回饋系統。在本教程結束時，您將擁有一個功能齊全的反饋系統，用戶可以在其中提交反饋、選擇上傳媒體以及接收短信通知 - 所有這些都考慮到安全和隱私。

示範：即時連結

主要特點：

• 匿名回饋提交：使用者可以匿名提交回饋或支援請求。
• 安全媒體上傳：使用者可以透過 Pinata 安全上傳儲存在 IPFS 上的媒體檔案。
• Twilio 簡訊通知：透過 Twilio 自動向使用者發送簡訊確認。
• 響應式 UI：採用 TailwindCSS 設計，實現無縫、現代的設計。

使用的技術：

• Django：回饋系統的後端框架。
• Twilio：處理簡訊通知。
• Pinata：提供基於 IPFS 的安全媒體儲存。
• TailwindCSS：用於響應式前端樣式。

第 1 步：項目設定和依賴項

1.1。建立並設定虛擬環境
首先設定您的專案環境。確保您已安裝 Python 並設定虛擬環境：

python3 -m venv venv
source venv/bin/activate

在 Windows 上：

venv\Scripts\activate

安裝必要的軟體套件：

pip install django twilio python-decouple requests gunicorn

1.2。啟動 Django 專案
初始化一個新的 Django 專案和應用程式：

django-admin startproject config .
python manage.py startapp feedback

第2步：建構回饋提交系統

2.1。建立回饋模型
在feedback/models.py中定義一個模型來儲存回饋提交：

from django.db import models

class Feedback(models.Model):
    message = models.TextField()
    sender_email = models.EmailField()
    sender_phone = models.CharField(max_length=15)
    media_url = models.URLField(null=True, blank=True)
    created_at = models.DateTimeField(auto_now_add=True)

    def __str__(self):
        return f"Feedback from {self.sender_email}"

此模型可擷取回饋、電子郵件、電話號碼和選用媒體 URL。

2.2。建立用於處理回饋和簡訊通知的視圖
在feedback/views.py中，建立視圖來處理回饋並發送簡訊通知：

from django.shortcuts import render
from django.http import HttpResponse
from .models import Feedback
from twilio.rest import Client
from django.conf import settings
import requests

def upload_to_pinata(file):
    url = "https://api.pinata.cloud/pinning/pinFileToIPFS"
    headers = {
        'pinata_api_key': settings.PINATA_API_KEY,
        'pinata_secret_api_key': settings.PINATA_SECRET_API_KEY,
    }
    files = {'file': file}
    response = requests.post(url, files=files, headers=headers)
    return response.json().get('IpfsHash')

def submit_feedback(request):
    if request.method == 'POST':
        message = request.POST.get('message')
        sender_email = request.POST.get('sender_email')
        sender_phone = request.POST.get('sender_phone')
        file = request.FILES.get('media_file', None)

        media_url = None
        if file:
            media_url = upload_to_pinata(file)

        feedback = Feedback.objects.create(
            message=message,
            sender_email=sender_email,
            sender_phone=sender_phone,
            media_url=media_url
        )

        # Send SMS using Twilio
        client = Client(settings.TWILIO_ACCOUNT_SID, settings.TWILIO_AUTH_TOKEN)
        client.messages.create(
            body=f"Feedback received from {sender_phone}: {message}",
            from_=settings.TWILIO_PHONE_NUMBER,
            to=sender_phone
        )

        return HttpResponse("Feedback submitted successfully!")

    return render(request, 'feedback_form.html')

此視圖處理表單提交、將可選媒體上傳到 Pinata 以及使用 Twilio 發送簡訊。

2.3。建立回饋表
建立 HTML 表單來提交回饋。在模板資料夾中，建立feedback_form.html：

{% load static %}



    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Submit Feedback</title>
    <link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet">


    <div class="container mx-auto px-4 py-6">
        <h1 id="Submit-Feedback">Submit Feedback</h1>
        <form method="POST" action="" enctype="multipart/form-data" class="bg-white p-6 rounded shadow-md">
            {% csrf_token %}
            <div class="mb-4">
                <label for="message" class="block text-lg font-semibold">Your Feedback</label>
                <textarea name="message" id="message" class="w-full p-2 border rounded" required></textarea>
            </div>
            <div class="mb-4">
                <label for="sender_email" class="block text-lg font-semibold">Your Email</label>
                <input type="email" name="sender_email" id="sender_email" class="w-full p-2 border rounded" required>
            </div>
            <div class="mb-4">
                <label for="sender_phone" class="block text-lg font-semibold">Your Phone Number</label>
                <input type="tel" name="sender_phone" id="sender_phone" class="w-full p-2 border rounded" required>
            </div>
            <div class="mb-4">
                <label for="media_file" class="block text-lg font-semibold">Upload Media (Optional)</label>
                <input type="file" name="media_file" id="media_file" class="w-full p-2 border rounded">
            </div>
            <div class="text-center">
                <button type="submit" class="bg-blue-500 text-white px-4 py-2 rounded">Submit</button>
            </div>
        </form>
    </div>

前端圖片

Pinata 儀表板的圖像，顯示已上傳的檔案

步驟 3：設定 Twilio 和 Pinata

3.1。設定環境變數
在專案的根目錄中建立一個 .env 檔案來儲存 Twilio 和 Pinata API 金鑰等敏感資訊：

SECRET_KEY=your-django-secret-key
DEBUG=True

TWILIO_ACCOUNT_SID=your_twilio_account_sid
TWILIO_AUTH_TOKEN=your_twilio_auth_token
TWILIO_PHONE_NUMBER=your_twilio_phone_number

PINATA_API_KEY=your_pinata_api_key
PINATA_SECRET_API_KEY=your_pinata_secret_api_key

確保將 .env 新增到您的 .gitignore 檔案中，這樣它就不會被推送到 GitHub：

.env

3.2。更新 settings.py 以使用環境變數
使用 python-de Couple 從 .env 檔案安全地載入環境變數：

from decouple import config

SECRET_KEY = config('SECRET_KEY')
DEBUG = config('DEBUG', default=False, cast=bool)

TWILIO_ACCOUNT_SID = config('TWILIO_ACCOUNT_SID')
TWILIO_AUTH_TOKEN = config('TWILIO_AUTH_TOKEN')
TWILIO_PHONE_NUMBER = config('TWILIO_PHONE_NUMBER')

PINATA_API_KEY = config('PINATA_API_KEY')
PINATA_SECRET_API_KEY = config('PINATA_SECRET_API_KEY')

第四步：推送到GitHub

4.1。初始化Git並推送到GitHub

1. 在專案根目錄中初始化 Git 儲存庫：

git init
git add .
git commit -m "Initial commit for feedback system"

1. 將您的 GitHub 儲存庫新增為遠端倉庫並推送您的專案：

<p>git remote add origin https://github.com/yourusername/feedback-system.git<br>
git push -u origin main</p>

結論

在本教程中，您使用 Django、用於簡訊通知的 Twilio 和用於媒體上傳的 Pinata 建立了一個安全的匿名回饋系統。您還了解如何將專案推送到 GitHub 並使用環境變數保護敏感資訊。該系統確保隱私，同時使用戶能夠提交回饋和接收簡訊通知。

您可以透過增加更多功能或增強安全性來進一步擴展系統。如果您發現本指南有幫助，請在評論中分享您的回饋或問題！

專案的儲存庫可以在這裡找到：Repo

以上是使用 Django、Twilio 和 Pinata 建立安全的匿名回饋系統的詳細內容。更多資訊請關注PHP中文網其他相關文章！