Directus API-Key aus Code entfernen

src/app/links.service.ts

@@ -1,29 +1,20 @@
 import { Injectable } from '@angular/core';
-import { HttpClient, HttpHeaders } from '@angular/common/http';
-import { Links } from './links';
+import { HttpClient } from '@angular/common/http';
 import { Observable } from 'rxjs';
-import * as _ from 'lodash';
-
+import { LinksResponse } from './links';        // ← Import ergänzen
 
 @Injectable({
   providedIn: 'root'
 })
 export class LinksService {
 
-  constructor(private http: HttpClient) { }
   private apiUrl = 'http://directus.neugasse.lan/items/landingpage';
-    public apiKey = 'KGjpxZ3tesmhEXHS7C7JbKDyW6YJlgQT';
 
-    httpOptions = {
-      headers: new HttpHeaders({
-        'Authorization': `Bearer ${this.apiKey}`,
-      }),
-    };
-
-    getLinks(): Observable<Links> {
-      return this.http
-        .get<Links>(this.apiUrl, this.httpOptions)
+  httpOptions = {};
 
+  constructor(private http: HttpClient) { }
 
+  getLinks(): Observable<LinksResponse> {       // ← doppeltes g entfernt
+    return this.http.get<LinksResponse>(this.apiUrl);
   }
 }

src/app/links.ts

@@ -6,3 +6,8 @@ export interface Links {
   link: string;
   link_zu_software: string
 }
+
+export type LinkItem = Links;   // ← Alias, kein Breaking Change
+export interface LinksResponse {
+  data: LinkItem[];
+}

src/app/links/links.component.html

@@ -5,7 +5,7 @@
         {{ link.name }}
       </h4>
       <a href="{{ link.link }}" target="_blank" class="card-link">
-        <img src="http://10.0.0.104:8055/assets/{{ link.bild }}?access_token={{ apiKey }}&width=200" alt=" {{ link.name }}" style="width:100px" >
+        <img src="/api/assets/{{ link.bild }}?width=200" alt="{{ link.name }}" style="width:100px">" style="width:100px" >
       </a>
       <div class="card-body">
         <p class="card-text">{{ link.beschreibung }}</p>

src/app/links/links.component.ts

@@ -10,7 +10,7 @@ import { Subscription } from 'rxjs';
 export class LinksComponent implements OnInit {
 
   linkList: any = [];
-  apiKey = this.linkservice.apiKey;
+  //apiKey = this.linkservice.apiKey;
 
   constructor (public linkservice: LinksService) {}
 
@@ -21,7 +21,7 @@ export class LinksComponent implements OnInit {
   getLinks() {
     return this.linkservice.getLinks().subscribe((data: any) => {
       this.linkList = data.data;
-      this.apiKey;
+      //this.apiKey;
       console.log(this.linkList);
 
     });