http-request-manager 19.0.0 → 22.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +696 -283
- package/fesm2022/http-request-manager.mjs +12670 -3280
- package/fesm2022/http-request-manager.mjs.map +1 -1
- package/http-request-manager-22.0.0.tgz +0 -0
- package/package.json +21 -16
- package/types/http-request-manager.d.ts +4066 -0
- package/esm2022/http-request-manager.mjs +0 -5
- package/esm2022/lib/http-request-manager.module.mjs +0 -186
- package/esm2022/lib/http-request-services-demo/database-data-demo/database-data-demo.component.mjs +0 -71
- package/esm2022/lib/http-request-services-demo/http-request-services-demo.component.mjs +0 -45
- package/esm2022/lib/http-request-services-demo/local-storage-demo/local-storage-demo.component.mjs +0 -173
- package/esm2022/lib/http-request-services-demo/local-storage-signals-demo/local-storage-signals-demo.component.mjs +0 -184
- package/esm2022/lib/http-request-services-demo/request-manager-demo/file-downloader/download-file/download-file.component.mjs +0 -80
- package/esm2022/lib/http-request-services-demo/request-manager-demo/file-downloader/file-download.module.mjs +0 -42
- package/esm2022/lib/http-request-services-demo/request-manager-demo/file-downloader/file-downloader.component.mjs +0 -88
- package/esm2022/lib/http-request-services-demo/request-manager-demo/file-downloader/models/download-labels-model.mjs +0 -11
- package/esm2022/lib/http-request-services-demo/request-manager-demo/file-downloader/spinner/spinner.component.mjs +0 -29
- package/esm2022/lib/http-request-services-demo/request-manager-demo/models/sample-ai-prompt.mjs +0 -9
- package/esm2022/lib/http-request-services-demo/request-manager-demo/models/sample-client-info.mjs +0 -12
- package/esm2022/lib/http-request-services-demo/request-manager-demo/models/sample-mapper-client-info.mjs +0 -14
- package/esm2022/lib/http-request-services-demo/request-manager-demo/request-manager-demo.component.mjs +0 -315
- package/esm2022/lib/http-request-services-demo/request-manager-state-demo/request-manager-state-demo.component.mjs +0 -270
- package/esm2022/lib/http-request-services-demo/request-manager-state-demo/services/state-manager-demo.service.mjs +0 -67
- package/esm2022/lib/http-request-services-demo/request-signals-manager-demo/models/sample-ai-prompt.mjs +0 -9
- package/esm2022/lib/http-request-services-demo/request-signals-manager-demo/models/sample-client-info.mjs +0 -12
- package/esm2022/lib/http-request-services-demo/request-signals-manager-demo/models/sample-mapper-client-info.mjs +0 -14
- package/esm2022/lib/http-request-services-demo/request-signals-manager-demo/request-signals-manager-demo.component.mjs +0 -336
- package/esm2022/lib/index.mjs +0 -4
- package/esm2022/lib/interceptors/credentials.interceptor.mjs +0 -14
- package/esm2022/lib/interceptors/index.mjs +0 -5
- package/esm2022/lib/interceptors/models/error-settings.model.mjs +0 -10
- package/esm2022/lib/interceptors/proxy-debugger.interceptor.mjs +0 -47
- package/esm2022/lib/interceptors/request-error.interceptor.mjs +0 -49
- package/esm2022/lib/interceptors/request-header.interceptor.mjs +0 -41
- package/esm2022/lib/models/config-http-options.model.mjs +0 -18
- package/esm2022/lib/models/config-local-storage-options.model.mjs +0 -12
- package/esm2022/lib/models/config-options.model.mjs +0 -12
- package/esm2022/lib/models/config-token.model.mjs +0 -8
- package/esm2022/lib/models/data-type.enum.mjs +0 -7
- package/esm2022/lib/models/database-storage.model.mjs +0 -10
- package/esm2022/lib/models/index.mjs +0 -7
- package/esm2022/lib/models/retry-options.model.mjs +0 -10
- package/esm2022/lib/services/database-manager-services/database.manager.service.mjs +0 -119
- package/esm2022/lib/services/database-manager-services/db.storage.service.mjs +0 -143
- package/esm2022/lib/services/database-manager-services/index.mjs +0 -4
- package/esm2022/lib/services/database-manager-services/models/table-schema.mjs +0 -20
- package/esm2022/lib/services/index.mjs +0 -6
- package/esm2022/lib/services/local-storage-manager-service/index.mjs +0 -4
- package/esm2022/lib/services/local-storage-manager-service/local-storage-manager.service.mjs +0 -302
- package/esm2022/lib/services/local-storage-manager-service/local-storage-signals-manager.service.mjs +0 -277
- package/esm2022/lib/services/local-storage-manager-service/models/global-store-options.model.mjs +0 -13
- package/esm2022/lib/services/local-storage-manager-service/models/index.mjs +0 -6
- package/esm2022/lib/services/local-storage-manager-service/models/setting-options.model.mjs +0 -17
- package/esm2022/lib/services/local-storage-manager-service/models/storage-data.model.mjs +0 -10
- package/esm2022/lib/services/local-storage-manager-service/models/storage-option.model.mjs +0 -12
- package/esm2022/lib/services/local-storage-manager-service/models/storage-type.enum.mjs +0 -7
- package/esm2022/lib/services/request-manager-services/http-manager-signals.service.mjs +0 -199
- package/esm2022/lib/services/request-manager-services/http-manager.service.mjs +0 -207
- package/esm2022/lib/services/request-manager-services/index.mjs +0 -6
- package/esm2022/lib/services/request-manager-services/request-signals.service.mjs +0 -170
- package/esm2022/lib/services/request-manager-services/request.service.mjs +0 -191
- package/esm2022/lib/services/request-manager-services/rxjs-operators/countdown.mjs +0 -9
- package/esm2022/lib/services/request-manager-services/rxjs-operators/delay-retry.mjs +0 -10
- package/esm2022/lib/services/request-manager-services/rxjs-operators/index.mjs +0 -5
- package/esm2022/lib/services/request-manager-services/rxjs-operators/request-polling.mjs +0 -33
- package/esm2022/lib/services/request-manager-services/rxjs-operators/request-streaming.mjs +0 -19
- package/esm2022/lib/services/request-manager-state-service/http-manager-state.store.mjs +0 -360
- package/esm2022/lib/services/request-manager-state-service/index.mjs +0 -3
- package/esm2022/lib/services/request-manager-state-service/models/api-request.model.mjs +0 -21
- package/esm2022/lib/services/request-manager-state-service/models/index.mjs +0 -3
- package/esm2022/lib/services/request-manager-state-service/models/request-options.model.mjs +0 -10
- package/esm2022/lib/services/request-manager-state-service/models/ws-options.model.mjs +0 -12
- package/esm2022/lib/services/utils/app.service.mjs +0 -26
- package/esm2022/lib/services/utils/encryption/asymmetrical-encryption.service.mjs +0 -186
- package/esm2022/lib/services/utils/encryption/encryption-test.service.mjs +0 -35
- package/esm2022/lib/services/utils/encryption/index.mjs +0 -4
- package/esm2022/lib/services/utils/encryption/random.mjs +0 -52
- package/esm2022/lib/services/utils/encryption/symmetrical-encryption.service.mjs +0 -77
- package/esm2022/lib/services/utils/headers.service.mjs +0 -21
- package/esm2022/lib/services/utils/index.mjs +0 -6
- package/esm2022/lib/services/utils/object-merger.service.mjs +0 -70
- package/esm2022/lib/services/utils/path-query.service.mjs +0 -54
- package/esm2022/lib/services/utils/utils.service.mjs +0 -155
- package/esm2022/lib/services/ws-manager-service/models/assortment-data.model.mjs +0 -10
- package/esm2022/lib/services/ws-manager-service/websocket.service.mjs +0 -133
- package/esm2022/public-api.mjs +0 -11
- package/http-request-manager-19.0.0.tgz +0 -0
- package/index.d.ts +0 -5
- package/lib/http-request-manager.module.d.ts +0 -35
- package/lib/http-request-services-demo/database-data-demo/database-data-demo.component.d.ts +0 -19
- package/lib/http-request-services-demo/http-request-services-demo.component.d.ts +0 -32
- package/lib/http-request-services-demo/local-storage-demo/local-storage-demo.component.d.ts +0 -56
- package/lib/http-request-services-demo/local-storage-signals-demo/local-storage-signals-demo.component.d.ts +0 -55
- package/lib/http-request-services-demo/request-manager-demo/file-downloader/download-file/download-file.component.d.ts +0 -26
- package/lib/http-request-services-demo/request-manager-demo/file-downloader/file-download.module.d.ts +0 -13
- package/lib/http-request-services-demo/request-manager-demo/file-downloader/file-downloader.component.d.ts +0 -27
- package/lib/http-request-services-demo/request-manager-demo/file-downloader/models/download-labels-model.d.ts +0 -12
- package/lib/http-request-services-demo/request-manager-demo/file-downloader/spinner/spinner.component.d.ts +0 -16
- package/lib/http-request-services-demo/request-manager-demo/models/sample-ai-prompt.d.ts +0 -8
- package/lib/http-request-services-demo/request-manager-demo/models/sample-client-info.d.ts +0 -14
- package/lib/http-request-services-demo/request-manager-demo/models/sample-mapper-client-info.d.ts +0 -14
- package/lib/http-request-services-demo/request-manager-demo/request-manager-demo.component.d.ts +0 -107
- package/lib/http-request-services-demo/request-manager-state-demo/request-manager-state-demo.component.d.ts +0 -122
- package/lib/http-request-services-demo/request-manager-state-demo/services/state-manager-demo.service.d.ts +0 -15
- package/lib/http-request-services-demo/request-signals-manager-demo/models/sample-ai-prompt.d.ts +0 -8
- package/lib/http-request-services-demo/request-signals-manager-demo/models/sample-client-info.d.ts +0 -14
- package/lib/http-request-services-demo/request-signals-manager-demo/models/sample-mapper-client-info.d.ts +0 -14
- package/lib/http-request-services-demo/request-signals-manager-demo/request-signals-manager-demo.component.d.ts +0 -106
- package/lib/index.d.ts +0 -3
- package/lib/interceptors/credentials.interceptor.d.ts +0 -8
- package/lib/interceptors/index.d.ts +0 -4
- package/lib/interceptors/models/error-settings.model.d.ts +0 -10
- package/lib/interceptors/proxy-debugger.interceptor.d.ts +0 -12
- package/lib/interceptors/request-error.interceptor.d.ts +0 -10
- package/lib/interceptors/request-header.interceptor.d.ts +0 -15
- package/lib/models/config-http-options.model.d.ts +0 -21
- package/lib/models/config-local-storage-options.model.d.ts +0 -13
- package/lib/models/config-options.model.d.ts +0 -12
- package/lib/models/config-token.model.d.ts +0 -8
- package/lib/models/data-type.enum.d.ts +0 -5
- package/lib/models/database-storage.model.d.ts +0 -10
- package/lib/models/index.d.ts +0 -6
- package/lib/models/retry-options.model.d.ts +0 -10
- package/lib/services/database-manager-services/database.manager.service.d.ts +0 -31
- package/lib/services/database-manager-services/db.storage.service.d.ts +0 -26
- package/lib/services/database-manager-services/index.d.ts +0 -3
- package/lib/services/database-manager-services/models/table-schema.d.ts +0 -11
- package/lib/services/index.d.ts +0 -4
- package/lib/services/local-storage-manager-service/index.d.ts +0 -3
- package/lib/services/local-storage-manager-service/local-storage-manager.service.d.ts +0 -86
- package/lib/services/local-storage-manager-service/local-storage-signals-manager.service.d.ts +0 -64
- package/lib/services/local-storage-manager-service/models/global-store-options.model.d.ts +0 -15
- package/lib/services/local-storage-manager-service/models/index.d.ts +0 -5
- package/lib/services/local-storage-manager-service/models/setting-options.model.d.ts +0 -15
- package/lib/services/local-storage-manager-service/models/storage-data.model.d.ts +0 -10
- package/lib/services/local-storage-manager-service/models/storage-option.model.d.ts +0 -13
- package/lib/services/local-storage-manager-service/models/storage-type.enum.d.ts +0 -5
- package/lib/services/request-manager-services/http-manager-signals.service.d.ts +0 -38
- package/lib/services/request-manager-services/http-manager.service.d.ts +0 -41
- package/lib/services/request-manager-services/index.d.ts +0 -4
- package/lib/services/request-manager-services/request-signals.service.d.ts +0 -26
- package/lib/services/request-manager-services/request.service.d.ts +0 -28
- package/lib/services/request-manager-services/rxjs-operators/countdown.d.ts +0 -2
- package/lib/services/request-manager-services/rxjs-operators/delay-retry.d.ts +0 -2
- package/lib/services/request-manager-services/rxjs-operators/index.d.ts +0 -4
- package/lib/services/request-manager-services/rxjs-operators/request-polling.d.ts +0 -2
- package/lib/services/request-manager-services/rxjs-operators/request-streaming.d.ts +0 -2
- package/lib/services/request-manager-state-service/http-manager-state.store.d.ts +0 -64
- package/lib/services/request-manager-state-service/index.d.ts +0 -2
- package/lib/services/request-manager-state-service/models/api-request.model.d.ts +0 -30
- package/lib/services/request-manager-state-service/models/index.d.ts +0 -2
- package/lib/services/request-manager-state-service/models/request-options.model.d.ts +0 -10
- package/lib/services/request-manager-state-service/models/ws-options.model.d.ts +0 -14
- package/lib/services/utils/app.service.d.ts +0 -8
- package/lib/services/utils/encryption/asymmetrical-encryption.service.d.ts +0 -17
- package/lib/services/utils/encryption/encryption-test.service.d.ts +0 -10
- package/lib/services/utils/encryption/index.d.ts +0 -3
- package/lib/services/utils/encryption/random.d.ts +0 -7
- package/lib/services/utils/encryption/symmetrical-encryption.service.d.ts +0 -14
- package/lib/services/utils/headers.service.d.ts +0 -10
- package/lib/services/utils/index.d.ts +0 -5
- package/lib/services/utils/object-merger.service.d.ts +0 -14
- package/lib/services/utils/path-query.service.d.ts +0 -11
- package/lib/services/utils/utils.service.d.ts +0 -24
- package/lib/services/ws-manager-service/models/assortment-data.model.d.ts +0 -10
- package/lib/services/ws-manager-service/websocket.service.d.ts +0 -21
- package/public-api.d.ts +0 -7
package/README.md
CHANGED
|
@@ -1,362 +1,775 @@
|
|
|
1
|
-
|
|
1
|
+
<!-- markdownlint-disable MD013 MD060 -->
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
The HTTPManagerService is a collection of 4 services for HTTP and Local Storage management.
|
|
3
|
+
# HTTP Request Manager - Angular Library
|
|
5
4
|
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
5
|
+
[](https://www.typescriptlang.org/)
|
|
6
|
+
[](https://angular.io/)
|
|
7
|
+
[](https://rxjs.dev/)
|
|
8
|
+
|
|
9
|
+
> **Supported Angular:** 22.x (Angular 22 is the supported baseline. The library also retains the observable/NgRx track for older Angular 14-18 consumers and the signal track for Angular 19+ consumers, but the peer range and the toolchain target Angular 22.)
|
|
10
|
+
|
|
11
|
+
A comprehensive Angular library providing enterprise-grade HTTP request management, state management, real-time communication, and local data persistence.
|
|
12
|
+
|
|
13
|
+
This README is the main documentation hub for the library. Detailed service guides live in `src/docs/`, and this page links to the observable/ngrx services for older Angular applications and the signal-based services for newer Angular applications in parallel.
|
|
14
|
+
|
|
15
|
+
## 🚀 Features
|
|
16
|
+
|
|
17
|
+
### Core Capabilities
|
|
18
|
+
|
|
19
|
+
| Feature | Description | Angular 14-18 / Observable + NgRx | Angular 19+ / Signals |
|
|
20
|
+
|---------|-------------|----------------------------------|------------------------|
|
|
21
|
+
| **🌐 HTTP Request Management** | Retry, polling, streaming, file downloads | [`HTTPManagerService`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/HTTP_MANAGER_README.md) | [`HTTPManagerSignalsService`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/HTTP_SIGNALS_MANAGER_README.md) |
|
|
22
|
+
| **🔄 State Management** | CRUD state, persistence, derived state | [`HTTPManagerStateService`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/HTTP_STATE_MANAGER_README.md) and [`StoreStateManagerService`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/STORE_STATE_MANAGER_README.md) | [`StoreStateManagerSignalsService`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/STORE_STATE_SIGNALS_README.md) |
|
|
23
|
+
| **💬 Real-Time Communication** | WebSocket channels, tracking, messaging | [`WebSocketManagerService`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/WS_MANAGER_README.md), [`WebSocketMessageService`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/WEBSOCKET_MESSAGE_SERVICE.md), and [`MessageTrackerService`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/MESSAGE_TRACKER_README.md) | [`WebSocketSignalsManagerService`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/WEBSOCKET_SIGNALS_README.md) and [`MessageTrackerSignalsService`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/MESSAGE_TRACKER_SIGNALS_README.md) |
|
|
24
|
+
| **💾 Data Persistence** | Local/session storage and offline caching | [`LocalStorageManagerService`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/LOCAL_STORAGE_README.md) and [`DatabaseManagerService`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/DATABASE_README.md) | [`LocalStorageSignalsManagerService`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/LOCAL_STORAGE_SIGNALS_README.md) |
|
|
25
|
+
| **🗄️ Database Queries** | MySQL-syntax SQL queries on IndexedDB — the recommended way to query data | [`DexieSqlService`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/SQL_DIXIE_README.md) | Uses the same service |
|
|
26
|
+
| **⚡ Utility Functions** | JSON handling, encryption, headers, validation, logging | [`UtilsService`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/UTILS_README.md), [`Encryption`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/ENCRYPTION_README.md), [`Logger`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/LOGGER_README.md) | Uses the same utility layer |
|
|
27
|
+
| **🔧 Utility Services** | Headers, path/query, merging, base request classes | [`Utility Services`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/UTILS_SERVICES_README.md) | Internal and helper services |
|
|
28
|
+
|
|
29
|
+
### Key Benefits
|
|
30
|
+
|
|
31
|
+
- ✅ **Type-Safe** - Full TypeScript support with generics
|
|
32
|
+
- ✅ **Offline-First** - Built-in IndexedDB caching
|
|
33
|
+
- ✅ **Real-Time Ready** - Seamless WebSocket integration
|
|
34
|
+
- ✅ **Secure** - AES & RSA encryption support for sensitive data
|
|
35
|
+
- ✅ **Scalable** - ComponentStore-based architecture
|
|
36
|
+
- ✅ **Flexible** - Works with Observables or Signals
|
|
37
|
+
|
|
38
|
+
Note on clearing persisted data:
|
|
39
|
+
|
|
40
|
+
- **Clear full DB (fire-and-forget)**: To wipe the entire IndexedDB for this library and its associated localStorage metadata, call `DatabaseManagerService.clearDatabase()`. This method subscribes internally and is intentionally fire-and-forget — callers should simply call `databaseManager.clearDatabase()` (no `.subscribe()` required). The method also clears related localStorage metadata via `LocalStorageManagerService`.
|
|
41
|
+
- **Clear a specific table (Observable)**: To remove records from a specific table, use `DatabaseManagerService.clearTableRecords(tableName)` which returns an `Observable<void>`; callers should `.subscribe()` or use RxJS operators to react to completion.
|
|
42
|
+
|
|
43
|
+
### �️ Database Access
|
|
44
|
+
|
|
45
|
+
The library provides two complementary services for working with IndexedDB data:
|
|
46
|
+
|
|
47
|
+
| Task | Service | Example |
|
|
48
|
+
|------|---------|---------|
|
|
49
|
+
| **Query data** (recommended) | `DexieSqlService` | `sql.query('SELECT * FROM orders WHERE status = "open"')` |
|
|
50
|
+
| **Create tables** | `DatabaseManagerService` | `db.createDatabaseTable(tableDef)` |
|
|
51
|
+
| **Insert / update records** | `DatabaseManagerService` | `db.createTableRecord('orders', record)` |
|
|
52
|
+
| **Delete records** | `DatabaseManagerService` | `db.deleteTableRecord('orders', id)` |
|
|
53
|
+
| **Clear / reset database** | `DatabaseManagerService` | `db.clearDatabase()` |
|
|
54
|
+
|
|
55
|
+
Use `DexieSqlService` for all read queries — it supports SELECT with WHERE, JOIN, ORDER BY, LIMIT, COUNT, DISTINCT, and more. Use `DatabaseManagerService` for table creation and write operations.
|
|
56
|
+
|
|
57
|
+
See the full SQL syntax reference: [`DexieSqlService Guide`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/SQL_DIXIE_README.md)
|
|
58
|
+
|
|
59
|
+
### �🚀 Advanced Features
|
|
60
|
+
|
|
61
|
+
| Feature | Description | Learn More |
|
|
62
|
+
|---------|-------------|------------|
|
|
63
|
+
| **🔐 Enterprise Encryption** | AES symmetric + RSA asymmetric encryption | [`Encryption Utils`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/ENCRYPTION_README.md) |
|
|
64
|
+
| **🗄️ Database Queries** | MySQL-syntax SQL queries on IndexedDB — the recommended way to query data (SELECT, WHERE, JOIN, ORDER BY, LIMIT, COUNT, DISTINCT) | [`DexieSqlService`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/SQL_DIXIE_README.md) |
|
|
65
|
+
| **📡 Streaming Support** | NDJSON & Server-Sent Events (SSE) | [`HTTP Manager`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/HTTP_MANAGER_README.md#streaming) |
|
|
66
|
+
| **📄 File Downloads** | Progress tracking for large files | [`HTTP Manager`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/HTTP_MANAGER_README.md#file-downloads) |
|
|
67
|
+
| **📤 File Uploads** | Multi-file upload with progress, validation, and form-data config | [`Upload Request`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/UPLOAD_REQUEST_README.md) |
|
|
68
|
+
| **📊 Pagination** | Built-in pagination with page tracking | [`HTTP State Manager`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/HTTP_STATE_MANAGER_README.md#pagination) |
|
|
69
|
+
| **🔔 Smart Notifications** | Persistent notifications with DB storage | [`WebSocket Guide`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/ADVANCED_WEBSOCKET.md#notifications) |
|
|
70
|
+
| **👥 Presence Tracking** | Real-time user presence by channel | [`WebSocket Guide`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/ADVANCED_WEBSOCKET.md#presence) |
|
|
71
|
+
| **🔄 Message Replay** | Automatic message history on reconnect | [`WebSocket Guide`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/ADVANCED_WEBSOCKET.md#message-replay) and [`Message Tracker`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/MESSAGE_TRACKER_README.md) |
|
|
72
|
+
| **🏷️ Channel Architecture** | SYS-, PUB-, MES- channel prefixes | [`WebSocket Guide`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/ADVANCED_WEBSOCKET.md#channels) |
|
|
73
|
+
| **🔌 Singleton WebSocket** | Single connection across ALL instances | [`WebSocket Guide`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/ADVANCED_WEBSOCKET.md#singleton) |
|
|
74
|
+
| **✨ Unified Message Service** | Type-safe WebSocket messaging with auto prefixes | [`WebSocket Message Service`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/WEBSOCKET_MESSAGE_SERVICE.md) |
|
|
75
|
+
| **🚀 Batch Requests** | Execute multiple HTTP requests with sequential/parallel modes | [`Batch Request Guide`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/BATCH_REQUEST_README.md) |
|
|
76
|
+
| **📝 Message Tracking** | Guaranteed delivery with gap detection | [`Message Tracker`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/MESSAGE_TRACKER_README.md) |
|
|
77
|
+
| **🔍 Debug Logging** | Context-aware logging with dev/prod modes | [`Logger Service`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/LOGGER_README.md) |
|
|
78
|
+
|
|
79
|
+
## 📋 Table of Contents
|
|
80
|
+
|
|
81
|
+
- [Quick Start](#-quick-start)
|
|
82
|
+
- [Configuration](#️-configuration)
|
|
83
|
+
- [Services Overview](#-services-overview)
|
|
84
|
+
- [Documentation Paths](#-documentation-paths)
|
|
85
|
+
- [Architecture](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/ARCHITECTURE.md)
|
|
86
|
+
- [Interceptors](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/INTERCEPTOR_README.md)
|
|
87
|
+
- [Advanced Features](#-advanced-features)
|
|
88
|
+
- [Batch Requests](#batch-requests)
|
|
89
|
+
- [Detailed Documentation](#-detailed-documentation)
|
|
90
|
+
- [Demo Examples](#-demo-examples)
|
|
91
|
+
- [Migration Guide](#-migration-guide)
|
|
92
|
+
|
|
93
|
+
## 🚀 Quick Start
|
|
94
|
+
|
|
95
|
+
### Installation & Setup (2 minutes)
|
|
96
|
+
|
|
97
|
+
#### 1. Import Module
|
|
98
|
+
|
|
99
|
+
```typescript
|
|
100
|
+
// app.module.ts
|
|
101
|
+
import { HttpRequestManagerModule } from 'http-request-manager';
|
|
102
|
+
|
|
103
|
+
@NgModule({
|
|
104
|
+
imports: [
|
|
105
|
+
HttpRequestManagerModule.forRoot({
|
|
106
|
+
httpRequestOptions: {
|
|
107
|
+
server: 'http://localhost:8080', // Your API base URL
|
|
108
|
+
retry: { times: 3, delay: 2 },
|
|
109
|
+
displayError: true
|
|
110
|
+
}
|
|
111
|
+
})
|
|
112
|
+
]
|
|
113
|
+
})
|
|
114
|
+
export class AppModule { }
|
|
115
|
+
```
|
|
39
116
|
|
|
40
|
-
|
|
41
|
-
- Allows for Local and Storage management for data Persistence
|
|
42
|
-
- Component Store (NGRX) State for changes on storage
|
|
43
|
-
- Encryption for data
|
|
44
|
-
- Expiry time/date can be set for stores
|
|
117
|
+
#### 2. Provide APP_ID (if using encryption)
|
|
45
118
|
|
|
46
|
-
|
|
119
|
+
```typescript
|
|
120
|
+
// app.module.ts
|
|
121
|
+
import { APP_ID } from '@angular/core';
|
|
47
122
|
|
|
48
|
-
|
|
123
|
+
@NgModule({
|
|
124
|
+
providers: [
|
|
125
|
+
{ provide: APP_ID, useValue: "your-unique-guid-here" }
|
|
126
|
+
]
|
|
127
|
+
})
|
|
128
|
+
export class AppModule { }
|
|
129
|
+
```
|
|
49
130
|
|
|
50
|
-
###
|
|
131
|
+
### Simple Examples
|
|
132
|
+
|
|
133
|
+
#### Basic HTTP Request
|
|
134
|
+
|
|
135
|
+
```typescript
|
|
136
|
+
import { Component, inject } from '@angular/core';
|
|
137
|
+
import { HTTPManagerService, ApiRequest } from 'http-request-manager';
|
|
138
|
+
|
|
139
|
+
@Component({
|
|
140
|
+
selector: 'app-users',
|
|
141
|
+
template: `
|
|
142
|
+
<div *ngIf="isLoading$ | async">Loading...</div>
|
|
143
|
+
<div *ngIf="error$ | async as error" class="error">
|
|
144
|
+
Error: {{ error.message }}
|
|
145
|
+
</div>
|
|
146
|
+
<div *ngFor="let user of data$ | async">
|
|
147
|
+
{{ user.name }}
|
|
148
|
+
</div>
|
|
149
|
+
`
|
|
150
|
+
})
|
|
151
|
+
export class UsersComponent {
|
|
152
|
+
httpManager = inject(HTTPManagerService);
|
|
153
|
+
|
|
154
|
+
data$ = this.httpManager.data$;
|
|
155
|
+
isLoading$ = this.httpManager.isPending$;
|
|
156
|
+
error$ = this.httpManager.error$;
|
|
157
|
+
|
|
158
|
+
ngOnInit() {
|
|
159
|
+
this.httpManager.getRequest(
|
|
160
|
+
ApiRequest.adapt({ path: ['users'], displaySuccess: true, successMessage: 'Loaded users!' })
|
|
161
|
+
).subscribe();
|
|
162
|
+
}
|
|
163
|
+
}
|
|
164
|
+
```
|
|
51
165
|
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
166
|
+
#### State Management with CRUD
|
|
167
|
+
|
|
168
|
+
```typescript
|
|
169
|
+
@Injectable({ providedIn: 'root' })
|
|
170
|
+
export class UsersStore extends HTTPManagerStateService<User> {
|
|
171
|
+
|
|
172
|
+
constructor() {
|
|
173
|
+
super(
|
|
174
|
+
ApiRequest.adapt({
|
|
175
|
+
server: 'http://localhost:8080',
|
|
176
|
+
path: ['users']
|
|
177
|
+
}),
|
|
178
|
+
DataType.ARRAY
|
|
179
|
+
);
|
|
180
|
+
}
|
|
55
181
|
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
182
|
+
// Public API
|
|
183
|
+
loadUsers() { this.fetchRecords(); }
|
|
184
|
+
addUser(user: User) { this.createRecord(user); }
|
|
185
|
+
updateUser(user: User) { this.updateRecord(user); }
|
|
186
|
+
deleteUser(id: number) { this.deleteRecord(id); }
|
|
187
|
+
}
|
|
188
|
+
|
|
189
|
+
// Component
|
|
190
|
+
@Component({
|
|
191
|
+
selector: 'app-users',
|
|
192
|
+
template: `
|
|
193
|
+
<button (click)="store.loadUsers()">Load</button>
|
|
194
|
+
<div *ngFor="let user of store.data$ | async">
|
|
195
|
+
{{ user.name }}
|
|
196
|
+
<button (click)="store.deleteUser(user.id)">Delete</button>
|
|
197
|
+
</div>
|
|
198
|
+
`
|
|
199
|
+
})
|
|
200
|
+
export class UsersComponent {
|
|
201
|
+
store = inject(UsersStore);
|
|
202
|
+
}
|
|
203
|
+
```
|
|
64
204
|
|
|
65
|
-
|
|
205
|
+
### Request Tracking Options (Database Mode)
|
|
66
206
|
|
|
67
|
-
|
|
68
|
-
//Define your API request details using the `ApiRequest` adapter
|
|
69
|
-
const apiOptions = ApiRequest.adapt({
|
|
70
|
-
server: 'myApiUrl/rest/clients' // or ['myApiUrl', 'rest', 'clients']
|
|
71
|
-
})
|
|
207
|
+
`HTTPManagerStateService` supports request tracking options for `fetchRecords` and `fetchStream` when database caching is configured (`DatabaseStorage` provided in the service constructor).
|
|
72
208
|
|
|
73
|
-
|
|
209
|
+
```typescript
|
|
210
|
+
service.fetchRecords(RequestOptions.adapt({
|
|
211
|
+
path: ['ai/pagination?page=0&size=25'],
|
|
212
|
+
ignoreQueryParams: ['page', 'size'],
|
|
213
|
+
queryParamsExpiresIn: '10s'
|
|
214
|
+
}));
|
|
215
|
+
```
|
|
74
216
|
|
|
75
|
-
|
|
76
|
-
.pipe(
|
|
77
|
-
catchError(error => {
|
|
78
|
-
return throwError(() => this.errorHandling(error, 'GET'))
|
|
79
|
-
})
|
|
80
|
-
).subscribe(data => console.log(data)))
|
|
217
|
+
Supported request options:
|
|
81
218
|
|
|
82
|
-
|
|
83
|
-
|
|
219
|
+
- `ignoreQueryParams`: Query keys to track for request-change behavior.
|
|
220
|
+
- `queryParamsExpiresIn`: Expiry window for tracked values (examples: `10s`, `5mn`, `1h`).
|
|
84
221
|
|
|
85
|
-
|
|
86
|
-
In this example, we define the endpoint URL as myApiUrl. This will return the data from the observable for your use case.
|
|
222
|
+
Behavior notes:
|
|
87
223
|
|
|
88
|
-
|
|
224
|
+
- Database enabled (`DatabaseStorage` configured): tracker is active, repeated identical query values are blocked until expiry, then can call API again.
|
|
225
|
+
- Database disabled: tracker is bypassed; requests call the API directly each time.
|
|
226
|
+
- `forceRefresh: true` always forces an API call.
|
|
89
227
|
|
|
90
|
-
|
|
91
|
-
A proxy-config file (recommended to avoid CORS issues).
|
|
92
|
-
A string, an array of strings, or numbers—similar to Angular’s Router.navigate() API.
|
|
93
|
-
The HTTP Service Manager automatically sanitizes the endpoint by removing redundant `/` characters and validating the URL.
|
|
228
|
+
## ⚙️ Configuration
|
|
94
229
|
|
|
95
|
-
|
|
230
|
+
### Module Initialization (`forRoot`)
|
|
96
231
|
|
|
97
|
-
|
|
98
|
-
{ sortBy: 'asc', filter: ['samples', 'testing'] }
|
|
99
|
-
```
|
|
232
|
+
Configure the library globally using the `forRoot` method:
|
|
100
233
|
|
|
101
|
-
|
|
234
|
+
```typescript
|
|
235
|
+
import { HttpRequestManagerModule } from 'http-request-manager';
|
|
102
236
|
|
|
103
|
-
|
|
237
|
+
@NgModule({
|
|
238
|
+
imports: [
|
|
239
|
+
HttpRequestManagerModule.forRoot({
|
|
240
|
+
httpRequestOptions: {
|
|
241
|
+
server: 'https://api.example.com',
|
|
242
|
+
headers: { 'Authorization': 'Bearer token' },
|
|
243
|
+
retry: { times: 3, delay: 2 },
|
|
244
|
+
displayError: true
|
|
245
|
+
},
|
|
246
|
+
LocalStorageOptions: {
|
|
247
|
+
storageName: 'my-app-data',
|
|
248
|
+
storageSettingsName: 'my-app-settings',
|
|
249
|
+
options: {
|
|
250
|
+
encrypted: true,
|
|
251
|
+
expiresIn: '7d'
|
|
252
|
+
}
|
|
253
|
+
}
|
|
254
|
+
})
|
|
255
|
+
]
|
|
256
|
+
})
|
|
257
|
+
export class AppModule { }
|
|
258
|
+
```
|
|
104
259
|
|
|
260
|
+
### Configuration Options
|
|
261
|
+
|
|
262
|
+
#### HTTP Options (`ConfigHTTPOptions`)
|
|
263
|
+
|
|
264
|
+
| Option | Type | Description | Default |
|
|
265
|
+
|--------|------|-------------|---------|
|
|
266
|
+
| `server` | `string` | Base URL for API requests | `''` |
|
|
267
|
+
| `path` | `any[]` | Default path segments | `[]` |
|
|
268
|
+
| `headers` | `any` | Default headers | `{}` |
|
|
269
|
+
| `polling` | `number` | Default polling interval (seconds) | `0` |
|
|
270
|
+
| `retry` | `RetryOptions` | Default retry configuration | `{ times: 0, delay: 3 }` |
|
|
271
|
+
| `stream` | `boolean` | Enable streaming by default | `false` |
|
|
272
|
+
| `displayError` | `boolean` | Show toast errors by default | `false` |
|
|
273
|
+
| `displaySuccess` | `boolean` | Show toast on success by default | `false` |
|
|
274
|
+
| `successMessage` | `string` | Custom success toast message (optional) | `undefined` |
|
|
275
|
+
| `errorMessage` | `string` | Custom error toast message (optional, overrides default) | `undefined` |
|
|
276
|
+
|
|
277
|
+
#### Local Storage Options (`LocalStorageOptions`)
|
|
278
|
+
|
|
279
|
+
| Option | Type | Description | Default |
|
|
280
|
+
|--------|------|-------------|---------|
|
|
281
|
+
| `storageName` | `string` | Key for storing data | `'storage'` |
|
|
282
|
+
| `storageSettingsName` | `string` | Key for settings metadata | `'global-storage'` |
|
|
283
|
+
| `options` | `SettingOptions` | Default storage settings | `{ storage: StorageType.GLOBAL, expires: 0, expiresIn: '', encrypted: false }` |
|
|
284
|
+
|
|
285
|
+
#### Retry Options (`RetryOptions`)
|
|
286
|
+
|
|
287
|
+
| Option | Type | Description | Default |
|
|
288
|
+
|--------|------|-------------|---------|
|
|
289
|
+
| `times` | `number` | Number of retry attempts | `0` |
|
|
290
|
+
| `delay` | `number` | Delay between retries (seconds) | `3` |
|
|
291
|
+
|
|
292
|
+
#### WebSocket Options (`WSOptions`)
|
|
293
|
+
|
|
294
|
+
| Option | Type | Description | Default |
|
|
295
|
+
|--------|------|-------------|---------|
|
|
296
|
+
| `id` | `string` | Channel identifier (used to construct channel names) | `''` |
|
|
297
|
+
| `wsServer` | `string` | WebSocket server URL | `''` |
|
|
298
|
+
| `jwtToken` | `string` | JWT token for authentication | `''` |
|
|
299
|
+
| `permissions` | `string[]` | Permission levels for the connection | `[]` |
|
|
300
|
+
| `channels` | `string[]` | Additional channels to subscribe to | `[]` |
|
|
301
|
+
| `user` | `any` | User information for presence tracking | `undefined` |
|
|
302
|
+
| `retry` | `RetryOptions` | Retry configuration for reconnection | `{ times: 0, delay: 3 }` |
|
|
303
|
+
|
|
304
|
+
### Injection Tokens
|
|
305
|
+
|
|
306
|
+
| Token | Type | Purpose | Required |
|
|
307
|
+
|-------|------|---------|----------|
|
|
308
|
+
| `CONFIG_SETTINGS_TOKEN` | `ConfigOptions` | Global library configuration (provided by `forRoot()`) | Yes (via `forRoot()`) |
|
|
309
|
+
| `APP_ID` | `string` | Unique application ID for encryption key generation | Yes (if using encryption) |
|
|
310
|
+
|
|
311
|
+
### Providing APP_ID
|
|
312
|
+
|
|
313
|
+
If using encryption features (localStorage encryption, AES/RSA encryption), you must provide a unique `APP_ID`:
|
|
314
|
+
|
|
315
|
+
```typescript
|
|
316
|
+
import { APP_ID } from '@angular/core';
|
|
317
|
+
|
|
318
|
+
@NgModule({
|
|
319
|
+
providers: [
|
|
320
|
+
{ provide: APP_ID, useValue: 'your-unique-app-guid-here' }
|
|
321
|
+
]
|
|
322
|
+
})
|
|
323
|
+
export class AppModule { }
|
|
324
|
+
```
|
|
105
325
|
|
|
106
|
-
|
|
326
|
+
> **Important:** The `APP_ID` is used as the encryption key for `SymmetricalEncryptionService`. Use a strong, unique value per application.
|
|
327
|
+
|
|
328
|
+
## 📚 Services Overview
|
|
329
|
+
|
|
330
|
+
### Angular 14-18: Observable + NgRx Services
|
|
331
|
+
|
|
332
|
+
| Service | Description | Use Case |
|
|
333
|
+
|---------|-------------|----------|
|
|
334
|
+
| [`HTTPManagerService`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/HTTP_MANAGER_README.md) | Observable-based HTTP client with retry, polling, streaming | Simple API calls with loading states |
|
|
335
|
+
| [`HTTPManagerStateService`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/HTTP_STATE_MANAGER_README.md) | ComponentStore + HTTP + WebSocket + IndexedDB | CRUD with auto state sync and real-time updates |
|
|
336
|
+
| [`StoreStateManagerService`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/STORE_STATE_MANAGER_README.md) | Persistent ComponentStore with localStorage sync | Application state persistence |
|
|
337
|
+
| [`WebSocketManagerService`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/WS_MANAGER_README.md) | Singleton WebSocket connection manager | Real-time messaging and notifications |
|
|
338
|
+
| [`WebSocketMessageService`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/WEBSOCKET_MESSAGE_SERVICE.md) | Unified type-safe message sending service | Simplified WebSocket messaging with auto prefixes |
|
|
339
|
+
| [`MessageTrackerService`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/MESSAGE_TRACKER_README.md) | Guaranteed message delivery with gap detection | Message tracking and reconnection sync |
|
|
340
|
+
| [`LocalStorageManagerService`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/LOCAL_STORAGE_README.md) | Secure local/session storage with encryption | User preferences and session data |
|
|
341
|
+
| [`DatabaseManagerService`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/DATABASE_README.md) | IndexedDB wrapper via Dexie.js | Offline-first data access |
|
|
342
|
+
|
|
343
|
+
### Angular 19+: Signal-Based Services
|
|
344
|
+
|
|
345
|
+
| Service | Description | Use Case |
|
|
346
|
+
|---------|-------------|----------|
|
|
347
|
+
| [`HTTPManagerSignalsService`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/HTTP_SIGNALS_MANAGER_README.md) | Signal-based HTTP client for modern reactive UI | Modern Angular with Signals |
|
|
348
|
+
| [`LocalStorageSignalsManagerService`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/LOCAL_STORAGE_SIGNALS_README.md) | Signal-based local/session storage | Reactive persisted UI state |
|
|
349
|
+
| [`StoreStateManagerSignalsService`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/STORE_STATE_SIGNALS_README.md) | Signal-based persistent state service | App state persistence with computed derivations |
|
|
350
|
+
| [`WebSocketSignalsManagerService`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/WEBSOCKET_SIGNALS_README.md) | Signal-based WebSocket manager | Signal-driven real-time dashboards and messaging |
|
|
351
|
+
| [`MessageTrackerSignalsService`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/MESSAGE_TRACKER_SIGNALS_README.md) | Signal-based channel/message tracking | Presence, counters, last-message views |
|
|
352
|
+
|
|
353
|
+
### Shared Utilities
|
|
354
|
+
|
|
355
|
+
| Service | Description | Use Case |
|
|
356
|
+
|---------|-------------|----------|
|
|
357
|
+
| [`UtilsService`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/UTILS_README.md) | Utilities: encryption, headers, merging, path/query | Helper functions |
|
|
358
|
+
| [`Utility Services`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/UTILS_SERVICES_README.md) | Headers, path/query, merging, base request classes | Internal and helper services |
|
|
359
|
+
|
|
360
|
+
### Common Use Cases
|
|
361
|
+
|
|
362
|
+
| Use Case | Service to Use | Key Features |
|
|
363
|
+
|----------|---------------|--------------|
|
|
364
|
+
| Simple API calls | `HTTPManagerService` | Observables, retry, polling |
|
|
365
|
+
| Modern reactive UI | `HTTPManagerSignalsService` | Angular Signals |
|
|
366
|
+
| CRUD operations | `HTTPManagerStateService` | Auto state updates, pagination |
|
|
367
|
+
| Real-time chat | `HTTPManagerStateService` + WebSocket | PUB- messaging channels |
|
|
368
|
+
| Persistent notifications | `HTTPManagerStateService` + WebSocket | MES- channels with DB storage |
|
|
369
|
+
| State synchronization | `HTTPManagerStateService` + WebSocket | SYS- private channels |
|
|
370
|
+
| **Unified WebSocket messaging** | **`WebSocketMessageService`** | **Type-safe, auto prefixes, validation** |
|
|
371
|
+
| User preferences | `LocalStorageManagerService` | Encryption, expiration |
|
|
372
|
+
| Offline-first | `DatabaseManagerService` | IndexedDB caching, querying |
|
|
373
|
+
| Large local datasets | `DatabaseManagerService` | Bulk operations, indexing |
|
|
374
|
+
| Secure data storage | `LocalStorageManagerService` | AES encryption |
|
|
375
|
+
| File transfers | `HTTPManagerService` | Download progress tracking |
|
|
376
|
+
| Live data streams | `HTTPManagerService` | NDJSON, SSE streaming |
|
|
377
|
+
|
|
378
|
+
## 📖 Documentation Paths
|
|
379
|
+
|
|
380
|
+
All detailed service guides live in `src/docs/`. Use this README as the entry point, then choose the track that matches the Angular version in your app.
|
|
381
|
+
|
|
382
|
+
### Angular 14-18: Observable + NgRx Track
|
|
383
|
+
|
|
384
|
+
| Category | Documentation |
|
|
385
|
+
|----------|---------------|
|
|
386
|
+
| HTTP | [HTTP Manager](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/HTTP_MANAGER_README.md) |
|
|
387
|
+
| State | [HTTP State Manager](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/HTTP_STATE_MANAGER_README.md) and [Store State Manager](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/STORE_STATE_MANAGER_README.md) |
|
|
388
|
+
| Real-Time | [WebSocket Manager](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/WS_MANAGER_README.md), [WebSocket Message Service](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/WEBSOCKET_MESSAGE_SERVICE.md), and [Message Tracker](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/MESSAGE_TRACKER_README.md) |
|
|
389
|
+
| Persistence | [Local Storage](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/LOCAL_STORAGE_README.md) and [Database](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/DATABASE_README.md) |
|
|
390
|
+
| Utilities | [Utils](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/UTILS_README.md), [Encryption](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/ENCRYPTION_README.md), [Logger](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/LOGGER_README.md) |
|
|
391
|
+
| Reference | [Models](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/MODELS_README.md), [Complete API Reference](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/COMPLETE_API_REFERENCE.md) |
|
|
392
|
+
|
|
393
|
+
### Angular 19+: Signal Track
|
|
394
|
+
|
|
395
|
+
| Category | Documentation |
|
|
396
|
+
|----------|---------------|
|
|
397
|
+
| Overview | [Signal Services Overview](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/SIGNAL_SERVICES_README.md) |
|
|
398
|
+
| HTTP | [HTTP Manager Signals](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/HTTP_SIGNALS_MANAGER_README.md) |
|
|
399
|
+
| State | [Store State Signals](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/STORE_STATE_SIGNALS_README.md) |
|
|
400
|
+
| Real-Time | [WebSocket Signals](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/WEBSOCKET_SIGNALS_README.md) and [Message Tracker Signals](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/MESSAGE_TRACKER_SIGNALS_README.md) |
|
|
401
|
+
| Persistence | [Local Storage Signals](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/LOCAL_STORAGE_SIGNALS_README.md) |
|
|
402
|
+
|
|
403
|
+
## 🏗️ Architecture
|
|
404
|
+
|
|
405
|
+
For detailed system architecture, data flows, and design patterns, see:
|
|
406
|
+
|
|
407
|
+
📋 **[Architecture Documentation](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/ARCHITECTURE.md)**
|
|
408
|
+
|
|
409
|
+
### System Overview
|
|
410
|
+
|
|
411
|
+
```text
|
|
412
|
+
┌─────────────────────────────────────────────────────────────────┐
|
|
413
|
+
│ Angular Application │
|
|
414
|
+
├─────────────────────────────────────────────────────────────────┤
|
|
415
|
+
│ ┌────────────────┐ ┌────────────────┐ ┌──────────────────┐ │
|
|
416
|
+
│ │ Components │ │ Components │ │ Components │ │
|
|
417
|
+
│ │ (Signals) │ │ (Observables) │ │ (State Store) │ │
|
|
418
|
+
│ └───────┬────────┘ └───────┬────────┘ └────────┬─────────┘ │
|
|
419
|
+
│ │ │ │ │
|
|
420
|
+
│ ▼ ▼ ▼ │
|
|
421
|
+
│ ┌──────────────┐ ┌──────────────┐ ┌──────────────────┐ │
|
|
422
|
+
│ │HTTPManager │ │HTTPManager │ │HTTPManager │ │
|
|
423
|
+
│ │SignalsService│ │Service │ │StateService │ │
|
|
424
|
+
│ └──────┬───────┘ └──────┬───────┘ └────────┬─────────┘ │
|
|
425
|
+
│ │ │ │ │
|
|
426
|
+
│ └───────────────────┴──────────────────────┘ │
|
|
427
|
+
│ │ │
|
|
428
|
+
│ ▼ │
|
|
429
|
+
│ ┌─────────────────┐ │
|
|
430
|
+
│ │ HttpClient │ │
|
|
431
|
+
│ │ (Angular) │ │
|
|
432
|
+
│ └────────┬────────┘ │
|
|
433
|
+
│ │ │
|
|
434
|
+
├─────────────────────────────┼───────────────────────────────────┤
|
|
435
|
+
│ │ │
|
|
436
|
+
│ ┌──────────────────────────┼──────────────────────┐ │
|
|
437
|
+
│ │ Storage Layer │ │
|
|
438
|
+
│ ├──────────────────────────┼──────────────────────┤ │
|
|
439
|
+
│ │ ┌────────────────┐ │ ┌─────────────┐ │ │
|
|
440
|
+
│ │ │LocalStorage │ │ │IndexedDB │ │ │
|
|
441
|
+
│ │ │Manager Service │ │ │(Dexie.js) │ │ │
|
|
442
|
+
│ │ └────────────────┘ │ └─────────────┘ │ │
|
|
443
|
+
│ └──────────────────────────┼──────────────────────┘ │
|
|
444
|
+
│ │ │
|
|
445
|
+
│ ┌──────────────────────────┼──────────────────────┐ │
|
|
446
|
+
│ │ WebSocket Layer │ │
|
|
447
|
+
│ ├──────────────────────────┼──────────────────────┤ │
|
|
448
|
+
│ │ ┌─────────────────────────────────────┐ │ │
|
|
449
|
+
│ │ │ WebsocketService │ │ │
|
|
450
|
+
│ │ └─────────────────────────────────────┘ │ │
|
|
451
|
+
│ └─────────────────────────────────────────────────┘ │
|
|
452
|
+
└─────────────────────────────────────────────────────────────────┘
|
|
453
|
+
```
|
|
107
454
|
|
|
108
|
-
|
|
455
|
+
## 🔧 Interceptors
|
|
109
456
|
|
|
110
|
-
|
|
111
|
-
- Similar to the first approach, instead of one instance of the state you are creating a new state instance
|
|
112
|
-
- CRUD operations return Observables, similar to HttpClient.
|
|
113
|
-
- This allows for custom error handling and executing additional actions after the request completes.
|
|
114
|
-
- Since HTTP requests are asynchronous, you must subscribe to the Observable to receive data:
|
|
457
|
+
The library provides several HTTP interceptors that are automatically configured:
|
|
115
458
|
|
|
116
|
-
|
|
117
|
-
myService.getData().subscribe(response => {
|
|
118
|
-
console.log(response);
|
|
119
|
-
});
|
|
120
|
-
```
|
|
459
|
+
📋 **[Interceptors Documentation](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/INTERCEPTOR_README.md)**
|
|
121
460
|
|
|
122
|
-
|
|
461
|
+
### Available Interceptors
|
|
123
462
|
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
463
|
+
| Interceptor | Purpose | Automatically Applied |
|
|
464
|
+
|-------------|---------|----------------------|
|
|
465
|
+
| **RequestErrorInterceptor** | Handles 400/500 errors with toast notifications | ✅ Yes |
|
|
466
|
+
| **RequestHeadersInterceptor** | Adds Content-Type, Accept-Language, Current-Date | ✅ Yes |
|
|
467
|
+
| **CredentialsInterceptor** | Adds `withCredentials: true` for CORS | ✅ Yes |
|
|
468
|
+
| **ProxyDebuggerInterceptor** | Debug logging for development | ⚙️ Configurable |
|
|
127
469
|
|
|
128
|
-
###
|
|
129
|
-
First we need to extend the Component or Service (recommended approach) with the `HTTPManagerService`
|
|
470
|
+
### Manual Configuration
|
|
130
471
|
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
472
|
+
```typescript
|
|
473
|
+
// app.module.ts
|
|
474
|
+
providers: [
|
|
475
|
+
{ provide: HTTP_INTERCEPTORS, useClass: WithCredentialsInterceptor, multi: true },
|
|
476
|
+
{ provide: HTTP_INTERCEPTORS, useClass: RequestHeadersInterceptor, multi: true },
|
|
477
|
+
{ provide: HTTP_INTERCEPTORS, useClass: RequestErrorInterceptor, multi: true }
|
|
478
|
+
]
|
|
479
|
+
```
|
|
134
480
|
|
|
135
|
-
|
|
136
|
-
super()
|
|
137
|
-
}
|
|
138
|
-
}
|
|
139
|
-
```
|
|
481
|
+
### Customization
|
|
140
482
|
|
|
141
|
-
|
|
142
|
-
```ts
|
|
143
|
-
@Injectable({
|
|
144
|
-
providedIn: 'root'
|
|
145
|
-
})
|
|
146
|
-
export class myAPIService extends HTTPManagerService<any> {
|
|
483
|
+
Error handling can be customized with `ErrorSettings`:
|
|
147
484
|
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
}
|
|
485
|
+
```typescript
|
|
486
|
+
import { ErrorSettings } from 'http-request-manager';
|
|
151
487
|
|
|
488
|
+
const customSettings: ErrorSettings = {
|
|
489
|
+
displayError: true,
|
|
490
|
+
displayWarning: true,
|
|
491
|
+
customHandler: (error) => {
|
|
492
|
+
// Custom error handling logic
|
|
152
493
|
}
|
|
153
|
-
|
|
494
|
+
};
|
|
495
|
+
```
|
|
154
496
|
|
|
155
|
-
|
|
497
|
+
## 📚 Detailed Documentation
|
|
156
498
|
|
|
157
|
-
|
|
499
|
+
For in-depth documentation on each service and component, refer to the following detailed guides:
|
|
158
500
|
|
|
159
|
-
|
|
160
|
-
A proxy-config file (recommended to avoid CORS issues).
|
|
161
|
-
A string, an array of strings, or numbers—similar to Angular’s Router.navigate() API.
|
|
162
|
-
The HTTP Service Manager automatically sanitizes the endpoint by removing redundant `/` characters and validating the URL.
|
|
501
|
+
### Detailed Docs for Angular 14-18
|
|
163
502
|
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
503
|
+
| Documentation | Description |
|
|
504
|
+
|---------------|-------------|
|
|
505
|
+
| 📖 [HTTP Manager Service](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/HTTP_MANAGER_README.md) | Observable-based HTTP client with retry, polling, streaming, and error handling |
|
|
506
|
+
| 📖 [HTTP Manager State Service](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/HTTP_STATE_MANAGER_README.md) | ComponentStore integration with automatic CRUD state updates and WebSocket sync |
|
|
507
|
+
| 📖 [Store State Manager Service](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/STORE_STATE_MANAGER_README.md) | Persistent ComponentStore synchronized with local/session storage |
|
|
508
|
+
| 📖 [WebSocket Manager Service](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/WS_MANAGER_README.md) | WebSocket connection management with channel-based messaging and notifications |
|
|
509
|
+
| 📖 [WebSocket Message Service](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/WEBSOCKET_MESSAGE_SERVICE.md) | Type-safe WebSocket message sending with channel prefix helpers |
|
|
510
|
+
| 📖 [Message Tracker Service](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/MESSAGE_TRACKER_README.md) | Guaranteed message delivery with gap detection and reconnection sync |
|
|
511
|
+
| 📖 [Local Storage Manager Service](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/LOCAL_STORAGE_README.md) | Secure local/session storage with encryption and expiration |
|
|
512
|
+
| 📖 [Database Manager Service](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/DATABASE_README.md) | IndexedDB wrapper via Dexie.js with Observable API for offline-first apps |
|
|
513
|
+
| 🚀 [Batch Request Service](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/BATCH_REQUEST_README.md) | Execute multiple HTTP requests with sequential/parallel modes and configurable error handling |
|
|
514
|
+
| 📤 [Upload Request Service](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/UPLOAD_REQUEST_README.md) | Multi-file upload with progress tracking, validation, and form-data configuration |
|
|
515
|
+
| 🔐 [Encryption Utils](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/ENCRYPTION_README.md) | AES symmetric and RSA asymmetric encryption utilities |
|
|
516
|
+
| 📝 [Logger Service](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/LOGGER_README.md) | Context-aware logging with automatic dev/prod mode detection |
|
|
517
|
+
| 📚 [Models Reference](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/MODELS_README.md) | Complete reference for all data models and configuration interfaces |
|
|
518
|
+
|
|
519
|
+
### Detailed Docs for Angular 19+
|
|
520
|
+
|
|
521
|
+
| Documentation | Description |
|
|
522
|
+
|---------------|-------------|
|
|
523
|
+
| 📖 [Signal Services Overview](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/SIGNAL_SERVICES_README.md) | Overview of the signal-based service set and migration guidance |
|
|
524
|
+
| 📖 [HTTP Manager Signals Service](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/HTTP_SIGNALS_MANAGER_README.md) | Signal-based HTTP client for modern reactive UI with Angular Signals |
|
|
525
|
+
| 📖 [Local Storage Signals Manager Service](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/LOCAL_STORAGE_SIGNALS_README.md) | Signal-based persisted storage patterns |
|
|
526
|
+
| 📖 [Store State Signals Manager Service](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/STORE_STATE_SIGNALS_README.md) | Signal-based state persistence and computed state |
|
|
527
|
+
| 📖 [WebSocket Signals Manager Service](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/WEBSOCKET_SIGNALS_README.md) | Signal-driven WebSocket connection and subscription management |
|
|
528
|
+
| 📖 [Message Tracker Signals Service](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/MESSAGE_TRACKER_SIGNALS_README.md) | Signal-based message counting, presence, and channel metadata |
|
|
529
|
+
| 🚀 [Batch Request Service](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/BATCH_REQUEST_README.md) | Execute multiple HTTP requests with sequential/parallel modes and configurable error handling |
|
|
530
|
+
|
|
531
|
+
### Shared Services
|
|
532
|
+
|
|
533
|
+
| Documentation | Description |
|
|
534
|
+
|---------------|-------------|
|
|
535
|
+
| 📖 [Utils Service](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/UTILS_README.md) | Utility functions for JSON handling, encryption, headers, and validation |
|
|
536
|
+
|
|
537
|
+
### Core Components
|
|
538
|
+
|
|
539
|
+
| Documentation | Description |
|
|
540
|
+
|---------------|-------------|
|
|
541
|
+
| 🏗️ [Architecture](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/ARCHITECTURE.md) | System architecture, data flows, and design patterns |
|
|
542
|
+
| 🔧 [Interceptors](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/INTERCEPTOR_README.md) | HTTP interceptors for error handling, headers, authentication, and debugging |
|
|
543
|
+
|
|
544
|
+
### Additional Resources
|
|
545
|
+
|
|
546
|
+
- **Request Manager Services** - Detailed API documentation for the request manager services ([`src/lib/services/request-manager-services/README.md`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/lib/services/request-manager-services/README.md))
|
|
547
|
+
- **Encryption Utils** - Encryption utility documentation ([`src/lib/services/utils/encryption/README.md`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/lib/services/utils/encryption/README.md))
|
|
548
|
+
|
|
549
|
+
## 🎮 Demo Examples
|
|
550
|
+
|
|
551
|
+
Comprehensive demo components showcase all library features in action:
|
|
552
|
+
|
|
553
|
+
### Available Demos
|
|
554
|
+
|
|
555
|
+
Located in [`src/lib/http-request-services-demo/`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/lib/http-request-services-demo/):
|
|
556
|
+
|
|
557
|
+
| Demo Component | Features Demonstrated |
|
|
558
|
+
|----------------|----------------------|
|
|
559
|
+
| **HttpRequestServicesDemoComponent** | Main demo hub with service selection |
|
|
560
|
+
| **RequestManagerDemoComponent** | HTTP CRUD, file downloads, streaming, polling, retry |
|
|
561
|
+
| **RequestManagerStateDemoComponent** | State management, pagination, WebSocket sync, IndexedDB caching |
|
|
562
|
+
| **RequestManagerWsDemoComponent** | Real-time chat, AI messaging, notifications, presence tracking |
|
|
563
|
+
| **LocalStorageDemoComponent** | Encrypted storage, expiration, reactive signals |
|
|
564
|
+
| **LocalStorageSignalsDemoComponent** | Signal-based localStorage API |
|
|
565
|
+
| **DatabaseDataDemoComponent** | IndexedDB CRUD, querying, bulk operations |
|
|
566
|
+
| **RequestSignalsManagerDemoComponent** | Signal-based HTTP with file downloads |
|
|
567
|
+
| **StoreStateManagerDemoComponent** | Persistent state with localStorage sync |
|
|
568
|
+
|
|
569
|
+
### Demo Features
|
|
570
|
+
|
|
571
|
+
**HTTP Service Demos:**
|
|
572
|
+
|
|
573
|
+
- ✅ Basic CRUD operations
|
|
574
|
+
- ✅ File download with progress tracking
|
|
575
|
+
- ✅ Streaming responses (NDJSON, SSE)
|
|
576
|
+
- ✅ Polling with countdown timers
|
|
577
|
+
- ✅ Retry logic with custom delays
|
|
578
|
+
- ✅ Error handling with toast notifications
|
|
579
|
+
|
|
580
|
+
**State Management Demos:**
|
|
581
|
+
|
|
582
|
+
- ✅ ComponentStore integration
|
|
583
|
+
- ✅ Automatic state updates
|
|
584
|
+
- ✅ Pagination controls
|
|
585
|
+
- ✅ WebSocket real-time sync
|
|
586
|
+
- ✅ IndexedDB caching
|
|
587
|
+
- ✅ Database clear/refresh
|
|
588
|
+
|
|
589
|
+
**WebSocket Demos:**
|
|
590
|
+
|
|
591
|
+
- ✅ Channel-based messaging (PUB- channels)
|
|
592
|
+
- ✅ Private state sync (SYS- channels)
|
|
593
|
+
- ✅ Persistent notifications (MES- channels)
|
|
594
|
+
- ✅ User presence tracking
|
|
595
|
+
- ✅ Message history & replay
|
|
596
|
+
- ✅ AI chat integration
|
|
597
|
+
- ✅ Multi-room support
|
|
598
|
+
|
|
599
|
+
**Storage Demos:**
|
|
600
|
+
|
|
601
|
+
- ✅ Encrypted localStorage
|
|
602
|
+
- ✅ SessionStorage usage
|
|
603
|
+
- ✅ Expiration management
|
|
604
|
+
- ✅ Signal-based API
|
|
605
|
+
- ✅ Reactive updates
|
|
606
|
+
|
|
607
|
+
### Usage
|
|
608
|
+
|
|
609
|
+
```html
|
|
610
|
+
<app-http-request-services-demo
|
|
611
|
+
[server]="'http://localhost:8080'"
|
|
612
|
+
[wsServer]="'ws://localhost:8080'"
|
|
613
|
+
[jwtToken]="'your-jwt-token'"
|
|
614
|
+
[adapter]="myAdapterFunction"
|
|
615
|
+
[mapper]="myMapperFunction">
|
|
616
|
+
</app-http-request-services-demo>
|
|
167
617
|
```
|
|
168
|
-
This translates to: `https://apple.com/clients?sortBy=asc&filter=samples,testing`
|
|
169
|
-
|
|
170
|
-
Lets define these query params as a variable called `PARAMS` and use them in the following request.
|
|
171
618
|
|
|
172
|
-
|
|
619
|
+
### Sample Models
|
|
173
620
|
|
|
174
|
-
|
|
175
|
-
In this example take note that the clientID has been passed to the method and the param after the apiOptions allows for further customization for the api request being made. In this case we extended the the base path defined in the `ApiRequest` options. We also added the `PARAMS` for query parameters.
|
|
621
|
+
Demo includes production-ready sample models:
|
|
176
622
|
|
|
177
|
-
|
|
623
|
+
- `User` - User data structures
|
|
624
|
+
- `ClientInfo` - Client details
|
|
625
|
+
- `SessionData` - Session management
|
|
626
|
+
- `AIMessage` - AI chat messages
|
|
627
|
+
- `Notification` - Notification structures
|
|
178
628
|
|
|
179
|
-
|
|
180
|
-
const apiOptions = ApiRequest.adapt({
|
|
181
|
-
server: ['myApiUrl', 'rest', 'clients']
|
|
182
|
-
})
|
|
183
|
-
|
|
184
|
-
// Dynamically change these params
|
|
185
|
-
const PARAMS = {
|
|
186
|
-
sortBy: 'asc',
|
|
187
|
-
filter: ['samples', 'testing']
|
|
188
|
-
}
|
|
629
|
+
## 📖 Migration Guide
|
|
189
630
|
|
|
190
|
-
|
|
631
|
+
### From HttpClient to HTTPManagerService
|
|
191
632
|
|
|
192
|
-
|
|
193
|
-
.pipe(
|
|
194
|
-
catchError(error => {
|
|
195
|
-
return throwError(() => this.errorHandling(error, 'GET'))
|
|
196
|
-
})
|
|
197
|
-
).subscribe(data => console.log(data)))
|
|
633
|
+
**Before:**
|
|
198
634
|
|
|
199
|
-
|
|
200
|
-
|
|
635
|
+
```typescript
|
|
636
|
+
http.get('api/users').subscribe(users => {
|
|
637
|
+
this.users = users;
|
|
638
|
+
this.loading = false;
|
|
639
|
+
});
|
|
640
|
+
```
|
|
201
641
|
|
|
642
|
+
**After:**
|
|
202
643
|
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
644
|
+
```typescript
|
|
645
|
+
httpManager.getRequest(
|
|
646
|
+
ApiRequest.adapt({ path: ['users'] })
|
|
647
|
+
).subscribe();
|
|
207
648
|
|
|
208
|
-
|
|
209
|
-
|
|
649
|
+
data$ = this.httpManager.data$;
|
|
650
|
+
isLoading$ = this.httpManager.isPending$;
|
|
651
|
+
```
|
|
210
652
|
|
|
211
|
-
|
|
212
|
-
The structure would be: Component extends `HTTPManagerService`
|
|
653
|
+
### From Manual State to HTTPManagerStateService
|
|
213
654
|
|
|
214
|
-
|
|
215
|
-
export class RequestManagerDemoComponent extends HTTPManagerService<any> implements OnInit {
|
|
655
|
+
**Before:**
|
|
216
656
|
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
}
|
|
221
|
-
```
|
|
657
|
+
```typescript
|
|
658
|
+
users: User[] = [];
|
|
659
|
+
loading = false;
|
|
222
660
|
|
|
223
|
-
|
|
224
|
-
|
|
661
|
+
loadUsers() {
|
|
662
|
+
this.loading = true;
|
|
663
|
+
this.http.get('api/users').subscribe(users => {
|
|
664
|
+
this.users = users;
|
|
665
|
+
this.loading = false;
|
|
666
|
+
});
|
|
667
|
+
}
|
|
225
668
|
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
})
|
|
230
|
-
|
|
669
|
+
addUser(user: User) {
|
|
670
|
+
this.http.post('api/users', user).subscribe(newUser => {
|
|
671
|
+
this.users = [...this.users, newUser];
|
|
672
|
+
});
|
|
673
|
+
}
|
|
674
|
+
```
|
|
231
675
|
|
|
232
|
-
|
|
233
|
-
super()
|
|
234
|
-
}
|
|
676
|
+
**After:**
|
|
235
677
|
|
|
678
|
+
```typescript
|
|
679
|
+
@Injectable()
|
|
680
|
+
export class UsersStore extends HTTPManagerStateService<User> {
|
|
681
|
+
constructor() {
|
|
682
|
+
super(ApiRequest.adapt({ path: ['users'] }), DataType.ARRAY);
|
|
236
683
|
}
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
Define your API request options using the 'ApiRequest' adapter
|
|
248
|
-
|
|
249
|
-
```ts
|
|
250
|
-
const apiOptions = ApiRequest.adapt({
|
|
251
|
-
server: ['myApiUrl', 'rest', 'clients']
|
|
252
|
-
})
|
|
253
|
-
|
|
254
|
-
// Dynamically change these params
|
|
255
|
-
const PARAMS = {
|
|
256
|
-
sortBy: 'asc',
|
|
257
|
-
filter: ['samples', 'testing']
|
|
258
|
-
}
|
|
259
|
-
|
|
260
|
-
onFetchData(clientId: number) {
|
|
261
|
-
this.httpManagerService.getRequest<any>(apiOptions, [clientId, this.PARAMS]).subscribe()
|
|
262
|
-
}
|
|
263
|
-
```
|
|
264
|
-
|
|
265
|
-
In the above case we are not using the data returning from the Observable but rather executing the api call, like a refresh if called again
|
|
266
|
-
|
|
267
|
-
To access the data from the observable, you need to bind the observable if your using a component that injects the service that extends the `HTTPManagerService`
|
|
268
|
-
|
|
269
|
-
In the component where the service was injected, we define
|
|
684
|
+
|
|
685
|
+
loadUsers() { this.fetchRecords(); }
|
|
686
|
+
addUser(user: User) { this.createRecord(user); }
|
|
687
|
+
}
|
|
688
|
+
|
|
689
|
+
// Component
|
|
690
|
+
data$ = this.usersStore.data$;
|
|
691
|
+
isLoading$ = this.usersStore.isPending$;
|
|
692
|
+
```
|
|
270
693
|
|
|
271
|
-
|
|
272
|
-
data$ = this.clientsService.data$
|
|
273
|
-
isPending$ = this.clientsService.isPending$
|
|
274
|
-
error$ = this.clientsService.error$
|
|
275
|
-
```
|
|
276
|
-
By doing this gives your component the state of the data and other feedback states for the request that now you can use in your template.
|
|
694
|
+
## 📋 API Reference
|
|
277
695
|
|
|
278
|
-
|
|
279
|
-
{{ data$ | async }}
|
|
280
|
-
{{ isPending$ | async }}
|
|
281
|
-
{{ error$ | async }}
|
|
282
|
-
```
|
|
696
|
+
### Core Models
|
|
283
697
|
|
|
698
|
+
All models follow the `<Name>Interface` + `<Name>Model` pattern with static `adapt()` methods.
|
|
284
699
|
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
displayError: boolean
|
|
299
|
-
});
|
|
300
|
-
```
|
|
700
|
+
| Model | Description | Documentation |
|
|
701
|
+
|-------|-------------|---------------|
|
|
702
|
+
| **ApiRequest** | HTTP request configuration | [`Models Guide`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/MODELS_README.md#apirequest) |
|
|
703
|
+
| **RetryOptions** | Retry behavior settings | [`Models Guide`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/MODELS_README.md#retryoptions) |
|
|
704
|
+
| **DataType** | Data structure type (ARRAY, OBJECT) | [`Models Guide`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/MODELS_README.md#datatype) |
|
|
705
|
+
| **DatabaseStorage** | IndexedDB configuration | [`Models Guide`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/MODELS_README.md#databasestorage) |
|
|
706
|
+
| **SettingOptions** | Storage settings | [`Models Guide`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/MODELS_README.md#settingoptions) |
|
|
707
|
+
| **WSOptions** | WebSocket configuration | [`Models Guide`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/MODELS_README.md#wsoptions) |
|
|
708
|
+
| **ConfigOptions** | Global library configuration | [`Models Guide`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/MODELS_README.md#configoptions) |
|
|
709
|
+
| **StateStorageOptions** | Persistent state configuration | [`Models Guide`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/MODELS_README.md#statestorageoptions) |
|
|
710
|
+
| **TableSchemaDef** | Database table schema | [`Models Guide`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/MODELS_README.md#tableschemadef) |
|
|
711
|
+
| **ChannelMessage** | WebSocket message structure | [`Models Guide`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/MODELS_README.md#channelmessage) |
|
|
712
|
+
| **WSUser** | WebSocket user info | [`Models Guide`](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/MODELS_README.md#wsuser) |
|
|
301
713
|
|
|
302
|
-
|
|
303
|
-
|--------------|--------------------------------------------------------------------------------|---------------------------|------------|
|
|
304
|
-
| `server` | The base URL or service endpoint for the API request. | `string` | ✅ |
|
|
305
|
-
| `path` | Additional paths to append to the base URL for constructing the full API endpoint. | `any[]` | ✅ |
|
|
306
|
-
| `headers` | Custom headers to include in the request, provided as an object. | `any` | ✅ |
|
|
307
|
-
| `adapter` | A model adapter used to transform incoming data (e.g., `DistrictData.adapt`). | `any` | ❌ |
|
|
308
|
-
| `mapper` | A model adapter used to map outgoing data before sending it to the server (e.g., `DistrictData.mapper`). | `any` | ❌ |
|
|
309
|
-
| `polling` | Enables periodic polling, where the request will be made every specified number of seconds. | `number` (seconds) | ❌ |
|
|
310
|
-
| `retry` | Retry logic using `RetryOptions`, which includes: <br> - `times`: Number of retry attempts. <br> - `delay`: Delay in milliseconds between retries. | `RetryOptions` | ✅ |
|
|
311
|
-
| `stream` | A flag to indicate whether the request expects a stream of data from the server. | `boolean` | ❌ |
|
|
312
|
-
| `displayError` | A flag to indicate whether to present the error from the request in a snackbar notification. | `boolean` | ✅ |
|
|
714
|
+
### Enums
|
|
313
715
|
|
|
716
|
+
| Enum | Values | Description |
|
|
717
|
+
|------|--------|-------------|
|
|
718
|
+
| **DataType** | `ARRAY`, `OBJECT` | Response data structure |
|
|
719
|
+
| **StreamType** | `NDJSON`, `SSE` | Streaming response types |
|
|
720
|
+
| **StorageType** | `GLOBAL`, `SESSION` | Storage scope |
|
|
721
|
+
| **CommunicationType** | `subscribe`, `unsubscribe`, `message`, `notification`, etc. | WebSocket message types |
|
|
722
|
+
| **ChannelType** | `SYS`, `PUB`, `MES` | Channel prefixes |
|
|
723
|
+
| **ToastColors** | `SUCCESS`, `WARN`, `ERROR`, `INFO` | Toast notification colors |
|
|
314
724
|
|
|
315
|
-
###
|
|
316
|
-
- countdown$: If polling is active, this property gives feedback on when the next request will take place. It starts from the specified time in seconds and counts down to 0, triggering the next request and restarting the countdown.
|
|
317
|
-
- error$: This returns any HTTP error that occurs during the request.
|
|
318
|
-
- isPending$: This boolean value indicates whether the request is pending (true) or has been completed (false).
|
|
319
|
-
- data$: You can access the data fetched in the request using the data$ observable. This provides the response from the server, which can be used for further processing or displaying in the UI.
|
|
725
|
+
### Configuration Tokens
|
|
320
726
|
|
|
321
|
-
|
|
727
|
+
| Token | Type | Purpose |
|
|
728
|
+
|-------|------|---------|
|
|
729
|
+
| **CONFIG_SETTINGS_TOKEN** | `ConfigOptions` | Global library configuration |
|
|
730
|
+
| **APP_ID** | `string` | Application ID for encryption |
|
|
322
731
|
|
|
732
|
+
### Complete API Documentation
|
|
323
733
|
|
|
324
|
-
|
|
734
|
+
For comprehensive API reference with all methods, parameters, and examples:
|
|
735
|
+
📋 **[Complete API Reference](https://github.com/micheleboni/npm-angular/tree/main/projects/http-request-manager/src/docs/COMPLETE_API_REFERENCE.md)**
|
|
325
736
|
|
|
326
|
-
|
|
737
|
+
## 🧩 Angular 22 Support Matrix
|
|
327
738
|
|
|
328
|
-
|
|
739
|
+
This library is published with Angular 22 as the supported baseline. Older Angular tracks remain documented for reference, but the peer dependency range and toolchain target Angular 22.
|
|
329
740
|
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
],
|
|
336
|
-
```
|
|
741
|
+
| Angular Version | Track | Recommended Service |
|
|
742
|
+
|-----------------|-------|---------------------|
|
|
743
|
+
| 14-18 | Observable + NgRx | `HTTPManagerService`, `HTTPManagerStateService`, `WebSocketManagerService` |
|
|
744
|
+
| 19-21 | Signals | `HTTPManagerSignalsService`, `StoreStateManagerSignalsService`, `WebSocketSignalsManagerService` |
|
|
745
|
+
| **22 (supported)** | **Signals (default) + Observable** | **All of the above — module-based bootstrap** |
|
|
337
746
|
|
|
338
|
-
|
|
747
|
+
### Required Toolchain
|
|
339
748
|
|
|
340
|
-
|
|
749
|
+
| Tool | Version |
|
|
750
|
+
|------|---------|
|
|
751
|
+
| Angular | `^22.0.1` |
|
|
752
|
+
| Angular CLI / `@angular-devkit/build-angular` | `^22.0.1` |
|
|
753
|
+
| Angular CDK | `^22.0.1` |
|
|
754
|
+
| Angular Material | `^22.0.1` |
|
|
755
|
+
| `@ngrx/component-store` | `^21.1.1` |
|
|
756
|
+
| `@ngx-translate/core` | `^17.0.0` |
|
|
757
|
+
| TypeScript | `~6.0.0` |
|
|
758
|
+
| Node.js | `>=20.19.0` (Angular 22 CLI requires `>=22.22.3` / `>=24.15.0` / `>=26.0.0`) |
|
|
759
|
+
| `ng-packagr` | `^22.0.0` |
|
|
760
|
+
| RxJS | `~7.8.0` |
|
|
761
|
+
| zone.js | `~0.16.2` |
|
|
341
762
|
|
|
342
|
-
|
|
763
|
+
> The library's `package.json` declares an `engines.node` of `>=20.19.0` to match the Angular 22 toolchain requirements.
|
|
343
764
|
|
|
344
|
-
|
|
765
|
+
## 🤝 Contributing
|
|
345
766
|
|
|
346
|
-
|
|
767
|
+
This library is designed to be enterprise-ready and production-safe. All features include comprehensive error handling, TypeScript support, and extensive configuration options.
|
|
347
768
|
|
|
348
|
-
|
|
349
|
-
{ credentials: true }
|
|
350
|
-
```
|
|
769
|
+
## 📄 License
|
|
351
770
|
|
|
352
|
-
|
|
771
|
+
This project is part of the Angular application library suite.
|
|
353
772
|
|
|
354
|
-
|
|
773
|
+
---
|
|
355
774
|
|
|
356
|
-
|
|
357
|
-
{
|
|
358
|
-
'Content-Type': 'application/json',
|
|
359
|
-
'Accept-Language': this.language || 'en-CA',
|
|
360
|
-
'Current-Date': this.currentDate
|
|
361
|
-
}
|
|
362
|
-
```
|
|
775
|
+
**Need help?** Check out the detailed documentation for each service, explore the demo examples, or review the architecture documentation for implementation guidance.
|