用 django 构建翻译网站——软件工程课程设计

╰半橙微兮° 2023-07-03 08:07 2阅读 0赞

## 一、背景 ##

#### 1.1课程题目 ####

构架一个名为Bonnie的翻译网站，要求网站具备翻译网站的基本功能，即前台用户注册登录功能，智能翻译功能和后台的用户管理，系统管理。同时本网站具备用户与翻译者直接沟通无中介干涉的特点。

#### 1.2编写背景 ####

在现在高速发展的社会中，自主学习变为一种学习方式，就其中一个方面来讲，英语学习中会遇到很多困难，如专业性文章不会翻译等问题。Bonnie翻译网站拥有英汉实时翻译的查询功能，还可以为广大用户提供一个公益平台，一方作为基本用户，可以提交文章请求他人的帮助，一方作为翻译者可以选择自己感兴趣的文章进行翻译，帮助基本用户，他们在这个公共平台实现各自需求。清晰简明的界面，简易的操作可以给用户带来更多舒服的体验。

#### 1.3开发环境 ####

开发工具为 python3.6 并基于 django 这一 MVT 框架、以及 bootstrap 这一前端框架进行网站后台、前端的编写、设计。基本数据的存储则利用MySQL数据库进行存储。本机调试阶段利用 django 内置服务器，发布阶段则利用 apache 服务器。

## 二、需求分析 ##

#### 2.1 编写目的 ####

对软件需求的完全理解对软件开发工作是至关重要的，需求说明有益于提高软件开发过程中的能见度。因为有些英语专业人士或学习爱好者希望提升能力，而有些英语程度不好的人没有能力翻译长篇或专业性文章，本网站针对这些人的需求应运而生。

#### 2.2 软件项目概述 ####

网上翻译是一种高质量、快捷、方便的翻译方式，采用计算机技术对语言进行合理化、信息化管理的同时，实现人们只需要在一个网站就可以实现所有翻译的需求，再也没有常备一本大辞典的不便了。实现了知识的信息化和电子化。

*  **描述(1)**：编写软件完成智能翻译部分：通过首页可以看到智能翻译入口，在位置1内输入想要翻译的英文或汉语，点击翻译按钮，在位置2可以看到对应的翻译内容。
 *  **描述(2)**：用户不仅可以作为游客体验简单的翻译，也可以注册成为基本用户以及翻译者：系统通过用户请求进行对应的响应，开始对用户提交的个人信息进行验证与备份，并完成对应的动作来回应用户。若存在账号密码或者验证问题，系统反馈自己无法进入该应用，需重新核实过才能正确登录使用。
 *  **描述(3)**：基本用户可以在网站上提交自己想要得到翻译的内容（英译汉，汉译英），接收其他翻译者发送来的翻译结果，并根据其内容进行满意程度打分：注册用户可以通过系统完成除了智能翻译之外的人工互动翻译，注册用户可以通过服务器提交待翻译文章信息，翻译者可以根据服务器反馈的信息进行选择和翻译。注册用户可以根据反馈的翻译结果对其进行分值界定，从而给出合适的分数。
 *  **描述(4)**：管理员可以通过系统对已注册的用户信息进行管理，对用户信息进行管理。

## 三、系统建模 ##

#### 3.1 系统Use Case 图 ####

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz_size_16_color_FFFFFF_t_70]

图1：Use Case图

##### 3.1.1 用户注册Use Case说明 #####

*  步骤1：打开注册页面，填好相关信息。
 *  步骤2：相关信息填写完毕后向系统提交申请
 *  步骤3：系统确认申请信息完毕，用户注册完成，本Use Case结束。

##### 3.1.2 翻译查询Use Case说明 #####

