i18n国际化前后端设计

1.settings设置

settings.py添加LocalMiddleware

MIDDLEWARE = {
    ...
    'django.middleware.locale.LocaleMiddleware',
    ...
}
TEMPLATES = {
    ...
    'django.template.context_processors.i18n',
    ...
}
LANGUAGE_SESSION_KEY = '_language'

2.设置语言接口

urls.py

urlpatterns += [
path('language/', view.set_language),  # 语言切换接口
url(r'^i18n/', include('django.conf.urls.i18n')),
]

3.视图设计

# 使用session存储language信息
from django.views.decorators.csrf import csrf_exempt

@csrf_exempt
def set_language(request):
    """
    多语言切换
    """
    language = request.POST.get("language", "en")
    if language == "zh_hans":
        request.session[settings.LANGUAGE_SESSION_KEY] = 'zh-Hans'
    else:
        request.session[settings.LANGUAGE_SESSION_KEY] = 'en'

    return JsonResponse({'detail': 'success'}, status=200)

4.前端页面

前端使用jinja2模板引擎。 页面需要引用{% load i18n %} 多语言使用{%trans '占位符' %}来代替翻译文本

<script>
    $(function (){
        $(".select_language").change(function () {
            $.ajax({
                url: '/language/',
                type: 'POST',
                dataType: 'json',
                data: {'language': $(this).children('option:selected').val()},
                async: 'true',
                success: function () {
                    {#请求成功刷新当前页#}
                    window.location.reload();
                },
                error: function () {
                    alert('set language unsuccess')
                }
            })
        })
    })
</script>
<select name="language" class="select_language">
    <option value="" selected:disabled style="diaplay:none">{%trans 'select_language' %}</option>
    <option value="en" class="language">English</option>
    <option value="zh_hans" class="language">简体中文</option>
</select>

常见国家语言列表