init commit,

2025-05-28 09:55:51 +08:00
commit efe70ceb69
8042 changed files with 951668 additions and 0 deletions
--- a/99_references/supabase-examples/storage/resumable-upload-uppy/README.md
+++ b/99_references/supabase-examples/storage/resumable-upload-uppy/README.md
@@ -0,0 +1,23 @@
+## Resumable Uploads with Supabase Storage and Uppy
+
+This example shows how to use [Supabase Storage](https://supabase.io/docs/reference/javascript/storage) with [Uppy](https://uppy.io/) to upload files to Supabase Storage using the TUS protocol (resumable uploads).
+
+### Running the example
+
+- Create a supabase bucket from the Supabase UI
+- Add a policy to allow public uploads
+  - e.g. `CREATE POLICY "allow uploads" ON storage.objects FOR INSERT TO public WITH CHECK (bucket_id = 'your-bucket-name');`
+- Open the index.html file and replace the following variables with your own:
+
+```js
+const SUPABASE_ANON_KEY = '' // your project's anon key
+const SUPABASE_PROJECT_ID = '' // your project ref
+const STORAGE_BUCKET = '' // your storage bucket name
+const BEARER_TOKEN = '' // your bearer token
+```
+
+Serve the index.html file locally (e.g. with Python Simple HTTP Server) and start uploading:
+
+```bash
+python3 -m http.server
+```
--- a/99_references/supabase-examples/storage/resumable-upload-uppy/index.html
+++ b/99_references/supabase-examples/storage/resumable-upload-uppy/index.html
@@ -0,0 +1,96 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8" />
+    <title>Resumable Upload Supabase + UppyJS</title>
+    <link href="https://releases.transloadit.com/uppy/v3.6.1/uppy.min.css" rel="stylesheet" />
+
+    <style>
+      html {
+        background: #9e44ef;
+      }
+      body {
+        height: 100vh;
+        background: radial-gradient(72.03% 66.03% at 50% 69.72%, #dbb8bf 0, transparent 100%);
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        flex-direction: column;
+      }
+      a {
+        display: block;
+        margin: 10px;
+        text-decoration: none;
+      }
+      #logo {
+        max-width: 150px;
+      }
+      #drag-drop-area {
+        margin-top: 40px;
+      }
+    </style>
+  </head>
+  <body>
+    <img id="logo" src="supabase-logo-wordmark--dark.png" />
+    <div id="drag-drop-area"></div>
+    <a href="https://supabase.com/docs/guides/storage/uploads/resumable-uploads" target="_blank"
+      >Read the docs.</a
+    >
+
+    <script type="module">
+      import {
+        Uppy,
+        Dashboard,
+        Tus,
+      } from 'https://releases.transloadit.com/uppy/v3.6.1/uppy.min.mjs'
+
+      const SUPABASE_ANON_KEY = 'replace-with-your-anon-key'
+      const SUPABASE_PROJECT_ID = 'replace-with-your-project-id'
+      const STORAGE_BUCKET = 'replace-with-your-bucket-id'
+      const BEARER_TOKEN='replace-with-your-bearer-token'
+
+      const folder = ''
+      const supabaseStorageURL = `https://${SUPABASE_PROJECT_ID}.supabase.co/storage/v1/upload/resumable`
+
+      var uppy = new Uppy()
+        .use(Dashboard, {
+          inline: true,
+          limit: 10,
+          target: '#drag-drop-area',
+          showProgressDetails: true,
+        })
+        .use(Tus, {
+          endpoint: supabaseStorageURL,
+          headers: {
+            authorization: `Bearer ${BEARER_TOKEN}`,
+            apikey: SUPABASE_ANON_KEY,
+          },
+          uploadDataDuringCreation: true,
+          chunkSize: 6 * 1024 * 1024,
+          allowedMetaFields: ['bucketName', 'objectName', 'contentType', 'cacheControl'],
+          onError: function (error) {
+            console.log('Failed because: ' + error)
+          },
+        })
+
+      uppy.on('file-added', (file) => {
+        const supabaseMetadata = {
+          bucketName: STORAGE_BUCKET,
+          objectName: folder ? `${folder}/${file.name}` : file.name,
+          contentType: file.type,
+        }
+
+        file.meta = {
+          ...file.meta,
+          ...supabaseMetadata,
+        }
+
+        console.log('file added', file)
+      })
+
+      uppy.on('complete', (result) => {
+        console.log('Upload complete! We’ve uploaded these files:', result.successful)
+      })
+    </script>
+  </body>
+</html>
--- a/99_references/supabase-examples/storage/resumable-upload-uppy/supabase-logo-wordmark--dark.png
+++ b/99_references/supabase-examples/storage/resumable-upload-uppy/supabase-logo-wordmark--dark.png