Did some

package-lock.json

@@ -16,6 +16,7 @@
         "@angular/platform-browser": "^14.2.0",
         "@angular/platform-browser-dynamic": "^14.2.0",
         "@angular/router": "^14.2.0",
+        "ngx-clipboard": "^15.1.0",
         "rxjs": "~7.5.0",
         "tslib": "^2.3.0",
         "zone.js": "~0.11.4"
@@ -7916,6 +7917,34 @@
       "integrity": "sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw==",
       "dev": true
     },
+    "node_modules/ngx-clipboard": {
+      "version": "15.1.0",
+      "resolved": "https://registry.npmjs.org/ngx-clipboard/-/ngx-clipboard-15.1.0.tgz",
+      "integrity": "sha512-dUJl1cNtdkCqL953oAhP7wmUPFrqW2aDg5OPhwPU9R3cLEdQgU2NbsHEUz4zaPyEopTXu8SR37onVm1Ep8qOHg==",
+      "dependencies": {
+        "ngx-window-token": ">=6.0.0",
+        "tslib": "^2.0.0"
+      },
+      "peerDependencies": {
+        "@angular/common": ">=13.0.0",
+        "@angular/core": ">=13.0.0"
+      }
+    },
+    "node_modules/ngx-window-token": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/ngx-window-token/-/ngx-window-token-6.0.0.tgz",
+      "integrity": "sha512-IeLKO1jzfzSvZ6vlAt4QSY/B5XcHEhdOwTjqvWEPt6/esWV9T3mA2ln10kj6SCc9pUSx4NybxE10gcyyYroImg==",
+      "dependencies": {
+        "tslib": "^2.0.0"
+      },
+      "engines": {
+        "node": ">=12.20.x"
+      },
+      "peerDependencies": {
+        "@angular/common": ">=13.0.0",
+        "@angular/core": ">=13.0.0"
+      }
+    },
     "node_modules/nice-napi": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/nice-napi/-/nice-napi-1.0.2.tgz",
@@ -17497,6 +17526,23 @@
       "integrity": "sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw==",
       "dev": true
     },
+    "ngx-clipboard": {
+      "version": "15.1.0",
+      "resolved": "https://registry.npmjs.org/ngx-clipboard/-/ngx-clipboard-15.1.0.tgz",
+      "integrity": "sha512-dUJl1cNtdkCqL953oAhP7wmUPFrqW2aDg5OPhwPU9R3cLEdQgU2NbsHEUz4zaPyEopTXu8SR37onVm1Ep8qOHg==",
+      "requires": {
+        "ngx-window-token": ">=6.0.0",
+        "tslib": "^2.0.0"
+      }
+    },
+    "ngx-window-token": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/ngx-window-token/-/ngx-window-token-6.0.0.tgz",
+      "integrity": "sha512-IeLKO1jzfzSvZ6vlAt4QSY/B5XcHEhdOwTjqvWEPt6/esWV9T3mA2ln10kj6SCc9pUSx4NybxE10gcyyYroImg==",
+      "requires": {
+        "tslib": "^2.0.0"
+      }
+    },
     "nice-napi": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/nice-napi/-/nice-napi-1.0.2.tgz",

package.json

@@ -18,6 +18,7 @@
     "@angular/platform-browser": "^14.2.0",
     "@angular/platform-browser-dynamic": "^14.2.0",
     "@angular/router": "^14.2.0",
+    "ngx-clipboard": "^15.1.0",
     "rxjs": "~7.5.0",
     "tslib": "^2.3.0",
     "zone.js": "~0.11.4"

src/app/app.module.ts

@@ -7,7 +7,8 @@ import { AppComponent } from './app.component';
 import { DecryptComponent } from './pages/decrypt/decrypt.component';
 import { EncryptComponent } from './pages/encrypt/encrypt.component';
 import { HttpClient } from "@angular/common/http";
