网站首页 / 信息中心 / 档案知识 /

用Django3.2Vue3快速搭建本地运行可落地轻量级个人与单位日常基础智能档案归档全文模糊检索指南

发布时间: 2026年06月15日 16:05:02 来源: 安答联动 浏览量: 0

前置准备：30分钟搞定开发环境

步骤1：安装Python3.9+（Django3.2最低要求）

直接复制对应系统的链接下载：

  • Windows：https://www.python.org/ftp/python/3.9.13/python-3.9.13-amd64.exe
  • macOS（Intel/M1）：https://www.python.org/ftp/python/3.9.13/python-3.9.13-macos11.pkg
  • Linux（Ubuntu/Debian）：运行sudo apt update && sudo apt install python3.9 python3.9-venv python3-pip

必须勾选Windows/macOS安装界面的「Add Python 3.9 to PATH」！安装完成后在终端运行python3 --version，显示「Python 3.9.13」则成功。

步骤2：安装Node.js16+（Vue3最低支持LTS）

直接复制链接下载：https://nodejs.org/dist/v16.20.2/node-v16.20.2-x64.msi（Windows）/ https://nodejs.org/dist/v16.20.2/node-v16.20.2.pkg（macOS）

默认安装即可，完成后运行node -v && npm -v，显示「v16.20.2」和「8.19.4」左右则成功。

步骤3：创建并激活虚拟环境（避免污染全局Python）

在桌面新建文件夹smart-archive，打开终端进入该文件夹：

  • Windows：cd Desktop\smart-archive
  • macOS/Linux：cd ~/Desktop/smart-archive

用Django3.2Vue3快速搭建本地运行可落地轻量级个人与单位日常基础智能档案归档全文模糊检索指南

创建并激活虚拟环境：

  • Windows： 
    python3 -m venv venv
.\venv\Scripts\activate
  • macOS/Linux： 
    python3 -m venv venv
source venv/bin/activate

终端前缀出现(venv)则激活成功。

后端搭建：60分钟实现核心接口

步骤1：安装Django3.2及依赖

复制安装命令：pip install django==3.2.23 djangorestframework==3.14.0 django-cors-headers==4.2.0 whoosh==2.7.4 django-haystack==3.2.1

步骤2：创建Django项目与应用

复制以下命令依次执行： 

django-admin startproject backend .
python3 manage.py startapp archive

步骤3：配置backend/settings.py

直接替换整个INSTALLED_APPS、MIDDLEWARE、DATABASES、TEMPLATES下方的STATIC_ROOT、新增HAYSTACK_CONNECTIONS，其他内容保留原样： 

INSTALLED_APPS = [
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
'rest_framework',
'corsheaders',
'haystack',
'archive',
]
MIDDLEWARE = [
'django.middleware.security.SecurityMiddleware',
'django.contrib.sessions.middleware.SessionMiddleware',
'corsheaders.middleware.CorsMiddleware',   必须放在CommonMiddleware之前
'django.middleware.common.CommonMiddleware',
'django.middleware.csrf.CsrfViewMiddleware',
'django.contrib.auth.middleware.AuthenticationMiddleware',
'django.contrib.messages.middleware.MessageMiddleware',
'django.middleware.clickjacking.XFrameOptionsMiddleware',
]
允许跨域（本地测试用）
CORS_ALLOW_ALL_ORIGINS = True
DATABASES = {
'default': {
'ENGINE': 'django.db.backends.sqlite3',
'NAME': BASE_DIR / 'db.sqlite3',
}
}
TEMPLATES = [
{
'BACKEND': 'django.template.backends.django.DjangoTemplates',
'DIRS': [],
'APP_DIRS': True,
'OPTIONS': {
'context_processors': [
'django.template.context_processors.debug',
'django.template.context_processors.request',
'django.contrib.auth.context_processors.auth',
'django.contrib.messages.context_processors.messages',
],
},
},
]
STATIC_URL = 'static/'
STATIC_ROOT = BASE_DIR / 'static'
全文检索配置
HAYSTACK_CONNECTIONS = {
'default': {
'ENGINE': 'haystack.backends.whoosh_backend.WhooshEngine',
'PATH': BASE_DIR / 'whoosh_index',
},
}
HAYSTACK_SIGNAL_PROCESSOR = 'haystack.signals.RealtimeSignalProcessor'   自动更新索引

步骤4：创建archive/models.py档案模型

直接替换整个文件内容： 

