Dev (#1357)

* Added service worker fallback * Fix comment, added missing await * Moving offline check into separate proc * PWABuilder MacOS v2 (#1286) * env change * added macos platform code usage, need to work through a CORS issue. * zipAll from axios to fetch (#1289) Co-authored-by: Justin Willis <jgw9617@gmail.com> * Refactored score cards. Added additional checks. * Added service worker fallback (#1284) * Added service worker fallback * Fix comment, added missing await * Moving offline check into separate proc * Refactored score cards. Added additional checks. * fix(): small typescript error * chore(): update docker container to node 12 * Update featured.json (#1295) Fix a typo! Co-authored-by: Leonardo Lee <lee.leonardo.king@gmail.com> * Casing fix. Removed unused CSS build warnings * Fix for build (#1306) * Added service worker fallback * Fix comment, added missing await * Moving offline check into separate proc * Refactored score cards. Added additional checks. * Casing fix. Removed unused CSS build warnings * fix(): sw picker form has min-height to avoid "pop-in" * refactor(): move to new service worker server + simplify * v2 web packaging (#1301) * v2 web packaging * for documentation sake, but something for the future * new endpoints Co-authored-by: Justin Willis <jgw9617@gmail.com> * Added safe URL fetching fallback (#1315) * Added safe URL fetching fallback * Better service name * Fix for #1336 (#1344) * Initial work towards nav fix * Added UI for Play billing, location delegation (#1346) * Final fix for edit manifest nav Co-authored-by: Judah Gabriel Himango <judahgabriel@gmail.com> Co-authored-by: Leonardo Lee <lee.leonardo.king@gmail.com> Co-authored-by: Roman Rokon <rokon.rxr@gmail.com>
pwa-builder · Jan 11, 2021 · 6a94851 · 6a94851
1 parent b74f5d6
commit 6a94851
Show file tree

Hide file tree

Showing 32 changed files with 1,497 additions and 2,496 deletions.
diff --git a/assets/scss/base/_globals.scss b/assets/scss/base/_globals.scss
diff --git a/assets/scss/base/_variables.scss b/assets/scss/base/_variables.scss
@@ -49,4 +49,4 @@ $media-screen-xxxl: 120em; // 1920px
 
 // Variables for mixins
 $medias: xxs, xs, s, m, l, xl, xxl, xxxl;
-$mediavalues: $media-screen-xxs, $media-screen-xs, $media-screen-s, $media-screen-m, $media-screen-l, $media-screen-xl, $media-screen-xxl, $media-screen-xxxl;
+$mediavalues: $media-screen-xxs, $media-screen-xs, $media-screen-s, $media-screen-m, $media-screen-l, $media-screen-xl, $media-screen-xxl, $media-screen-xxxl;
diff --git a/components/Download.vue b/components/Download.vue
@@ -131,9 +131,19 @@ export default class extends Vue {
         });
       } else {
         const responseText = await response.text();
-        this.showErrorMessage(
-          `Error generating Android package.\n\nStatus code: ${response.status}\n\nError: ${response.statusText}\n\nDetails: ${responseText}`
-        );
+        
+        // Did it fail because images couldn't be fetched with ECONNREFUSED? E.g. https://github.com/pwa-builder/PWABuilder/issues/1312
+        // If so, retry using our downloader proxy service.
+        const hasSafeImages = this.androidOptions.iconUrl && this.androidOptions.iconUrl.includes(process.env.safeUrlFetcher || "");
+        if (!hasSafeImages && responseText && responseText.includes("ECONNREFUSED")) {
+          console.warn("Android package generation failed with ECONNREFUSED. Retrying with safe images.", responseText);
+          this.updateAndroidOptionsWithSafeUrls(this.androidOptions);
+          await this.generateAndroidPackage();
+        } else {
+          this.showErrorMessage(
+            `Error generating Android package.\n\nStatus code: ${response.status}\n\nError: ${response.statusText}\n\nDetails: ${responseText}`
+          );
+        }
       }
     } catch (err) {
       this.showErrorMessage(
@@ -193,6 +203,66 @@ export default class extends Vue {
     }
   }
 
+  public async generateMacOSPackage() {
+    this.message$ = 'Generating...';
+    this.isReady = false;
+    try {
+      const response = await fetch(`${process.env.macosPackageGeneratorUrl}?siteUrl=${this.siteHref}`, {
+        method: "POST",
+        body: JSON.stringify(this.manifest),
+        headers: new Headers({
+          "content-type": "application/json"
+        })
+      });
+      if (response.status === 200) {
+        const data = await response.blob();
+        const url = window.URL.createObjectURL(data);
+        window.location.assign(url);
+        setTimeout(() => (this.isReady = true), 3000);
+      } else {
+        const responseText = await response.text();
+        this.showErrorMessage(
+          `Failed. Status code ${response.status}, Error: ${response.statusText}, Details: ${responseText}`
+        )
+      }
+    } catch (error) {
+      this.showErrorMessage("Failed. Error: " + error);
+      this.message$ = this.message;
+    } finally {
+      this.isReady = true;
+    }
+  }
+
+  public async generateWebPackage() {
+    this.message$ = "Generating...";
+    this.isReady = false;
+    try {
+      const response = await fetch(`${process.env.webPackageGeneratorUrl}?siteUrl=${this.siteHref}&hasServiceWorker=${false}`, {
+        method: "POST",
+        body: JSON.stringify(this.manifest),
+        headers: new Headers({
+          "content-type": "application/json"
+        })
+      });
+      if (response.status === 200) {
+        const data = await response.blob();
+        const url = window.URL.createObjectURL(data);
+        window.location.assign(url);
+        setTimeout(() => (this.isReady = true), 3000);
+      } else {
+        const responseText = await response.text();
+        this.showErrorMessage(
+          `Failed. Status code ${response.status}, Error: ${response.statusText}, Details: ${responseText}`
+        )
+      }
+    } catch (error) {
+      this.showErrorMessage("Failed. Error: " + error);
+      this.message$ = this.message;
+    } finally {
+      this.isReady = true;
+    }
+  }
+
   public async buildArchive(
     platform: string,
     parameters: string[]
@@ -201,12 +271,16 @@ export default class extends Vue {
       return;
     }
 
-    if (platform === "androidTWA") {
+    if (platform === "web") {
+      await this.generateWebPackage();
+    } else if (platform === "androidTWA") {
       await this.generateAndroidPackage();
     } else if (platform === "windows10") {
       await this.generateWindowsPackage("spartan");
     } else if (platform === "windows10new") {
       await this.generateWindowsPackage("anaheim");
+    } else if (platform === "macos") {
+      await this.generateMacOSPackage();
     } else {
       try {
         this.isReady = false;
@@ -252,6 +326,24 @@ export default class extends Vue {
       platform: this.platform,
     });
   }
+
+  private updateAndroidOptionsWithSafeUrls(options: publish.AndroidApkOptions): publish.AndroidApkOptions {
+    const absoluteUrlProps: Array<keyof publish.AndroidApkOptions> = [
+      "maskableIconUrl",
+      "monochromeIconUrl",
+      "iconUrl",
+      "webManifestUrl",
+    ];
+    for (let prop of absoluteUrlProps) {
+      const url = options[prop];
+      if (url && typeof url === "string") {
+        const safeUrl = `${process.env.safeUrlFetcher}?url=${encodeURIComponent(url)}`;
+        (options as any)[prop] = safeUrl;
+      }
+    }
+
+    return options;
+  }
 }
 
 declare var awa: any;