*  步骤1：游客身份的用户打开系统网站主页，即可通过搜索对话框输入需要翻译的内容进行简单的智能查询。
 *  步骤2：注册过的用户打开系统网站主页，点击登录即进入个人账户信息内部，通过提交文章对话框输入输入需要翻译的内容进行智能翻译，或者选择进行人工翻译，提交完毕后，翻译者接收文章并对其进行翻译，用户可以对其翻译结果进行打分评定，翻译者接收用户打分之后本Use Case结束。

##### 3.1.3系统管理Use Case说明 #####

系统管理是系统管理员的管理范围，即对所有用户进行管理，包括翻译者信息管理与基本用户信息管理，对个人信息进行必要的增删查改，管理后台应用。

#### 3.2 系统类图 ####

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz_size_16_color_FFFFFF_t_70 1]

图2：系统的类图

#### 3.3 时序图 ####

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz_size_16_color_FFFFFF_t_70 2]

图4：时序图

#### 3.4 模型类的编写 ####

根据以上对项目需求、用例的分析，我们有了初步的头绪——建立三个 app 分别处理对应的业务逻辑

*  tr\_passage()——处理和文章相关的操作与请求、与user的关联等
 *  tr\_user()——处理用户的相关操作，例如登陆注册等
 *  tr\_user\_center()——处理用户中心，该应用是为了方便代码的编写，故不需要模型类

此处对于本项目业务逻辑的划分并不一定是最优的，之所以这样划分是为了编程方便并且不容易出错。  
整体项目结构如下：  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz_size_16_color_FFFFFF_t_70 3]  
**首先是tr\_passage的models：**

from django.db import models
    from tr_user.models import Ordinary_User,Translater
    # Create your models here.
    class PassageManage(models.Manager):
    
        def create(self, ordinary_user, translation, title):
            p = Passage()
            p.ordinary_user = ordinary_user
            p.text = translation
            p.passage_title = title
            p.result = '暂无'
            p.save()
            ordinary_user.save()
            return p
    
    class ResultManage(models.Manager):
    
        def create(self, passage, translater, text):
            r = Result()
            r.passage = passage
            r.translater = translater
            r.result = text
            r.translation = passage.text
            r.save()
            return r
    
        def choose(self, result):
            result.if_was_chosen = True
            result.save()
    
    class Passage(models.Model):
        # 文章类
        ordinary_user = models.ForeignKey(Ordinary_User)
        translater = models.IntegerField(default=0)
        text = models.TextField(null=False, max_length=4000)
        passage_title = models.CharField(default='none', max_length=50)
        be_translated = models.BooleanField(default=False)
        passages = PassageManage()
    
        def __str__(self):
            return self.passage_title
    
        class Meta:
            db_table = 'passages'
    
    class Result(models.Model):
        # 翻译结果类
        passage = models.ForeignKey('Passage')
        translater = models.ForeignKey(Translater)
        translation = models.TextField(max_length=4000, default=' ')
        result = models.TextField(null=False, max_length=4000)
        # 是否被选用为最合适的翻译结果
        if_was_chosen = models.BooleanField(default=False)
        results = ResultManage()
    
        def __str__(self):
            return str(self.id)
    
        class Meta:
            db_table = 'passageResults'

**接下来是tr\_user的models：**

