1

Есть приложение на django, фронтенд которого написан на Vue.js:

  1. Подразумевается, что django участвует только в раздаче статики и выдаче index.html
  2. Дальнейший роутинг управляется непосредственно на стороне фронтенда.
  3. Параметр mode в роутере Vue установлен в history
  4. index.html выдается по /controlpanel/
  5. Rest API выдается по /controlpanel/api/

В связи с этим имеем код:

views.py:

import os
from django.conf import settings
from django.http.response import HttpResponse

def index(_):
    html = open(os.path.join(settings.STATICFILES_DIRS[0], "index.html")).read()
    return HttpResponse(html)

#заглушка
def api(_):
    return HttpResponse('api')

urls.py:

from django.urls import path
from controlpanel.views import index, api

urlpatterns = [
    path('api/', api),
    path('', index),
]

/routers/index.js

import Vue from 'vue'
import Router from 'vue-router'
import Hello from '@/components/Hello'
import NotFoundComponent from '@/components/NotFoundComponent'

Vue.use(Router)

export default new Router({
  mode: 'history',
  base: '/controlpanel',
  routes: [
    {
      path: '/',
      name: 'Hello',
      component: Hello
    },
    { path: '*', component: NotFoundComponent }
  ]
})

В результате django выдает index.html по /controlpanel/, но если из браузера перейти в /controlpanel/<any_url>/ то django выдает свою 404 страницу.

Вопрос: как сделать так, чтобы vue.js обрабатывал все url после /controlpanel/ не прибегая к mode: 'hash'?

3
  • Все url попадают в vue.js по умолчанию. Что у вас не получается?
    – Roman C
    21 мая 2018 в 9:14
  • @RomanC Если вставить в адресную строку /controlpanel/<any_url>/ то any_url не дойдет до Vue Router, потому что django выдаст 404 ошибку. 21 мая 2018 в 9:17
  • Есть вариант дублировать урлы из vue в django, но как по мне, такой костыль вообще не вариант... 21 мая 2018 в 9:44

1 ответ 1

2

Нашел следующее решение (если это можно назвать решением):

from django.urls import path, re_path
from controlpanel.views import index, api

urlpatterns = [
    path('api/', api),
    re_path('^.*$', index),
]

В документации написано, что re_path является алиасом для url(), который в свою очередь поддерживает такую конструкцию, как '^.*$', что позволяет отдать одно представление на все неизвестные урлы. Но так-как re_path это временное решение, и возможно, в будущем, оно будет удалено из новых версий django, вопрос все еще открытый. Если можно как нибудь реализовать это без использования re_path, это будет отличным решением.

P.S. path('.*', index) к сожалению, работать не хочет.

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.