add authentication token for image server, change default image server to localhost

.env.development

@@ -2,3 +2,4 @@
 
 # this won't resolve as a URL on production; it's a URN only found in the test system
 VUE_APP_BVC_MEETUPS_PROJECT_CLAIM_ID=https://endorser.ch/entity/01HNTZYJJXTGT0EZS3VEJGX7AK
+VUE_APP_DEFAULT_IMAGE_API_SERVER=http://localhost:3001

src/views/GiftedPhoto.vue

@@ -39,6 +39,10 @@ import Camera from "simple-vue-camera";
 import { Component, Vue } from "vue-facing-decorator";
 
 import { DEFAULT_IMAGE_API_SERVER } from "@/constants/app";
+import { getIdentity } from "@/libs/util";
+import { db } from "@/db/index";
+import { MASTER_SETTINGS_KEY, Settings } from "@/db/tables/settings";
+import { accessToken } from "@/libs/crypto";
 
 interface Notification {
   group: string;
@@ -51,8 +55,29 @@ interface Notification {
 export default class GiftedPhoto extends Vue {
   $notify!: (notification: Notification, timeout?: number) => void;
 
+  activeDid = "";
   localImageUrl: string | null = null;
 
+  async mounted() {
+    try {
+      await db.open();
+      const settings = (await db.settings.get(MASTER_SETTINGS_KEY)) as Settings;
+      this.activeDid = settings?.activeDid || "";
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    } catch (err: any) {
+      console.error("Error retrieving settings from database:", err);
+      this.$notify(
+        {
+          group: "alert",
+          type: "danger",
+          title: "Error",
+          text: err.message || "There was an error retrieving your settings.",
+        },
+        -1,
+      );
+    }
+  }
+
   async storeImage(/* payload: MouseEvent */) {
     const cameraComponent = this.$refs.camera as InstanceType<typeof Camera>;
     const blob = await cameraComponent?.snapshot();
@@ -69,12 +94,18 @@ export default class GiftedPhoto extends Vue {
       return;
     }
 
+    const identifier = await getIdentity(this.activeDid);
+    const token = await accessToken(identifier);
+    const headers = {
+      Authorization: "Bearer " + token,
+    };
     const formData = new FormData();
     formData.append("image", blob, "snapshot.jpg");
     try {
       const response = await axios.post(
         DEFAULT_IMAGE_API_SERVER + "/image",
         formData,
+        { headers },
       );
 
       console.log("Sent. Response:", response.data);

src/views/ProjectViewView.vue

@@ -437,15 +437,6 @@ export default class ProjectViewView extends Vue {
     return identity;
   }
 
-  public async getHeaders(identity: IIdentifier) {
-    const token = await accessToken(identity);
-    const headers = {
-      "Content-Type": "application/json",
-      Authorization: "Bearer " + token,
-    };
-    return headers;
-  }
-
   onEditClick() {
     localStorage.setItem("projectId", this.projectId as string);
     const route = {