from django.db import models
    
    class Ordinary_UserManager(models.Manager):
        # 重写管理器的方法
        def get_queryset(self):
            # 修改返回的原始查询集
            return super(Ordinary_UserManager, self).get_queryset().filter(choose_translater = True)
    
        def create(self, accountnum, password, mail='123@qq.com'):
            # 写创建对象的方法 创建对象时可以调用该类方法
            ord = Ordinary_User()
            ord.account_number = accountnum
            ord.account_passWord = password
            ord.account_mail = mail
            ord.save()
            return ord
    
        def if_has(self, uname):
            try:
                self.get(account_number=uname)
            except:
                return False
            return True
    
    class TranslaterManage(models.Manager):
    
        def get_queryset(self):
            return super(TranslaterManage, self).get_queryset()
    
        def create(self, account, password, mail='123@qq.com'):
            # 自定义管理器中创建类的方法
            tra = Translater()
            tra.account_number = account
            tra.account_passWord = password
            tra.account_mail = mail
            tra.credit_level = 4
            tra.save()
            return tra
    
        def if_has(self, uname):
            try:
                self.get(account_number=uname)
            except:
                return False
    
            return True
    
    class Ordinary_User(models.Model):
        # 普通用户类
        account_number = models.CharField(max_length=20) # 账号
        account_passWord = models.CharField(max_length=40)# 密码
        account_mail = models.CharField(max_length=30, default='123@qq.com')#邮箱
        choose_translater = models.BooleanField(default=True) # 是否选用人工翻译
        score = models.IntegerField(default=10)  # 对结果的评分，默认满分
        users = Ordinary_UserManager()
    
        def __str__(self):
            return self.account_number
    
        class Meta:
            # 元选项 修改表的名称
            db_table = 'ordinaryUser'
            ordering = ['id'] # 指定查询的排序规则
    
    class Translater(models.Model):
        # 翻译者类
        account_number = models.CharField(max_length=20) # 账号
        account_passWord = models.CharField(max_length=40) # 密码
        account_mail = models.CharField(max_length=30)  # 邮箱
        credit_level = models.IntegerField(null=True, default=1) # 信用等级
        score_sum = models.IntegerField(null=True, default=0) # 翻译者所得到的累计评价
        translaters = TranslaterManage() # 创建管理器对象
    
        def __str__(self):
            return self.account_number
    
        class Meta:
            db_table = 'translater'
            ordering = ['id']

## 四、系统实现 ##

#### 4.1系统界面 ####

##### 4.1.1注册：打开网站可以看到注册界面，如下图所示： #####

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz_size_16_color_FFFFFF_t_70 4]  
图8：注册页面  
说明：在页面对应位置填写个人信息：用户名、密码、确认密码、验证码以及用户身份选择。其中，用户名长度至少6位，密码长度至少6位，确认密码需要和输入的密码保持一致，验证码需要按照所给提示进行输入，否则，将无法注册成功。验证成功系统将自动跳转至登录界面。

##### 4.1.2登录 #####

注册成功后，即可进行登录，界面如下图所示：  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz_size_16_color_FFFFFF_t_70 5]  
图9：登录界面  
说明：在对应位置填写已经注册过的用户信息，包括身份类别，点击“登录”按钮即可进入，如果用户名、密码、以及身份类别选择出现错误，将无法成功登录。

##### 4.1.2登录 #####

注册成功后，即可进行登录，界面如下图所示：  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz_size_16_color_FFFFFF_t_70 6]  
图9：登录界面  
说明：在对应位置填写已经注册过的用户信息，包括身份类别，点击“登录”按钮即可进入，如果用户名、密码、以及身份类别选择出现错误，将无法成功登录。

##### 4.1.3智能翻译 #####

登录网站之后进入主界面，即可进行智能翻译，智能翻译的主界面如下图：  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz_size_16_color_FFFFFF_t_70 7]  
图10：智能翻译界面  
说明：通过在左边空白区域输入想要翻译的内容，点击“翻译”按钮，即可进行对应的翻译，随后在右边空白区域显示翻译结果。

##### 4.1.4用户中心界面（基本用户） #####

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz_size_16_color_FFFFFF_t_70 8]  
图11普通用户界面  
说明：作为普通用户登录之后，有“你的基本资料”、“文章历史结果”、“提交文章”、“about us”等功能块，点击按钮即可进入对应功能，进行使用。

##### 4.1.4普通用户提交文章 #####

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz_size_16_color_FFFFFF_t_70 9]  
图12提交文章界面  
说明：普通用户点击“提交文章按钮”，即可进入文本输入格式，在如图所示空格内依次输入文章标题和文章内容，最后点击“提交文章”按钮，就可进行文章翻译。

