MaDgIK
/
monitor-dashboard
13
0
Fork 0
Code Issues Pull Requests Projects Releases 20 Wiki Activity

[angular-17 | WIP] upgrade angular core and cli to v17

This commit is contained in:
Alex Martzios 2024-07-25 11:37:56 +03:00
parent 6b022729db
commit 0193875399
3 changed files with 57 additions and 140 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
angular.json
View File

@ -172,18 +172,18 @@
"serve": { "serve": {
"builder": "@angular-devkit/build-angular:dev-server", "builder": "@angular-devkit/build-angular:dev-server",
"options": { "options": {
"browserTarget": "monitor-dashboard:build" "buildTarget": "monitor-dashboard:build"
}, },
"configurations": { "configurations": {
"production": { "production": {
"browserTarget": "monitor-dashboard:build:production" "buildTarget": "monitor-dashboard:build:production"
} }
} }
}, },
"extract-i18n": { "extract-i18n": {
"builder": "@angular-devkit/build-angular:extract-i18n", "builder": "@angular-devkit/build-angular:extract-i18n",
"options": { "options": {
"browserTarget": "monitor-dashboard:build" "buildTarget": "monitor-dashboard:build"
} }
}, },
"test": { "test": {
@ -248,7 +248,7 @@
"defaultConfiguration": "" "defaultConfiguration": ""
}, },
"serve-ssr": { "serve-ssr": {
"builder": "@nguniversal/builders:ssr-dev-server", "builder": "@angular-devkit/build-angular:ssr-dev-server",
"options": { "options": {
"browserTarget": "monitor-dashboard:build", "browserTarget": "monitor-dashboard:build",
"serverTarget": "monitor-dashboard:server" "serverTarget": "monitor-dashboard:server"
@ -261,7 +261,7 @@
} }
}, },
"prerender": { "prerender": {
"builder": "@nguniversal/builders:prerender", "builder": "@angular-devkit/build-angular:prerender",
"options": { "options": {
"browserTarget": "monitor-dashboard:build:production", "browserTarget": "monitor-dashboard:build:production",
"serverTarget": "monitor-dashboard:server:production", "serverTarget": "monitor-dashboard:server:production",

34
package.json
View File

@ -21,19 +21,19 @@
}, },
"private": true, "private": true,
"dependencies": { "dependencies": {
"@angular/animations": "^16.1.7", "@angular/animations": "^17.3.12",
"@angular/cdk": "^16.1.6", "@angular/cdk": "^16.1.6",
"@angular/common": "^16.1.7", "@angular/common": "^17.3.12",
"@angular/compiler": "^16.1.7", "@angular/compiler": "^17.3.12",
"@angular/core": "^16.1.7", "@angular/core": "^17.3.12",
"@angular/forms": "^16.1.7", "@angular/forms": "^17.3.12",
"@angular/localize": "^16.1.7", "@angular/localize": "^17.3.12",
"@angular/material": "^16.1.6", "@angular/material": "^16.1.6",
"@angular/platform-browser": "^16.1.7", "@angular/platform-browser": "^17.3.12",
"@angular/platform-browser-dynamic": "^16.1.7", "@angular/platform-browser-dynamic": "^17.3.12",
"@angular/platform-server": "^16.1.7", "@angular/platform-server": "^17.3.12",
"@angular/router": "^16.1.7", "@angular/router": "^17.3.12",
"@nguniversal/express-engine": "^16.1.1", "@angular/ssr": "^17.3.8",
"axios": "^1.4.0", "axios": "^1.4.0",
"clipboard": "^1.5.16", "clipboard": "^1.5.16",
"core-js": "^2.5.4", "core-js": "^2.5.4",
@ -48,17 +48,17 @@
"zone.js": "~0.14.0" "zone.js": "~0.14.0"
}, },
"devDependencies": { "devDependencies": {
"@angular-devkit/build-angular": "^16.1.6", "@angular-devkit/build-angular": "^17.3.8",
"@angular/cli": "^16.1.6", "@angular/cli": "^17.3.8",
"@angular/compiler-cli": "^16.1.7", "@angular/compiler-cli": "^17.3.12",
"@angular/language-service": "^16.1.7", "@angular/language-service": "^17.3.12",
"@nguniversal/builders": "^16.1.1",
"@types/ckeditor": "^4.9.10", "@types/ckeditor": "^4.9.10",
"@types/compression": "^1.7.0", "@types/compression": "^1.7.0",
"@types/express": "^4.17.0", "@types/express": "^4.17.0",
"@types/jasmine": "~3.6.0", "@types/jasmine": "~3.6.0",
"@types/jasminewd2": "~2.0.3", "@types/jasminewd2": "~2.0.3",
"@types/node": "^16.18.50", "@types/node": "^16.18.50",
"browser-sync": "^3.0.0",
"codelyzer": "^6.0.0", "codelyzer": "^6.0.0",
"jasmine-core": "~3.8.0", "jasmine-core": "~3.8.0",
"jasmine-spec-reporter": "~5.0.0", "jasmine-spec-reporter": "~5.0.0",
@ -71,4 +71,4 @@
"ts-node": "~7.0.0", "ts-node": "~7.0.0",
"typescript": "~5.2.0" "typescript": "~5.2.0"
} }
} }

153
server.ts
View File

