在本指南中，我将引导您使用 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 %}
<!DOCTYPE html>
<html lang="en">
<head>
<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">
</head>
<body class="bg-gray-100">
<div class="container mx-auto px-4 py-6">
<h1 class="text-3xl font-bold text-center">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>
</body>
</html>
登录后复制
前端图片
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：
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
- 在项目根目录中初始化 Git 存储库：
git init
git add .
git commit -m "Initial commit for feedback system"
登录后复制
- 将您的 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中文网其他相关文章！