##### 4.1.5普通用户接受翻译结果 #####

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz_size_16_color_FFFFFF_t_70 10]  
图13普通用户接受翻译结果  
说明：打开提交过的文章，点击即可看到从翻译者发来的翻译结果

##### 4.1.6翻译者主界面 #####

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz_size_16_color_FFFFFF_t_70 11]  
图14翻译者界面  
说明：当翻译者登录成功之后，即可进行“你的基本资料”、“文章历史结果”、“浏览文章，帮助他人”、“about us”等操作。

#### 4.10翻译者登录浏览需要翻译的文章。 ####

##### 4.1.7翻译者选择文章界面 #####

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz_size_16_color_FFFFFF_t_70 12]  
图15翻译者选择文章  
说明：点击“浏览文章，帮助他人”，即可浏览需要被翻译的文章，可点击对应文章标题，根据个人能力进行翻译。

##### 4.1.8翻译者提交文章结果 #####

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz_size_16_color_FFFFFF_t_70 13]  
图16翻译者提交结果  
说明：通过浏览所有需要被翻译的文章，选择一个点击打开，可以看到两个文本编辑框，左边文本框可以查看需要被翻译的文本，在右边文本框可以输入自己的翻译结果，输入完成后点击“提交文章”，即可完成翻译动作。

#### 4.2源代码（后台及前端） ####

说明：基于django框架设计**三个app：tr\_user、tr\_passage、tr\_user\_center来处理对应的业务逻辑。后台代码包含模型类的设计、视图的编写、基本设置的展示以及作为模板的前端页面**（仅包含供继承的基模板以及继承基模板的登陆、用户中心、提交文章等页面）。

PS：前面已给出了模型类的设计。

视图代码如下：

from django.db import models
    from django.shortcuts import render,redirect
    from tr_user.models import Ordinary_User,Translater
    from django.http import HttpResponse
    from .models import Result,Passage
    def sumbit_passage(request):
        user_kind = request.session.get('user_kind', default=' ')
        if user_kind == 'ordinary_user':
            o_user = Ordinary_User.users.get(id=request.session.get('uid'))
        else:
            return HttpResponse("error")
        context = { 
            'object':o_user, 
        }
        return render(request, 'passage.html', context)
    def passage_handel(request):
        title = request.POST['passage_title']
        text = request.POST['translation']
        o_user = Ordinary_User.users.get(id=request.session.get('uid'))
        passage = Passage.passages.create(o_user, text, title)
        return redirect('/user_center/show')
    def choose_passage(request):
        passages = Passage.passages.all()
        passages_list = []
        passages_id = []
        i = { }
        for passage in passages:
            passages_list.append(passage)
            passages_id.append(passage.id)
        context = { 
            'passages_list':passages_list,
            'id_list':passages_id,
        }
        return render(request, 'choose_passage.html', context)
    def show_passage(request):
        passage_id = request.GET['id']
        passage = Passage.passages.get(id=passage_id)
        translation = passage.text
        context = { 
            'passage_id':passage_id,
            'translation':translation,
        }
        request.session['passage_id'] = passage_id
        return render(request, 'show_passage.html', context)
    def translater_submit_passage(request):
        passage_id = request.session.get('passage_id')
        translation = request.POST['result']
        passage = Passage.passages.get(id=passage_id)
        del request.session['passage_id']
        user_id = request.session.get('uid')
        translater = Translater.translaters.get(id=user_id)
        result = Result.results.create(passage, translater, translation)
        return redirect('/user_center/show')
    def show_history(request):
        user_kind = request.session.get('user_kind')
        if user_kind == 'ordinary_user':
            passage_id = request.GET['id']
            passage = Passage.passages.get(id=passage_id)
            result_list = passage.result_set.all()
            context = { 
                'passage':passage,
                'result':result_list,
            }
            return render(request, 'show_history_o.html', context)
        elif user_kind == 'translater':
            result_id = request.GET['id']
            result = Result.results.get(id=result_id)
            passage_title = result.passage.passage_title
            translation = result.translation
            text = result.result
            context = { 
                'passage_title':passage_title,
                'translation':translation,
                'text':text,
            }
            return render(request, 'show_history_t.html', context)
    def handel_goal(request):
        result_id = request.POST['id']
        goal = request.POST['goal']
        result = Result.results.get(id=result_id)
        translater = result.translater
        translater.score_sum += int(goal)
        translater.save()
        return redirect('/passage/show_history/')
    def handel_result(request):
        result_id = request.POST['id']
        result = Result.results.get(id=result_id)
        result.if_was_chosen = True
        result.save()
        translater = result.translater
        passage = result.passage
        translater.score_sum += 100
        passage.translater = translater.id
        passage.be_translated = True
        translater.save()
        passage.save()
        return redirect('/user_center/show/')