@ -1,139 +1,56 @@
import 'zone.js/node'; import 'zone.js/node';
import {ngExpressEngine} from '@nguniversal/express-engine'; import { APP_BASE_HREF } from '@angular/common';
import { CommonEngine } from '@angular/ssr';
import * as express from 'express'; import * as express from 'express';
import * as compression from 'compression'; import { existsSync } from 'node:fs';
import {join} from 'path'; import { join } from 'node:path';
import bootstrap from './src/main.server';
import {AppServerModule} from './src/main.server';
import {APP_BASE_HREF} from '@angular/common';
import {existsSync} from 'fs';
import {REQUEST, RESPONSE} from "./src/app/openaireLibrary/utils/tokens";
import {properties} from "./src/environments/environment";
import axios, {AxiosHeaders} from "axios";
import {Stakeholder} from "./src/app/openaireLibrary/monitor/entities/stakeholder";
import {CacheIndicators} from "./src/app/openaireLibrary/monitor-admin/utils/cache-indicators/cache-indicators";
import {Session, User} from "./src/app/openaireLibrary/login/utils/helper.class";
import {UserManagementService} from "./src/app/openaireLibrary/services/user-management.service";
var bodyParser = require('body-parser');
var jsonParser = bodyParser.json();
// The Express app is exported so that it can be used by serverless Functions. // The Express app is exported so that it can be used by serverless Functions.
export function app() { export function app(): express.Express {
const server = express(); const server = express();
server.use(compression());
const distFolder = join(process.cwd(), 'dist/monitor-dashboard/browser'); const distFolder = join(process.cwd(), 'dist/monitor-dashboard/browser');
const indexHtml = existsSync(join(distFolder, 'index.original.html')) ? 'index.original.html' : 'index'; const indexHtml = existsSync(join(distFolder, 'index.original.html'))
let cacheIndicators: CacheIndicators = new CacheIndicators(); ? join(distFolder, 'index.original.html')
: join(distFolder, 'index.html');
// Our Universal express-engine (found @ https://github.com/angular/universal/tree/master/modules/express-engine)
server.engine('html', ngExpressEngine({ const commonEngine = new CommonEngine();
bootstrap: AppServerModule,
inlineCriticalCss: false
}));
server.set('view engine', 'html'); server.set('view engine', 'html');
server.set('views', distFolder); server.set('views', distFolder);
server.use('/cache', function (req, res, next) {
res.header('Access-Control-Allow-Origin', req.headers.origin);
res.header('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept');
res.header('Access-Control-Allow-Methods', 'GET, OPTIONS, POST, DELETE');
res.header('Access-Control-Max-Age', "1800");
next();
});
server.post('/cache/:alias', jsonParser, async (req, res) => {
await checkPermissions(req, res, (stakeholder, user) => {
if (cacheIndicators.completed(stakeholder._id)) {
res.send({
id: stakeholder._id,
report: cacheIndicators.createReport(stakeholder._id, cacheIndicators.stakeholderToCacheItems(stakeholder), stakeholder.name, user.email)
});
} else {
res.status(409).send('There is another active caching process for this stakeholder');
}
});
});
server.get('/cache/:alias', async (req, res) => {
await checkPermissions(req, res, stakeholder => {
if (cacheIndicators.exists(stakeholder._id)) {
res.send({
id: stakeholder._id,
report: cacheIndicators.getReport(stakeholder._id)
});
} else {
res.status(404).send('There is not an active caching process for this stakeholder');
}
});
});
async function checkPermissions(req, res, access: (stakeholder, user) => void) {
let headers: AxiosHeaders = new AxiosHeaders();
headers.set('Cookie', req.headers.cookie);
let userinfoRes = (await axios.get<any>(UserManagementService.userInfoUrl(), {
withCredentials: true,
headers: headers
}).catch(error => {
return error.response;
}));
if (userinfoRes.status === 200) {
let user = new User(userinfoRes.data);
let stakeholderRes = (await axios.get<Stakeholder>(properties.monitorServiceAPIURL + '/stakeholder/' + encodeURIComponent(req.params.alias), {
withCredentials: true,
headers: headers
}).catch(error => {
return error.response;
}));
if (stakeholderRes.status === 200) {
let stakeholder = stakeholderRes.data;
if (Session.isPortalAdministrator(user) || Session.isCurator(stakeholder.type, user)) {
access(stakeholder, user);
} else {
res.status(403).send('You are forbidden to access this resource');
}
} else {
res.status(stakeholderRes.status).send(stakeholderRes.statusText);
}
} else {
res.status(userinfoRes.status).send(userinfoRes.data.message);
}
}
// Example Express Rest API endpoints // Example Express Rest API endpoints
// server.get('/api/**', (req, res) => { }); // server.get('/api/**', (req, res) => { });
// Serve static files from /browser // Serve static files from /browser
server.get('*.*', express.static(distFolder, { server.get('*.*', express.static(distFolder, {
maxAge: '1y' maxAge: '1y'
})); }));
// All regular routes use the Universal engine // All regular routes use the Angular engine
server.get('*', (req, res) => { server.get('*', (req, res, next) => {
res.render(indexHtml, { const { protocol, originalUrl, baseUrl, headers } = req;
req, providers: [
{ commonEngine
provide: APP_BASE_HREF, .render({
useValue: req.baseUrl bootstrap,
}, documentFilePath: indexHtml,
{ url: `${protocol}://${headers.host}${originalUrl}`,
provide: REQUEST, useValue: (req) publicPath: distFolder,
}, providers: [
{ { provide: APP_BASE_HREF, useValue: baseUrl },],
provide: RESPONSE, useValue: (res) })
} .then((html) => res.send(html))
] .catch((err) => next(err));
}
);
}); });
return server; return server;
} }
function run() { function run(): void {
const port = process.env.PORT || 4000; const port = process.env['PORT'] || 4000;
// Start up the Node server // Start up the Node server
const server = app(); const server = app();
server.listen(port, () => { server.listen(port, () => {
@ -151,4 +68,4 @@ if (moduleFilename === __filename || moduleFilename.includes('iisnode')) {
run(); run();
} }
export * from './src/main.server'; export default bootstrap;