Git Product home page Git Product logo

barbarbar338 / storage Goto Github PK

View Code? Open in Web Editor NEW
33.0 2.0 1.0 704 KB

๐Ÿ“ฆ A system where you can share your files publicly on the internet. Upload your files and share them with anyone with a permanent url!

Home Page: https://worker.338.rocks

License: GNU General Public License v3.0

TypeScript 100.00%
ts typescript storage file fileupload file-upload file-upload-server supabase supabase-js cloudflare

storage's Introduction

๐Ÿ“ฆ My personal storage

A system where you can share your files publicly on the internet. Upload your files and share them with anyone with a permanent url!

๐ŸŽ Example

https://worker.338.rocks/storage/uploads/images/217324892209676293.png example

๐ŸŽˆ Usage

  • Setup your Supabase storage (see instructions below)
  • Setup your Supabase tables (see instructions below)
  • Setup your Cloudflare Workers (see instructions below)
  • Clone repo
  • Run yarn or npm i
  • Run yarn dev or npm run dev to start development server
  • Run yarn deploy or npm run deploy to deploy project to Cloudflare Workers

โšก๏ธ Supabase Storage Setup

  • Create a bucket called uploads Create Bucket Set Name
  • Create 2 new policies as follows Create Policies Create From Template Enable Read Access To Everyone Click Review Then Save Policy Create Another Policy Update Policy Then Save Policy Now You Are Ready To Go

โšก๏ธ Supabase Tables Setup

  • Create table called urls with these rows:
id: int4 @autoincrement
url: varchar
code: varchar
createdAt: timestampz @now
updatedAt: timestampz @now

URLs Table

  • Create table called bookmarks with these rows:
id: int4 @autoincrement
url: varchar
description: varchar
title: varchar
imageUrl: varchar
createdAt: timestampz @now
updatedAt: timestampz @now

Bookmarks Table

โšก๏ธ Cloudflare Setup

Create these environment variables:

BASE_URL=https://example.com
DISCORD_WEBHOOK_URL=https://discord.com/api/webhooks/id/token
MAX_FILE_SIZE=100000000
PASSWORD=admin
USERNAME=admin
SUPABASE_KEY=YOUR_SUPABASE_KEY
SUPABASE_URL=YOUR_SUPABASE_URL

Variables

๐Ÿงถ Upload file

Here is an example file upload request:

<form id="myForm">
	<input type="file" name="file1" />
	<button type="submit">Submit</button>
</form>
<script>
	const form = document.getElementById("myForm");
	form.addEventListener("submit", (e) => {
		e.preventDefault();

		const formData = new FormData(form);
		fetch("http://localhost:8787/storage/upload", {
			method: "POST",
			body: formData,
			headers: {
				"X-Storage-Username": "YOUR_STORAGE_USERNAME",
				"X-Storage-Password": "YOUR_STORAGE_PASSWORD",
				"Content-Type": "multipart/formdata",
			},
		});
	});
</script>

Example response:

{
	"statusCode": 201,
	"message": "file uploaded",
	"data": "http://localhost:8787/storage/uploads/images/374527004130803712.png"
}

๐Ÿ˜Ž Get file

Send a GET request to storage/uploads/:folder/:file endpoint:

GET http://localhost:8787/storage/uploads/images/137312178217811969.png

๐Ÿ”— Shorten URL

Send a POST request to shorten endpoint:

Also you can add code field to body to shorten url with custom code.

POST http://localhost:8787/shorten
X-Storage-Username: YOUR_STORAGE_USERNAME
X-Storage-Password: YOUR_STORAGE_PASSWORD
Content-Type: application/json

{
	"url": "https://example.com"
}

๐Ÿ“ Get shortened URL

Send a GET request to :code endpoint:

This endpoint will redirect you to the original url.

GET http://localhost:8787/:code

๐Ÿ“• Bookmark

Send a POST request to bookmark endpoint:

POST http://localhost:8787/bookmark
X-Storage-Username: YOUR_STORAGE_USERNAME
X-Storage-Password: YOUR_STORAGE_PASSWORD
Content-Type: application/json

{
	"url": "https://example.com",
	"title": "Example Website",
	"description": "An example website to test things out",
	"imageUrl": "https://via.placeholder.com/150"
}

Example response:

{
	"statusCode": 201,
	"message": "bookmark created",
	"data": {
		"url": "https://example.com",
		"title": "Example Website",
		"description": "An example website to test things out",
		"imageUrl": "https://via.placeholder.com/150"
	}
}

๐Ÿ“— Get Bookmarks

Send a GET request to bookmark/all endpoint:

GET http://localhost:8787/bookmark/all

Example response:

{
	"statusCode": 200,
	"message": "Get all bookmarks",
	"data": [
		{
			"id": 0,
			"url": "https://example.com",
			"title": "Example Website",
			"description": "An example website to test things out",
			"imageUrl": "https://via.placeholder.com/150"
		},
		{
			"id": 1,
			"url": "https://example.com",
			"title": "Example Website",
			"description": "An example website to test things out",
			"imageUrl": "https://via.placeholder.com/150"
		}
	]
}

๐Ÿš€ Using with ShareX

You can use the config file I prepared. Just rename config.sxcu.example to config.sxcu and reconfigure it according to yourself.

๐Ÿคผโ€โ™‚๏ธ Contributing

Feel free to use Github's features

storage's People

Contributors

barbarbar338 avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

Forkers

johndpope

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.