-import {FormsModule} from "@angular/forms";
+import { FormsModule } from "@angular/forms";
+import {ClipboardModule} from "ngx-clipboard";
 
 @NgModule({
   declarations: [
@@ -19,7 +20,8 @@ import {FormsModule} from "@angular/forms";
     BrowserModule,
     AppRoutingModule,
     HttpClientModule,
-    FormsModule
+    FormsModule,
+    ClipboardModule
   ],
   providers: [HttpClient],
   bootstrap: [AppComponent]

src/app/globals/api.ts

@@ -0,0 +1,3 @@
+export const xVault_Token = 'vdk2ch';
+export const xVault_TTL = '25h';
+export const api_endpoint = 'http://vault.vdk2ch.ru:8200/v1/sys/wrapping';

src/app/models/ResponseUnwrap.ts

@@ -1,11 +1,11 @@
-export interface IResponseData {
+export interface IUnwrapped {
   "request_id": string,
   "lease_id": string,
   "lease_duration": number,
   "renewable": boolean,
   "data": {
-    "body": {
+    "dataToWrap": {
-      "token": string
+      First_string: string
     }
   },
   "warnings": null

src/app/models/ResponseWrap.ts

@@ -1,4 +1,4 @@
-export interface IWrap
+export interface IWrapped
 {
     "request_id": string,
     "lease_id": string,

src/app/pages/decrypt/decrypt.component.html

@@ -5,5 +5,5 @@
   <p class="container bs-component" >
     <button (click)="outUnwrap()" class="btn btn-primary btn-lg btn-block" >Отправка токена</button>
   </p>
-  <h3 class="container" *ngIf="receivedValue != ''">Получены данные: {{receivedValue}}</h3>
+  <h3 class="container" *ngIf="displayedResult != ''">Получены данные: {{displayedResult}}</h3>
 </div>

src/app/pages/decrypt/decrypt.component.ts

@@ -1,7 +1,7 @@
 import { Component, OnInit } from '@angular/core';
 import {HttpClient, HttpHeaders} from "@angular/common/http";
-import {IWrap} from "../../models/ResponseToken";
+import {IUnwrapped} from "../../models/ResponseUnwrap";
-import {IResponseData} from "../../models/ResponseData";
+import * as api from "../../globals/api";
 
 @Component({
   selector: 'app-decrypt',
@@ -13,26 +13,31 @@ export class DecryptComponent implements OnInit {
 
   constructor(private http: HttpClient) { }
 
-  api_endpoint: string = 'http://vault.vdk2ch.ru:8200/v1/sys/wrapping/unwrap';
   tokenToSend: string = '';
   response: any
-  receivedValue: string = ''
+  displayedResult: string = ''
 
   outUnwrap(){
 
     this.getUnwrap(this.tokenToSend).subscribe(response => {
       this.response = response.data;
-      this.receivedValue = response.data.body.token;
+      this.displayedResult = response.data.dataToWrap.First_string;
-    })
+    },
+    error => {
+      if(error.status > 200 ) {
+        this.displayedResult = error.error.errors[0];
+      }
+    }
+    )
   }
 
   getUnwrap(token: string){
     let body = new URLSearchParams();
     body.set("token", token)
     let headers: HttpHeaders = new HttpHeaders();
-    headers = headers.append('X-Vault-Token', 'vdk2ch');
+    headers = headers.append('X-Vault-Token', api.xVault_Token);
     headers = headers.append('Content-Type', 'application/x-www-form-urlencoded')
-    return this.http.post<IResponseData>(this.api_endpoint , body, {headers})
+    return this.http.post<IUnwrapped>(api.api_endpoint + '/unwrap' , body, {headers})
   }
 
   ngOnInit(): void {

src/app/pages/encrypt/encrypt.component.html

@@ -1,9 +1,10 @@
 <div class="container">
   <p class="container">
-    <input class="container" type="text" [(ngModel)]="inputed">
+    <input class="container" type="text" [(ngModel)]="userInput">
   </p>
   <p class="container bs-component" >
-    <button  class="btn btn-primary btn-lg btn-block" (click)="outWrap()">Упаковать данные</button>
+    <button  class="btn btn-primary btn-lg btn-block" (click)="outWrap(userInput)">Упаковать данные</button>
   </p>
-  <h3 class="container" *ngIf="tkn != ''">Данные {{inputed}} отправлены. Получен токен: {{tkn}}</h3>
+  <h3 class="container" *ngIf="tokenValue != ''">Данные {{userInput}} отправлены. Получен токен: {{tokenValue}}</h3>
+  <button class="btn btn-primary btn-lg btn-block" *ngIf="tokenValue != ''" ngxClipboard [cbContent]="tokenValue">Скопировать токен в буфер обмена</button>
 </div>

src/app/pages/encrypt/encrypt.component.ts

@@ -1,6 +1,7 @@
 import { Component, OnInit } from '@angular/core';
 import {HttpClient, HttpHeaders} from "@angular/common/http";
-import {IWrap} from "../../models/ResponseToken";
+import {IWrapped} from "../../models/ResponseWrap";
+import * as api from "../../globals/api";
 
 @Component({
   selector: 'app-encrypt',
@@ -9,32 +10,31 @@ import {IWrap} from "../../models/ResponseToken";
 })
 export class EncryptComponent implements OnInit {
 
-  constructor(private http: HttpClient) { }
+  constructor(
+    private http: HttpClient,
+  ) { }
 
-  api_endpoint: string = 'http://vault.vdk2ch.ru:8200/v1/sys/wrapping/wrap';
+  tokenValue: string = '';
-  tkn: string = '';
+  userInput: string = '';
-  inputed: string = '';
+  payloadTemplate = {
+    First_string: ''
+  }
 
-  sampleBody = {
+  outWrap(input: string){
-    'token': ''
+    this.payloadTemplate.First_string = input
-}
+    this.getWrap(this.payloadTemplate).subscribe(response => {
-
+      this.tokenValue = response.wrap_info.token;
-  outWrap(){
-    this.sampleBody.token = this.inputed
-    this.getWrap(this.sampleBody).subscribe(response => {
-      this.tkn = response.wrap_info.token;
     })
   }
 
-  getWrap(body: any){
+  getWrap(dataToWrap: any){
     let headers: HttpHeaders = new HttpHeaders();
-    headers = headers.append('X-Vault-Token', 'vdk2ch');
+    headers = headers.append('X-Vault-Token', api.xVault_Token);
-    headers = headers.append('X-Vault-Wrap-TTL', '25h');
+    headers = headers.append('X-Vault-Wrap-TTL', api.xVault_TTL);
-    return this.http.post<IWrap>(this.api_endpoint , {body}, {headers})
+    return this.http.post<IWrapped>(api.api_endpoint + '/wrap' , {dataToWrap}, {headers})
   }
 
 
-
   ngOnInit(): void {
   }