diff --git a/.gitignore b/.gitignore index c23aff8fc6e..61265713937 100644 --- a/.gitignore +++ b/.gitignore @@ -33,7 +33,7 @@ src/portal/typings/ .vscode/ **/node_modules **/ssl/ -**/proxy.config.json +**/proxy.config.mjs src/portal/src/**/*.js src/portal/src/**/*.js.map diff --git a/src/portal/README.md b/src/portal/README.md index ecb2b8d3eea..9f0fa6941bb 100644 --- a/src/portal/README.md +++ b/src/portal/README.md @@ -10,27 +10,9 @@ Start ============ 1. npm install (should trigger 'npm postinstall') 2. npm run postinstall (if not triggered, manually run this step) -3. create "proxy.config.json" file with below content under "portal" directory, and replace "hostname" with an available Harbor hostname -4. npm run start -5. open your browser on https://localhost:4200 -```json -[ - { - "context": [ - "/api", - "/c", - "/i18n", - "/chartrepo", - "/LICENSE", - "/swagger.json", - "/swagger2.json", - "/devcenter-api-2.0", - "/swagger-ui.bundle.js" - ], - "target": "https://hostname", - "secure": false, - "changeOrigin": true, - "logLevel": "debug" - } -] -``` +3. copy "proxy.config.mjs.temp" file to "proxy.config.mjs" + `cp proxy.config.mjs.temp proxy.config.mjs` +4. Modify "proxy.config.mjs" to specify a Harbor server. And you can specify the agent if you work behind a corporate proxy +5. npm run start +6. open your browser on https://localhost:4200 + diff --git a/src/portal/angular.json b/src/portal/angular.json index 0845b47091e..414ab96ca22 100644 --- a/src/portal/angular.json +++ b/src/portal/angular.json @@ -83,7 +83,8 @@ "serve": { "builder": "@angular-devkit/build-angular:dev-server", "options": { - "browserTarget": "harbor-portal:build" + "browserTarget": "harbor-portal:build", + "proxyConfig": "proxy.config.mjs" }, "configurations": { "production": { diff --git a/src/portal/package-lock.json b/src/portal/package-lock.json index 4a974cb8341..c12b4aa5c62 100644 --- a/src/portal/package-lock.json +++ b/src/portal/package-lock.json @@ -51,6 +51,7 @@ "eslint-config-prettier": "^8.5.0", "eslint-plugin-prettier": "^4.0.0", "express": "^4.17.1", + "https-proxy-agent": "^5.0.1", "jasmine-core": "~4.5.0", "jasmine-spec-reporter": "~7.0.0", "karma": "^6.4.0", diff --git a/src/portal/package.json b/src/portal/package.json index fbec2d8135c..0c0017818fa 100644 --- a/src/portal/package.json +++ b/src/portal/package.json @@ -5,9 +5,9 @@ "angular-cli": {}, "scripts": { "postinstall": "node scripts/convert-yaml-to-json.js && ng-swagger-gen -i ng-swagger-gen/swagger.json -o ng-swagger-gen && node scripts/delete-swagger-json.js", - "start": "node --max_old_space_size=2048 ./node_modules/@angular/cli/bin/ng serve --ssl true --host 0.0.0.0 --proxy-config proxy.config.json", - "start:prod": "node --max_old_space_size=2048 ./node_modules/@angular/cli/bin/ng serve --ssl true --host 0.0.0.0 --proxy-config proxy.config.json --configuration production", - "start_default_port": "node --max_old_space_size=2048 ./node_modules/@angular/cli/bin/ng serve --ssl true --host 0.0.0.0 --port 443 --disable-host-check --proxy-config proxy.config.json", + "start": "node --max_old_space_size=2048 ./node_modules/@angular/cli/bin/ng serve --ssl true --host 0.0.0.0", + "start:prod": "node --max_old_space_size=2048 ./node_modules/@angular/cli/bin/ng serve --ssl true --host 0.0.0.0 --configuration production", + "start_default_port": "node --max_old_space_size=2048 ./node_modules/@angular/cli/bin/ng serve --ssl true --host 0.0.0.0 --port 443 --disable-host-check", "lint": "ng lint", "lint_fix": "ng lint --fix", "lint:style": "npx stylelint \"**/*.scss\"", @@ -70,6 +70,7 @@ "eslint-config-prettier": "^8.5.0", "eslint-plugin-prettier": "^4.0.0", "express": "^4.17.1", + "https-proxy-agent": "^5.0.1", "jasmine-core": "~4.5.0", "jasmine-spec-reporter": "~7.0.0", "karma": "^6.4.0", diff --git a/src/portal/proxy.config.mjs.temp b/src/portal/proxy.config.mjs.temp new file mode 100644 index 00000000000..ad58b87edb3 --- /dev/null +++ b/src/portal/proxy.config.mjs.temp @@ -0,0 +1,43 @@ +import HttpsProxyAgent from 'https-proxy-agent'; +// Define the proxy configuration +const HarborProxyConfig = [ + { + "context": [ + "/api", + "/c", + "/i18n", + "/chartrepo", + "/LICENSE", + "/swagger.json", + "/swagger2.json", + "/devcenter-api-2.0", + "/swagger-ui.bundle.js" + ], + "target": "${A Harbor server}", + "secure": false, + "changeOrigin": true, + "logLevel": "debug" + } +]; +// Define if you use agent +const useAgent = false; +// Specify an agent server, if empty, will read it from environment variable http_proxy or HTTP_PROXY +const specifiedAgentServer = "${An agent server}"; + +function setupForCorporateProxy(proxyConfig) { + if (useAgent) { + const agentServer = process.env.http_proxy || process.env.HTTP_PROXY || specifiedAgentServer; + if (agentServer) { + const agent = new HttpsProxyAgent(agentServer); + console.log('Using corporate agent server: ' + agentServer); + proxyConfig.forEach(function(entry) { + entry.agent = agent; + }); + } + } + return proxyConfig; +} + +export default setupForCorporateProxy(HarborProxyConfig); + +