odsprzęgnięty frontend i backend z Django, pakietem internetowym, reactjs, routerem reagowania

Próbuję oddzielić mój frontend i moje zaplecze w moim projekcie. Moja frontend składa się z reactjs, a routing zostanie wykonany z react-router, Mój backend, jeśli został utworzony z Django i planuję użyć przedniego końca do wywołania API (ajax) do Django.odsprzęgnięty frontend i backend z Django, pakietem internetowym, reactjs, routerem reagowania

W tej chwili nie jestem pewien, jak prawidłowo połączyć te dwa końce.

Oto link do mojego projektu

Tu jest mój struktury projektu:

/cherngloong 
    /app (frontend) 
    /cherngloong 
    /templates 
     index.jtml 
    urls.py 
    settings.py 
    ... 
    /contact 
    urls.py 
    views.py

używam webpack budować wszystkie moje JS i CSS i umieścić go w index.html z webpack_loader który wygląda tak:

{% load render_bundle from webpack_loader %} 
<!DOCTYPE html> 
<html> 
    <head> 
    <meta charset="UTF-8"> 
    <title>Example</title> 
    </head> 

    <body> 
    <div id="app"></div> 
    {% render_bundle 'main' %} 
    </body> 
</html>

W Django Oto moje cherngloong/urls.py:

urlpatterns = [ 
    url(r'^admin/', include(admin.site.urls)), 
    url(r'', TemplateView.as_view(template_name='index.html')), 
    url(r'^api/', include('contact.urls')) 
] 

urlpatterns += staticfiles_urlpatterns()

Nie chcę służyć moją aplikację z Django Django lub dokonać służyć ten sam pogląd na każdy URL.

Oto moje react-router trasy:

var routes = (
    <Router> 
     <Route path="/" component={ Views.Layout } > 
      <Route path="contact" component={ Views.Contact }/> 
     </Route> 
     <Route path="*" component={ Views.RouteNotFound } /> 
    </Router> 
); 

export default routes;

mogę obecnie uruchomić serwer, ale gdy uruchamiam przedniej części końcowej, widzę to w narzędziach deweloperskich

http://localhost:8000/static/public/js/main.js Failed to load resource: the server responded with a status of 404 (NOT FOUND)

Źródło

2015-10-22 Liondancer

Jaki URL odwiedzasz, aby wyświetlić ten błąd w narzędziach programistycznych? – user2719875

Zobacz moją poprzednią odpowiedź na to pytanie [tutaj] (http://stackoverflow.com/questions/10216827/django-static-files-wont-load/10243622#10243622) – krs

@ user2719875 'localhost: 8000 /' – Liondancer

Twój settings.py definiuje następnie:

STATICFILES_DIRS = (
    os.path.join(BASE_DIR, 'app'), 
)

To będzie służyć t on pliki w katalogu /app/. więc URL /static/public/js/ przekłada się na katalog /app/public/js/.

To, czego chcesz, to serwować pliki w katalogu /public/. Użyj następujących ustawień:

STATICFILES_DIRS = (
    os.path.join(BASE_DIR, 'public'), 
) 

WEBPACK_LOADER = { 
    'DEFAULT': { 
     'BUNDLE_DIR_NAME': 'js/', 
     'STATS_FILE': os.path.join(BASE_DIR, 'webpack-stats.json') 
    } 
}

Również adresy są różne w kodzie zamieszczonych tu iw github. url(r'', Templa... dopasuje WSZYSTKIE adresy URL i po prostu wyrenderuje index.html nawet podczas wykonywania połączeń z numerem /api/. Przesuń tę linię na dół:

urlpatterns = [ 
    url(r'^admin/', include(admin.site.urls)), 
    url(r'^api/', include('contact.urls')), 
] 

urlpatterns += staticfiles_urlpatterns() 

urlpatterns += [ 
    url(r'', TemplateView.as_view(template_name='index.html')), 
]

Źródło

2015-10-22 09:54:14

odsprzęgnięty frontend i backend z Django, pakietem internetowym, reactjs, routerem reagowania

Odpowiedz

Powiązane problemy