如何使用 Nginx 和 dropwizard 部署 angularjs 应用程序前端

How to deploy an angularjs application frontend with Nginx and dropwizard

我正在开发一个使用 angularjs 应用程序前端作为后端 dropwizard 的应用程序。我计划使用 Nginx 作为后端 dropwizard 服务器的网关和资产服务器(图像,也许还有 angularjs 应用程序)。

我的问题是最好的部署策略是什么:

  1. 捆绑 angularjs 与 dropwizard 后端并使用 nginx 作为前端?
  2. 正在 nginx 服务器上部署 angularjs 应用程序?

提前致谢,

从 nginx 提供像您的 angularjs 应用这样的静态文件将减少 dropwizard 的负载。

编辑:事实证明 dropwizard 确实支持 serving static files。但是,我仍然相信 nginx 会做得更好。

我会使用 nginx 作为 API Gateway 将您的请求路由到您的后端。

Implement an API gateway that is the single entry point for all clients. The API gateway handles requests in one of two ways. Some requests are simply proxied/routed to the appropriate service. It handles other requests by fanning out to multiple services.

使用网关,您可以根据需要灵活地更改后端。因为 nginx 仅作为网关工作,他还可以为您的静态文件提供服务 (angularjs)。网关具有更多优势,如日志记录、身份验证等。

我更愿意在 nxginx 中部署 angularjs 因为

  • 快速提供静态内容(angularjs)
  • 很少与后端互动 服务器(一些 http 调用)

按照此 您可以使用此 nginx 配置文件来代理服务器内的 Dropwizard 应用程序从端口 8080 到端口 80:

server {
listen 80;

server_name api.example.com;

location / {
    proxy_pass http://127.0.0.1:8080;
    proxy_set_header  Host             $http_host;
    proxy_set_header  X-Real-IP        $remote_addr;
    proxy_set_header  X-Forwarded-For  $proxy_add_x_forwarded_for;
    }
}

对于您的 Angular 申请,您可以 serve static assets from Dropwizard or set a virtual host via Nginx

作为旁注,请记住在您的 Dropwizard 应用程序的 mainClass 中配置 CORS:

  @Override
  public void run(Configuration configuration, Environment environment) throws Exception {
    configureCors(environment);
    environment.jersey().register(new HelloWorldResource(template));
  }

  private void configureCors(Environment environment) {
    FilterRegistration.Dynamic filter = environment.servlets().addFilter("CORS", CrossOriginFilter.class);
    filter.addMappingForUrlPatterns(EnumSet.allOf(DispatcherType.class), true, "/*");
    filter.setInitParameter(CrossOriginFilter.ALLOWED_METHODS_PARAM, "GET,PUT,POST,DELETE,OPTIONS");
    filter.setInitParameter(CrossOriginFilter.ALLOWED_ORIGINS_PARAM, "*");
    filter.setInitParameter(CrossOriginFilter.ACCESS_CONTROL_ALLOW_ORIGIN_HEADER, "*");
    filter.setInitParameter("allowedHeaders", "Content-Type,Authorization,X-Requested-With,Content-Length,Accept,Origin");
    filter.setInitParameter("allowCredentials", "true");
  }