from django.shortcuts import render, redirect
    from django.template import loader, RequestContext
    from django.db.models import Max
    from django.http import *
    from .models import *
    def register(request):
        buf = verifycode(request)
        image = buf.getvalue()
        context = { 
            'image':image,
        }
        return render(request, 'register.html')
    def login(request):
        buf = verifycode(request)
        image = buf.getvalue()
        context = { 
            'image':image,
        }
        return render(request, 'login.html', context)
    def login_handel(request):
        from hashlib import sha1
        post = request.POST
        uname = post.get('uname')
        upwd = post.get('upwd')
        user_kind= post.get('user_kind')
        code = post.get('verifycode')
        verifycode = request.session['verifycode']
        s1 = sha1()
        s1.update(upwd.encode('utf-8'))
        pwd = s1.hexdigest()
        if user_kind == 'ordinary_user':
            user = Ordinary_User.users.filter(account_number=uname)
            if len(user) == 1:
                try:
                    temp = Ordinary_User.users.get(account_number=uname, account_passWord=pwd)
                    print(temp.account_number)
                    id = temp.id
                except:
                    return HttpResponse('密码错误')
            else:
                return redirect('/user/login/')
        elif user_kind == 'translater':
            user = Translater.translaters.filter(account_number=uname)
            if len(user) == 1:
                try:
                    temp = Translater.translaters.get(account_number=uname, account_passWord=pwd)
                    print(temp.account_number)
                    id = temp.id
                except:
                    return HttpResponse('密码错误')
            else:
                return redirect('/user/login/')
        else:
            return HttpResponse('请输入用户种类')
        request.session['uid'] = id
        request.session['user_kind'] = user_kind
        return redirect('/user/index_for_user/')
    def register_handel(request):
        from hashlib import sha1
        post = request.POST
        uname = post.get('uname')
        upwd = post.get('upwd')
        cpwd = post.get('cpwd')
        mail = post.get('email', default='123@qq.com')
        user_kind = post.get('user_kind')
        if upwd != cpwd:
            return redirect('/user/register/')
        s1 = sha1()
        s1.update(upwd.encode('utf-8'))
        pwd = s1.hexdigest()
        if user_kind == 'ordinary_user':
            if Ordinary_User.users.if_has(uname):
                return HttpResponse('repeated')
            o_user = Ordinary_User.users.create(uname, pwd, mail)
        elif user_kind == 'translater':
            if Translater.translaters.if_has(uname):
                return HttpResponse('repeated')
            t_user = Translater.translaters.create(uname, pwd, mail)
        return redirect('/user/login/')
    def del_session(request):
        request.session.flush()
        return redirect('/user/index/')
    def index(request):
        if request.session.get('uid', default='') == '':
            context = { 'fanyi_content':'请输入翻译的文本'}
            if request.method == 'POST':
                post = request.POST
                fanyi_content = post.get('fanyi_content')
                print('fanyi_content:{x}'.format(x=fanyi_content))
                result = baiduFanyi(fanyi_content)
                context['fanyi_content'] = fanyi_content
                context['result'] = result
            return render(request, 'index.html', context)
        else:
            return redirect('/user/index_for_user/')
    def index_for_user(request):
        uid = request.session.get('uid', default=None)
        user = Ordinary_User.users.get(id=uid)
        context = { 
            'uname':user.account_number,
            'fanyi_content': '请输入翻译的文本',
        }
        if request.method == 'POST':
            post = request.POST
            fanyi_content = post.get('fanyi_content')
            result = baiduFanyi(fanyi_content)
            context = { 
                'uname': user.account_number,
                'fanyi_content': fanyi_content,
                'result': result,
            }
        return render(request, 'index_for_user.html',context)
    def baiduFanyi(request):
        import http
        import hashlib
        import urllib.request
        import random
        import json
        q = request
        print('q:{x}'.format(x=q))
        if len(q.split()) == 0 or q == '请输入翻译的文本':
            return '不能为空'
        appid = '写你自己申请的翻译api的id'
        secretKey = '写你自己申请的翻译api的密码'
        myurl = '/api/trans/vip/translate'
        fromLang = 'en'
        toLang = 'zh'
        salt = random.randint(32768, 65536)
        sign = appid + q + str(salt) + secretKey
        sign = sign.encode('UTF-8')
        m1 = hashlib.md5()
        m1.update(sign)
        sign = m1.hexdigest()
        myurl = myurl + '?appid=' + appid + '&q=' + urllib.parse.quote(q) + '&from=' + fromLang + '&to=' + toLang + '&salt=' + str(salt) + '&sign=' + sign
        httpClient = http.client.HTTPConnection('api.fanyi.baidu.com')
        httpClient.request('GET', myurl)
        response = httpClient.getresponse()
        html = response.read().decode('UTF-8')
        target2 = json.loads(html)
        print('target2:{x}'.format(x=target2))
        src = target2['trans_result'][0]['dst']
        outStr = src
        return outStr
    def verifycode(request):
        from PIL import Image, ImageDraw, ImageFont
        import random
        bgcolor = (random.randrange(20, 100), random.randrange(20, 100), 255)
        width = 100
        height = 25
        im = Image.new('RGB', (width, height), bgcolor)
        draw = ImageDraw.Draw(im)
        for i in range(0, 100):
            xy = (random.randrange(0, width), random.randrange(0, height))
            fill = (random.randrange(0, 255), 255, random.randrange(0, 255))
            draw.point(xy, fill=fill)
        str1 = 'ABCD123EFGHIJK456LMNOPQRS789TUVWXYZ0'
        rand_str = ''
        for i in range(0, 4):
            rand_str += str1[random.randrange(0, len(str1))]
        font = ImageFont.truetype("Dengb.ttf", 16)
        fontcolor = (255, random.randrange(0, 255), random.randrange(0, 255))
        draw.text((5, 2), rand_str[0], font=font, fill=fontcolor)
        draw.text((25, 2), rand_str[1], font=font, fill=fontcolor)
        draw.text((50, 2), rand_str[2], font=font, fill=fontcolor)
        draw.text((75, 2), rand_str[3], font=font, fill=fontcolor)
        del draw
        request.session['verifycode'] = rand_str
        from io import StringIO,BytesIO
        buf = BytesIO()
        im.save(buf, 'png')
        return HttpResponse(buf.getvalue(), 'image/png')

