google 应用引擎上的 Angular4 和 WebApp2

Angular4 and WebApp2 on google App engine

我目前正在使用由 angular-CLI 生成的 angular4 投影来创建项目结构,我能够使用 ng-serve 为它提供服务并开发并查看更改。现在我想使用 google app engine 和 webApp2 将它移至我自己的后端托管,并使用 dev_appserver.py app.yaml 运行。目前,我能让它工作的唯一方法是执行 ng-build 并从 dist 文件夹中提供文件。我想这样做,这样我就可以轻松地进行更改,而不必每次都等待它重建。

您可以在 angular 上使用环境,以便将 python 休息服务和另一个环境指向生产环境。

示例:

enviroment.ts

export const environment = {
  production: false,
  urlServices: 'http://190.52.112.41:8075'
};

enviroment.prod.ts

export const environment = {
  production: true,
  urlServices: 'http://localhost:8080'
};

这样,你不需要编译来测试你的应用程序,因为 angular 总是会指向你 python app.

使用标准 App Engine 配置的 app.yaml 解决方案:

service: stage
runtime: python27
api_version: 1
threadsafe: true

skip_files:
- ^(?!dist)  # Skip any files not in the dist folder

handlers:
# Routing for bundles to serve directly
- url: /((?:inline|main|polyfills|styles|vendor)\.[a-z0-9]+\.bundle\.js)
  secure: always
  redirect_http_response_code: 301
  static_files: dist/
  upload: dist/.*

# Routing for a prod styles.bundle.css to serve directly
- url: /(styles\.[a-z0-9]+\.bundle\.css)
  secure: always
  redirect_http_response_code: 301
  static_files: dist/
  upload: dist/.*

# Routing for typedoc, assets and favicon.ico to serve directly
- url: /((?:assets|docs)/.*|favicon\.ico)
  secure: always
  redirect_http_response_code: 301
  static_files: dist/
  upload: dist/.*

# Any other requests are routed to index.html for angular to handle so we don't need hash URLs
- url: /.*
  secure: always
  redirect_http_response_code: 301
  static_files: dist/index.html
  upload: dist/index\.html
  http_headers:
    Strict-Transport-Security: max-age=31536000; includeSubDomains
    X-Frame-Options: DENY

正在寻找有关我如何做得更好的任何反馈。