Configuring WSGI to service a single index.html file for a single page application

问题

I have a standard Django application set up using WSGI on Apache2 (Ubuntu 18.04)

I now want to serve all front end content via a single index.html file (still allowing access the /admin url and ensuring the REST api calls via /api work). I'm using Ember for the single page application.

Any help much appreciated!

Here is my current .conf set up:

DocumentRoot /var/www/examplesite.co.uk/public_html

Alias /static /home/someuser/djangoprojects/someuser_v1_project/static
<Directory /home/someuser/djangoprojects/someuser_v1_project/static>
      Require all granted
</Directory>

Alias /media /home/someuser/djangoprojects/someuser_v1_project/media
<Directory /home/someuser/djangoprojects/someuser_v1_project/media>
      Require all granted
 </Directory>

 <Directory /home/someuser/djangoprojects/someuser_v1_project/someuser_v1_project>
 <Files wsgi.py>
        Require all granted
 </Files>
 </Directory>

 WSGIDaemonProcess examplesite.co.uk python-home=/home/someuser/virtualenvs/someuser_env python-path=/home/someuser/djangoprojects/someuser_v1_project
 WSGIProcessGroup examplesite.co.uk
 WSGIScriptAlias / /home/someuser/djangoprojects/someuser_v1_project/someuser_v1_project/wsgi.py

回答1:

Since your index.html will be static it just needs to be sent to the user-agent (browser) as is. It doesn't need any server-side processing (WSGI).

The web-server can simply send index.html (and any js/css resources) as requested by the browser. It doesn't even need to be in the same directory as your API back-end.

I am using a set-up like this in a production app. This keeps development and deployment independent for front/back.

/www
  /myapp                <-- ember SPA (where normal users will go)
     index.html
    /assets
    /fonts
  /myapp_backend
    /api/v1/...          <-- backend API (API that ember talks to)
    /admin/              <-- admin section

You can define the backend API location in ember config production settings. (Could be different settings in development). You can then set the namespace in your ember application data adapter to this path.

// config/environment.js
...
APP: {
  ENV: {
         REST_API_ENDPOINT: 'myapp_backend/api/v1',
         REST_API_HOST:     'http://production-host',
       ...
       }

  ...
}

// app/adapters/application.js
import DS from 'ember-data';
import ENV from '../config/environment';
...

export default DS.RESTAdapter.extend({
    namespace: ENV.APP.REST_API_ENDPOINT,
    host:      ENV.APP.REST_API_HOST,
    ...
})

When a release is ready you can ember build --environment=production and copy 'dist' directory to the server myapp directory.

回答2:

You are much better off not using WSGI/ngnix to serve the static assets of a totally decoupled frontend app and using a service like Netlify or host the assets on AWS using ember-cli-deploy http://ember-cli-deploy.com.

Why?

It's faster
You can more easily automate the deployments to either app
You don't have to think about this question
Netlify, in particular offers things like deploy previews that make your life a joy.

If you want a specific answer, I'd check this out: https://pypi.org/project/wsgi-static-middleware/

来源：https://stackoverflow.com/questions/55059928/configuring-wsgi-to-service-a-single-index-html-file-for-a-single-page-applicati

标签

ember.js

mod-wsgi

wsgi

django-wsgi