[#89] Fix error handling of fetch API

fixes #89

Signed-off-by: Knut Ahlers <knut@ahlers.me>

src/app.vue

@@ -260,16 +260,25 @@ export default {
           },
           method: 'POST',
         })
-          .then(resp => resp.json())
-          .then(data => ({ data }))
           .then(resp => {
-            this.secretId = resp.data.secret_id
+            if (resp.status !== 201) {
-            this.secret = ''
+              // Server says "no"
+              this.error = this.$t('alert-something-went-wrong')
+              this.showError = true
+              return
+            }
 
-            // Give the interface a moment to transistion and focus
+            resp.json()
-            window.setTimeout(() => this.$refs.secretUrl.focus(), 100)
+              .then(data => {
+                this.secretId = data.secret_id
+                this.secret = ''
+
+                // Give the interface a moment to transistion and focus
+                window.setTimeout(() => this.$refs.secretUrl.focus(), 100)
+              })
           })
           .catch(err => {
+            // Network error
             this.error = this.$t('alert-something-went-wrong')
             this.showError = true
           }))
@@ -300,34 +309,43 @@ export default {
     // requestSecret requests the encrypted secret from the backend
     requestSecret() {
       fetch(`api/get/${this.secretId}`)
-        .then(resp => resp.json())
-        .then(data => ({ data }))
         .then(resp => {
-          const secret = resp.data.secret
+          if (resp.status === 404) {
-          if (!this.securePassword) {
+            // Secret has already been consumed
-            this.secret = secret
+            this.error = this.$t('alert-secret-not-found')
+            this.showError = true
             return
           }
 
-          crypto.dec(secret, this.securePassword)
+          if (resp.status !== 200) {
-            .then(secret => {
+            // Some other non-200: Something(tm) was wrong
-              this.secret = secret
+            this.error = this.$t('alert-something-went-wrong')
-            })
+            this.showError = true
-            .catch(() => {
+            return
-              this.error = this.$t('alert-something-went-wrong')
+          }
-              this.showError = true
+
+          resp.json()
+            .then(data => {
+              const secret = data.secret
+              if (!this.securePassword) {
+                this.secret = secret
+                return
+              }
+
+              crypto.dec(secret, this.securePassword)
+                .then(secret => {
+                  this.secret = secret
+                })
+                .catch(() => {
+                  this.error = this.$t('alert-something-went-wrong')
+                  this.showError = true
+                })
             })
         })
         .catch(err => {
-          switch (err.response.status) {
+          // Network error
-          case 404:
+          this.error = this.$t('alert-something-went-wrong')
-            this.error = this.$t('alert-secret-not-found')
+          this.showError = true
-            this.showError = true
-            break
-          default:
-            this.error = this.$t('alert-something-went-wrong')
-            this.showError = true
-          }
         })
     },
   },