Angularjs 将后端和前端服务放在开发中的同一个Web服务器后面_Angularjs_Django_Configuration_Webserver

Angularjs 将后端和前端服务放在开发中的同一个Web服务器后面

angularjs django configuration

Angularjs 将后端和前端服务放在开发中的同一个Web服务器后面,angularjs,django,configuration,webserver,Angularjs,Django,Configuration,Webserver,我们正在开发一个web应用程序。后端由Django实现，前端由AngularJS实现。前端是使用标准前端工具开发的当部署到生产机器时，前端和后端都将从同一个域提供服务（我们将使用nginx作为web服务器）。然而，在开发过程中，它们位于不同的域上—lite服务器提供来自localhost:3000的前端文件，Django开发服务器处理对localhost:8000的请求如何在不安装nginx或其他成熟服务器的情况下将两者放在同一个域上？我们不想在开发机器上为我们使用的每个项目或每个项目的每个

我们正在开发一个web应用程序。后端由Django实现，前端由AngularJS实现。前端是使用标准前端工具开发的

当部署到生产机器时，前端和后端都将从同一个域提供服务（我们将使用nginx作为web服务器）。然而，在开发过程中，它们位于不同的域上—lite服务器提供来自localhost:3000的前端文件，Django开发服务器处理对localhost:8000的请求

如何在不安装nginx或其他成熟服务器的情况下将两者放在同一个域上？我们不想在开发机器上为我们使用的每个项目或每个项目的每个分支安装和配置nginx。

我用相同的堆栈做了一个项目。在我的例子中，整个前端驻留在Django项目目录中名为static的文件夹中。此静态文件夹定义为Django项目的settings.py文件中的静态根目录

因此，第一个html文件，比如index.html通过Django使用其渲染引擎提供，然后使用angular的

uiRouter

加载所有部分，所有这些部分都驻留在静态文件夹中，以便可以作为静态文件使用

除了部分之外，所有其他静态媒体（如CSS、JS和图像）也驻留在静态根目录中

index.html的快照：

{% load staticfiles %}
<html>
    <head>
        <link href="{% static 'development/assets/stylesheets/lib/normalize.css' %}" rel="stylesheet" type="text/css">
    </head>
</html>

# Build paths inside the project like this: os.path.join(BASE_DIR, ...)
BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))

STATIC_URL = '/static/'

# Look here for `static` resource
STATICFILES_DIRS = (
    os.path.join(BASE_DIR, 'static'),
)

以下是角度应用程序配置中定义的

uiRouter

状态的快照：

 $stateProvider.state("home", {
    url: "",
    controller: "HomeCtrl",
    templateUrl: "/static/development/templates/home.html"
 })