feat(firebase_storage_web): web support (#3917)

Co-authored-by: ehesp <[email protected]> Co-authored-by: Mike Diarmid <[email protected]>
firebase · Nov 19, 2020 · 2b038be · 2b038be
1 parent 27fc3e2
commit 2b038be
Show file tree

Hide file tree

Showing 43 changed files with 2,177 additions and 30 deletions.
diff --git a/.github/workflows/firebase_storage.yaml b/.github/workflows/firebase_storage.yaml
@@ -63,19 +63,18 @@ jobs:
       - name: "Drive MacOS Example"
         run: ./.github/workflows/scripts/drive-example.sh macos
 
-# TODO: enable once web support lands.
-#  web:
-#    runs-on: ubuntu-latest
-#    timeout-minutes: 15
-#    steps:
-#      - uses: actions/checkout@v1
-#        with:
-#          fetch-depth: 0
-#      - name: "Install Flutter"
-#        run: ./.github/workflows/scripts/install-flutter.sh beta
-#      - name: "Install Tools"
-#        run: |
-#          ./.github/workflows/scripts/install-tools.sh
-#          flutter config --enable-web
-#      - name: "Drive Example"
-#        run: ./.github/workflows/scripts/drive-example.sh web
+  web:
+    runs-on: ubuntu-latest
+    timeout-minutes: 15
+    steps:
+      - uses: actions/checkout@v1
+        with:
+          fetch-depth: 0
+      - name: "Install Flutter"
+        run: ./.github/workflows/scripts/install-flutter.sh beta
+      - name: "Install Tools"
+        run: |
+          ./.github/workflows/scripts/install-tools.sh
+          flutter config --enable-web
+      - name: "Drive Example"
+        run: ./.github/workflows/scripts/drive-example.sh web
diff --git a/README.md b/README.md
@@ -171,7 +171,7 @@ videos. [[Learn More][storage_product]]
 
 | Android | iOS | MacOS | Web |
 |:-------:|:---:|:-----:|:---:|
-|    ✔️    |  ✔️  |   ✔️   |     |
+|    ✔️    |  ✔️  |   ✔️   |  ✔️  |
 
 ----
 

diff --git a/packages/firebase_storage/firebase_storage/example/pubspec.yaml b/packages/firebase_storage/firebase_storage/example/pubspec.yaml
@@ -11,11 +11,6 @@ dependencies:
     path: ../../../firebase_core/firebase_core
   image_picker: ^0.6.7
   image_picker_for_web: ^0.1.0
-  firebase_storage_web:
-    git:
-      url: https://github.com/ditman/flutterfire.git
-      ref: firebase-storage-web
-      path: packages/firebase_storage/firebase_storage_web
 
 dependency_overrides:
   firebase_core:

diff --git a/packages/firebase_storage/firebase_storage/example/web/index.html b/packages/firebase_storage/firebase_storage/example/web/index.html
@@ -2,21 +2,27 @@
 <html>
 <head>
   <meta charset="UTF-8">
-  <title>example</title>
+  <title>Firebase Storage Web Example</title>
 </head>
 <body>
   <script src="https://www.gstatic.com/firebasejs/7.5.0/firebase-app.js"></script>
   <script src="https://www.gstatic.com/firebasejs/7.5.0/firebase-storage.js"></script>
   <script src="https://www.gstatic.com/firebasejs/7.5.0/firebase-analytics.js"></script>
   <script>
-    // Your web app's Firebase configuration
     var firebaseConfig = {
-
+      apiKey: "AIzaSyAgUhHU8wSJgO5MVNy95tMT07NEjzMOfz0",
+      authDomain: "react-native-firebase-testing.firebaseapp.com",
+      databaseURL: "https://react-native-firebase-testing.firebaseio.com",
+      projectId: "react-native-firebase-testing",
+      storageBucket: "react-native-firebase-testing.appspot.com",
+      messagingSenderId: "448618578101",
+      appId: "1:448618578101:web:772d484dc9eb15e9ac3efc",
+      measurementId: "G-0N1G9FLDZE"
     };
-  // Initialize Firebase
-  firebase.initializeApp(firebaseConfig);
-  firebase.analytics();
-</script>
+    // Initialize Firebase
+    firebase.initializeApp(firebaseConfig);
+    firebase.analytics();
+  </script>
   <script src="main.dart.js" type="application/javascript"></script>
 </body>
 </html>

diff --git a/packages/firebase_storage/firebase_storage/pubspec.yaml b/packages/firebase_storage/firebase_storage/pubspec.yaml
@@ -14,12 +14,15 @@ flutter:
         pluginClass: FLTFirebaseStoragePlugin
       macos:
         pluginClass: FLTFirebaseStoragePlugin
+      web:
+        default_package: firebase_storage_web
 
 dependencies:
   flutter:
     sdk: flutter
   firebase_core: ^0.5.2
   firebase_core_platform_interface: ^2.0.0
+  firebase_storage_web: ^0.1.0
   firebase_storage_platform_interface: ^1.0.1
   quiver: ^2.1.3
 

diff --git a/packages/firebase_storage/firebase_storage_web/.gitignore b/packages/firebase_storage/firebase_storage_web/.gitignore
@@ -0,0 +1,7 @@
+.DS_Store
+.dart_tool/
+
+.packages
+.pub/
+
+build/
diff --git a/packages/firebase_storage/firebase_storage_web/.metadata b/packages/firebase_storage/firebase_storage_web/.metadata
@@ -0,0 +1,10 @@
+# This file tracks properties of this Flutter project.
+# Used by Flutter tool to assess capabilities and perform upgrades etc.
+#
+# This file should be version controlled and should not be manually edited.
+
+version:
+  revision: b63970c6815320dfa731a8a329d9118c62244ecc
+  channel: master
+
+project_type: plugin
diff --git a/packages/firebase_storage/firebase_storage_web/CHANGELOG.md b/packages/firebase_storage/firebase_storage_web/CHANGELOG.md
@@ -0,0 +1,3 @@
+## 0.1.0
+
+* Initial open source release.
diff --git a/packages/firebase_storage/firebase_storage_web/LICENSE b/packages/firebase_storage/firebase_storage_web/LICENSE
@@ -0,0 +1,27 @@
+// Copyright 2017 The Chromium Authors. All rights reserved.
+//
+// Redistribution and use in source and binary forms, with or without
+// modification, are permitted provided that the following conditions are
+// met:
+//
+//    * Redistributions of source code must retain the above copyright
+// notice, this list of conditions and the following disclaimer.
+//    * Redistributions in binary form must reproduce the above
+// copyright notice, this list of conditions and the following disclaimer
+// in the documentation and/or other materials provided with the
+// distribution.
+//    * Neither the name of Google Inc. nor the names of its
+// contributors may be used to endorse or promote products derived from
+// this software without specific prior written permission.
+//
+// THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+// "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+// LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+// A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+// OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+// SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+// LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+// DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+// THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+// (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+// OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
diff --git a/packages/firebase_storage/firebase_storage_web/README.md b/packages/firebase_storage/firebase_storage_web/README.md
@@ -0,0 +1,60 @@
+# firebase_storage_web
+
+The web implementation of `firebase_storage`.
+
+## Getting Started
+
+To get started with Firebase Storage, please [see the documentation](https://firebase.flutter.dev/docs/storage/overview)
+available at [https://firebase.flutter.dev](https://firebase.flutter.dev)
+
+Once installed, Firebase Storage needs to be configured for Web Installation.  Please [see the documentation](https://firebase.flutter.dev/docs/storage/overview#3-web-only-add-the-sdk) on Web Installation
+
+To learn more about Firebase Storage, please visit the [Firebase website](https://firebase.google.com/products/storage)
+
+## Downloading files with `getData()`
+
+When using `Reference::getData()` in the web platform, your bucket must have the correct CORS configuration, or the security mechanisms in the browser will *not* let you access the downloaded data, with exceptions similar to:
+
+```
+Access to XMLHttpRequest at 'https://firebasestorage.googleapis.com/v0/b/...example.txt?alt=media&token=1234-4321-1234-4321-12341234' from origin 'http://your-web-app.domain.com:PORT' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
+```
+
+```
+browser_client.dart:87 GET https://firebasestorage.googleapis.com/v0/b/...example.txt?alt=media&token=1234-4321-1234-4321-12341234 net::ERR_FAILED
+```
+
+or
+
+```
+Error: XMLHttpRequest error.
+    dart-sdk/lib/_internal/js_dev_runtime/patch/core_patch.dart 894:28                get current
+packages/http/src/browser_client.dart 84:22                                       <fn>
+```
+
+You need to enable CORS response headers in your Google Cloud Storage Bucket, as described in the following document:
+
+* Firebase > Docs > Guides > [Download Files on Web](https://firebase.google.com/docs/storage/web/download-files).
+
+In the `example` app, ensure there's a `cors.json` file:
+
+```
+firebase_storage/example$ cat cors.json
+[
+  {
+    "origin": ["*"],
+    "method": ["GET"],
+    "maxAgeSeconds": 3600
+  }
+]
+```
+
+And then, with `gsutil`:
+
+```
+firebase_storage/example$ gsutil cors set cors.json gs://my-example-bucket.appspot.com
+Setting CORS on gs://my-example-bucket.appspot.com/...
+```
+
+For much, much more information about CORS in Google Cloud Platform, see:
+
+* Storage products > Cloud Storage > Documentation > [Configuring cross-origin resource sharing (CORS)](https://cloud.google.com/storage/docs/configuring-cors)
diff --git a/packages/firebase_storage/firebase_storage_web/example/.gitignore b/packages/firebase_storage/firebase_storage_web/example/.gitignore
@@ -0,0 +1,46 @@
+# Miscellaneous
+*.class
+*.log
+*.pyc
+*.swp
+.DS_Store
+.atom/
+.buildlog/
+.history
+.svn/
+
+# IntelliJ related
+*.iml
+*.ipr
+*.iws
+.idea/
+
+# The .vscode folder contains launch configuration and tasks you configure in
+# VS Code which you may wish to be included in version control, so this line
+# is commented out by default.
+#.vscode/
+
+# Flutter/Dart/Pub related
+**/doc/api/
+**/ios/Flutter/.last_build_id
+.dart_tool/
+.flutter-plugins
+.flutter-plugins-dependencies
+.packages
+.pub-cache/
+.pub/
+/build/
+
+# Web related
+lib/generated_plugin_registrant.dart
+
+# Symbolication related
+app.*.symbols
+
+# Obfuscation related
+app.*.map.json
+
+# Android Studio will place build artifacts here
+/android/app/debug
+/android/app/profile
+/android/app/release
diff --git a/packages/firebase_storage/firebase_storage_web/example/.metadata b/packages/firebase_storage/firebase_storage_web/example/.metadata
@@ -0,0 +1,10 @@
+# This file tracks properties of this Flutter project.
+# Used by Flutter tool to assess capabilities and perform upgrades etc.
+#
+# This file should be version controlled and should not be manually edited.
+
+version:
+  revision: 8d80592d46db57628ed71e2727b86427a944595b
+  channel: master
+
+project_type: app
diff --git a/packages/firebase_storage/firebase_storage_web/example/README.md b/packages/firebase_storage/firebase_storage_web/example/README.md
@@ -0,0 +1,16 @@
+# example
+
+A new Flutter project.
+
+## Getting Started
+
+This project is a starting point for a Flutter application.
+
+A few resources to get you started if this is your first Flutter project:
+
+- [Lab: Write your first Flutter app](https://flutter.dev/docs/get-started/codelab)
+- [Cookbook: Useful Flutter samples](https://flutter.dev/docs/cookbook)
+
+For help getting started with Flutter, view our
+[online documentation](https://flutter.dev/docs), which offers tutorials,
+samples, guidance on mobile development, and a full API reference.