from django.shortcuts import render
    from tr_user.models import Translater,Ordinary_User
    from tr_passage.models import Passage,Result
    def user_center(request):
        uid = request.session.get('uid', default=None)
        user_kind = request.session.get('user_kind', default=0)
        history_list = []
        if user_kind == 'ordinary_user':
            user = Ordinary_User.users.get(id=uid)
            translate_history = Passage.passages.filter(ordinary_user__id=uid)
            for objects in translate_history:
                history_list.append(objects.passage_title)
            context = { 
                'uname': user.account_number,
                'user_kind': user_kind,
                'result': user,
                'mail':user.account_mail,
                'history': translate_history,
            }
            return render(request, '02.html', context)
        elif user_kind == 'translater':
            user = Translater.translaters.get(id=uid)
            result_list = Result.results.filter(translater__id=uid)
            translate_history = []
            for result in result_list:
                translate_history.append(result)
            context = { 
                'uname':user.account_number,
                'user_kind':user_kind,
                'result':user,
                'history':translate_history,
                'credit_level':user.credit_level,
                'goal':user.score_sum,
            }
            return render(request, '01.html', context)
    def user_info(request):
        return render(request, 'main.html')
    def change_pwd(request):
        return render(request, 'changePwd.html')
    def user_main(request):
        return render(request, 'main.html')