from django.db import models
class Archive(models.Model):
CATEGORY_CHOICES = [
('personal', '个人档案'),
('company', '单位档案'),
]
category = models.CharField(max_length=10, choices=CATEGORY_CHOICES, verbose_name='档案类别')
title = models.CharField(max_length=100, verbose_name='档案标题')
number = models.CharField(max_length=50, unique=True, verbose_name='档案编号')
content = models.TextField(verbose_name='档案内容')
create_time = models.DateTimeField(auto_now_add=True, verbose_name='创建时间')
update_time = models.DateTimeField(auto_now=True, verbose_name='更新时间')
class Meta:
verbose_name = '智能档案'
verbose_name_plural = verbose_name
ordering = ['-create_time']
def __str__(self):
return self.title

步骤5：创建全文检索索引archive/search_indexes.py

新建该文件并粘贴内容： 

from haystack import indexes
from .models import Archive
class ArchiveIndex(indexes.SearchIndex, indexes.Indexable):
text = indexes.CharField(document=True, use_template=True)
title = indexes.CharField(model_attr='title')
number = indexes.CharField(model_attr='number')
category = indexes.CharField(model_attr='category')
def get_model(self):
return Archive
def index_queryset(self, using=None):
return self.get_model().objects.all()

接着创建archive/templates/search/indexes/archive/archive_text.txt（需手动创建对应文件夹层级），粘贴内容： 

{{ object.title }}
{{ object.number }}
{{ object.content }}
{{ object.get_category_display }}

步骤6：创建序列化器、视图、路由

archive/serializers.py（新建）： 

from rest_framework import serializers
from .models import Archive
class ArchiveSerializer(serializers.ModelSerializer):
get_category_display = serializers.CharField(read_only=True)
class Meta:
model = Archive
fields = '__all__'

archive/views.py： 

from rest_framework import viewsets
from rest_framework.decorators import action
from rest_framework.response import Response
from haystack.query import SearchQuerySet
from .models import Archive
from .serializers import ArchiveSerializer
class ArchiveViewSet(viewsets.ModelViewSet):
queryset = Archive.objects.all()
serializer_class = ArchiveSerializer
@action(detail=False, methods=['get'])
def search(self, request):
keyword = request.query_params.get('keyword', '')
if not keyword:
return Response([])
sqs = SearchQuerySet().filter(text__contains=keyword)
archive_ids = [result.pk for result in sqs]
archives = Archive.objects.filter(pk__in=archive_ids)
serializer = self.get_serializer(archives, many=True)
return Response(serializer.data)

backend/urls.py： 

from django.contrib import admin
from django.urls import path, include
from rest_framework.routers import DefaultRouter
from archive.views import ArchiveViewSet
router = DefaultRouter()
router.register(r'archives', ArchiveViewSet)
urlpatterns = [
path('admin/', admin.site.urls),
path('api/', include(router.urls)),
path('api/search/', include('haystack.urls')),   备用原生haystack搜索
]

步骤7：初始化数据库、创建超级管理员、生成索引、启动后端

复制以下命令依次执行： 

python3 manage.py makemigrations
python3 manage.py migrate
python3 manage.py createsuperuser   按提示输入用户名、邮箱、密码
python3 manage.py rebuild_index   输入yes生成索引
python3 manage.py runserver

后端启动成功后，访问http://127.0.0.1:8000/admin/ 登录可手动添加测试档案。

前端搭建：40分钟实现完整交互

步骤1：创建Vue3项目

新开一个终端（不要关闭后端终端），进入smart-archive文件夹，复制命令：npx create-vue@latest frontend -- --typescript，按提示选择Yes或No（路由、Pinia、ESLint、Prettier选Yes，其他No）。

步骤2：安装前端依赖

复制以下命令依次执行： 

cd frontend
npm install
npm install axios element-plus @element-plus/icons-vue

步骤3：配置前端

frontend/src/main.ts： 

import { createApp } from 'vue'
import { createPinia } from 'pinia'
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
import  as ElementPlusIconsVue from '@element-plus/icons-vue'
import App from './App.vue'
import router from './router'
const app = createApp(App)
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
app.component(key, component)
}
app.use(createPinia())
app.use(router)
app.use(ElementPlus)
app.mount('app')

frontend/src/utils/request.ts（新建）： 

import axios from 'axios'
const request = axios.create({
baseURL: 'http://127.0.0.1:8000/api',
timeout: 5000
})
export default request

frontend/src/views/ArchiveView.vue（替换原有HomeView.vue内容）：