为了进行类似安装的生产,我想将Angular和PHP的所有开发服务器端都隐藏在nginx反向代理后面(侦听端口8002)。 在大多数情况下,这是可行的。 该API可以正确地传递其数据并按预期处理请求。 Angular开发服务器还可以按预期交付其应用程序。 我唯一遇到的问题是关于第二个Angular dev服务器实例的热重载,因为它仅在第一个实例中的更改时重载。
在端口4200上运行的主要angular应用程序可以在热重载时正常工作。
但是,第二个实例(在端口4300上运行)不会监听位置为~ ^/collector/sockjs-node/
的sockjs实例,而是监听位置为~ ^/sockjs-node/
的sockjs实例。
因为我的index.html
中的基础设置为正确的路径:<base href="/collector/">
。这使我感到惊讶。
因此,我可以得出结论,我(可能)必须更改一些角度设置,以使其能够在其他端点上通知应用程序。
我的angular.json
几乎是系统自动生成的配置,除了我添加了angular的PWA软件包。
以下是我的angular.json
,其中应用名称已由“ some-app”替换,因为它仍在开发中且尚未发布:
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"version": 1,
"newProjectRoot": "projects",
"projects": {
"some-app": {
"root": "",
"sourceRoot": "src",
"projectType": "application",
"prefix": "app",
"schematics": {
"@schematics/angular:component": {
"style": "sass"
}
},
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"outputPath": "dist/some-app",
"index": "src/index.html",
"main": "src/main.ts",
"polyfills": "src/polyfills.ts",
"tsConfig": "src/tsconfig.app.json",
"assets": [
"src/favicon.ico",
"src/assets",
"src/manifest.json"
],
"styles": [
"./node_modules/@angular/material/prebuilt-themes/pink-bluegrey.css",
"src/styles.scss"
],
"scripts": [],
"es5BrowserSupport": true
},
"configurations": {
"production": {
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.prod.ts"
}
],
"optimization": true,
"outputHashing": "all",
"sourceMap": false,
"extractCss": true,
"namedChunks": false,
"aot": true,
"extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": true,
"budgets": [
{
"type": "initial",
"maximumWarning": "2mb",
"maximumError": "5mb"
}
],
"serviceWorker": true,
"ngswConfigPath": "src/ngsw-config.json"
}
}
},
"serve": {
"builder": "@angular-devkit/build-angular:dev-server",
"options": {
"browserTarget": "some-app:build"
},
"configurations": {
"production": {
"browserTarget": "some-app:build:production"
}
}
},
"extract-i18n": {
"builder": "@angular-devkit/build-angular:extract-i18n",
"options": {
"browserTarget": "some-app:build"
}
},
"test": {
"builder": "@angular-devkit/build-angular:karma",
"options": {
"main": "src/test.ts",
"polyfills": "src/polyfills.ts",
"tsConfig": "src/tsconfig.spec.json",
"karmaConfig": "src/karma.conf.js",
"styles": [
"src/styles.scss"
],
"scripts": [],
"assets": [
"src/favicon.ico",
"src/assets",
"src/manifest.json"
]
}
},
"lint": {
"builder": "@angular-devkit/build-angular:tslint",
"options": {
"tsConfig": [
"src/tsconfig.app.json",
"src/tsconfig.spec.json"
],
"exclude": [
"**/node_modules/**"
]
}
}
}
},
"some-app-e2e": {
"root": "e2e/",
"projectType": "application",
"prefix": "",
"architect": {
"e2e": {
"builder": "@angular-devkit/build-angular:protractor",
"options": {
"protractorConfig": "e2e/protractor.conf.js",
"devServerTarget": "some-app:serve"
},
"configurations": {
"production": {
"devServerTarget": "some-app:serve:production"
}
}
},
"lint": {
"builder": "@angular-devkit/build-angular:tslint",
"options": {
"tsConfig": "e2e/tsconfig.e2e.json",
"exclude": [
"**/node_modules/**"
]
}
}
}
}
},
"defaultProject": "some-app"
}
如果也可以在nginx中修复,这是我当前的设置文件,该文件包含在http
的{{1}}设置栏中:
/etc/nginx/nginx.conf