下面是对访问地址的设定。

from django.conf.urls import url,include
    from django.contrib import admin
    from tr_user.views import index
    urlpatterns = [
        url(r'^admin/', admin.site.urls),
        url(r'^$', index),
        url(r'^user/', include('tr_user.urls',namespace='user')),
        url(r'^passage/', include('tr_passage.urls',namespace='passage')),
        url(r'^user_center/', include('tr_user_center.urls', namespace='user_center')),
    ]
    
    from . import views
    from django.conf.urls import url,include
    app_name = 'tr_passage'
    urlpatterns = [
        url(r'^submit_passage/$', views.sumbit_passage, name='submit_passage'),
        url(r'^passage_handel/$', views.passage_handel, name='passage_handel'),
        url(r'^choose_passage/$',views.choose_passage, name='choose_passage'),
        url(r'^translater_submit_passage/$',views.translater_submit_passage, name='translater_submit_passage'),
        url(r'^show_passage/$', views.show_passage, name='show_passage'),
        url(r'^show_history/$', views.show_history, name='show_history'),
        url(r'^handel_goal/$', views.handel_goal, name='handel_goal'),
        url(r'^handel_result/$', views.handel_result, name='handel_result'),
    ]
    
    
    from . import views
    from django.conf.urls import url,include
    app_name = 'tr_user'
    urlpatterns = [
        url(r'^$', views.index, name='index'),
        url(r'^index/$',views.index,name='index'),
        url(r'^index_for_user/$', views.index_for_user, name='index_for_user'),
        url(r'^login/$', views.login, name='login'),
        url(r'^register/$', views.register, name='register'),
        url(r'^longin_handel/$', views.login_handel, name='longin_handel'),
        url(r'^register_handel/$', views.register_handel, name='register_handel'),
        url(r'^del_session/$', views.del_session, name='del_session'),
        url(r'^verifycode$', views.verifycode, name='verifycode'),
        url(r'^baidufanyi$', views.baiduFanyi, name='baidufanyi'),
    ]
    
    
    from . import views
    from django.conf.urls import url,include
    app_name = 'tr_user_center'
    urlpatterns = [
        url(r'^show/$', views.user_center, name='show'),
        url(r'^user_info/$',views.user_info, name='user_info' ),
        url(r'^change_pwd/$', views.change_pwd, name='change_pwd'),
        url(r'^user_main/$', views.user_center, name='user_main'),
    ]

至于前端代码这里就只给一个基类的模板。

{% load staticfiles %}
    <html lang="en">
    <head>
        <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width user-scalable=no,initial-scal=1.0, maximum-scale=1.0,minimum-scale=1.0">
        <title>Bonnie{
       { title }}</title>
        <script type="text/javascript" src="{% static 'bootstrap/js/jquery.min.js' %}"></script>
        <script type="text/javascript" src="{% static 'bootstrap/js/bootstrap.min.js' %}"></script>
        <link rel="stylesheet" type="text/css" href="{% static 'bootstrap/css/bootstrap.min.css' %}">
        <link rel="stylesheet" type="text/css" href="{% static 'bootstrap/css/style.css' %}">
        <meta name="viewport" content="width=device-width user-scalable=no, initial-scal=1.0,maximum-scale=1.0,minimum-scale=1.0">
        {% block head %}
        {% endblock head %}
    </head>
    {% block body %}
    <body background="/static/images/02.jpg">
    <nav class="navbar navbar-inverse navbar-static-top">
            <div class="container">
               <div class="navbar-header">
                   <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#mynavbar">
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    </button>
                    <a href ="#" class="navbar-brand">Bonnie翻译</a>
               </div>
               <div class="collapse navbar-collapse" id="mynavbar">
                {% block bar %}
                    <ul class="nav navbar-nav navbar-right">
                            <li><a href="#">首页</a></li>
                            <li><a href="{% url 'user:login' %}">登录</a></li>
                            <li><a href="{% url 'user:register' %}">注册</a></li>
               <li><a href="http://fanyi.youdao.com/" target="_blank">翻译</a></li>
             <li><a href="#"> 关于我们 </a></li>
                    </ul>
                {% endblock bar %}
               </div>
            </div>
    </nav>
    {% block content %}
     <div class="jumbotron">
             <div class="container">
                     <div class="row">
                       <form action="{% url 'user:index' %}" method="post">
                             {% csrf_token %}
                            <div class="col-lg-3 col-lg-offset-1">
                                    <textarea name="fanyi_content">
                                            {
       { fanyi_content }}
                                    </textarea>
                            </div>
                            <div class="col-lg-2 col-lg-offset-1">
                                <button type="submit">翻译</button>
                            </div>
                            <div class="col-lg-1 col-lg-offset-1">
                                    <textarea name="fanyi_content">
                                            {
       { result }}
                                    </textarea>
                            </div>
                         </form>
                    </div>
             </div>
    </div>
    {% endblock content%}
    <div class="footer no-mp" align="center">
            <div class="foot_link">
                <a href="#">关于我们</a>
                <span>|</span>
                <a href="#">联系我们</a>
                <span>|</span>
                <a href="#">招聘人才</a>
                <span>|</span>
                <a href="#">友情链接</a>
            </div>
            <p>CopyRight © 2016 Bonnie All Rights Reserved</p>
            <p>电话：010-****888    京ICP备*******8号</p>
        </div>
    </body>
    {% endblock body %}
    </html>

完整的代码如果需要的话，可以去我的 github 下载。**下载完记得标星！！！！！！**

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz_size_16_color_FFFFFF_t_70]: https://img-blog.csdnimg.cn/20200204174245127.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz_size_16_color_FFFFFF_t_70 1]: https://img-blog.csdnimg.cn/2020020417440744.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz_size_16_color_FFFFFF_t_70 2]: https://img-blog.csdnimg.cn/20200204174506607.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz_size_16_color_FFFFFF_t_70 3]: https://img-blog.csdnimg.cn/20200204175726219.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz_size_16_color_FFFFFF_t_70 4]: https://img-blog.csdnimg.cn/20200418234319350.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz_size_16_color_FFFFFF_t_70 5]: https://img-blog.csdnimg.cn/20200418234349720.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz_size_16_color_FFFFFF_t_70 6]: https://img-blog.csdnimg.cn/20200418234529744.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz_size_16_color_FFFFFF_t_70 7]: https://img-blog.csdnimg.cn/20200418234542372.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz_size_16_color_FFFFFF_t_70 8]: https://img-blog.csdnimg.cn/20200418234553792.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz_size_16_color_FFFFFF_t_70 9]: https://img-blog.csdnimg.cn/20200418234613722.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz_size_16_color_FFFFFF_t_70 10]: https://img-blog.csdnimg.cn/20200418234647732.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz_size_16_color_FFFFFF_t_70 11]: https://img-blog.csdnimg.cn/20200418234701765.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz_size_16_color_FFFFFF_t_70 12]: https://img-blog.csdnimg.cn/2020041823473971.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz_size_16_color_FFFFFF_t_70 13]: https://img-blog.csdnimg.cn/2020041823475138.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdib3dqMTIz,size_16,color_FFFFFF,t_70