Strapi Provider Upload IPFS Storage
IPFS (Filebase, Pinata, Fleek, Web3, Lighthouse) provider for Strapi uploads.
Installation
# using yarn
yarn add strapi-provider-upload-ipfs-storage
# using npm
npm install strapi-provider-upload-ipfs-storage --saveProviders Configuration
./config/plugins.js
module.exports = ({ env }) => ({
// ...
upload: {
config: {
provider: "strapi-provider-upload-ipfs-storage",
providerOptions: {
defaultStorage: "filebase",
filebase: {
// https://console.filebase.com/keys
key: env("FILEBASE_KEY"),
secret: env("FILEBASE_SECRET"),
bucket: env("FILEBASE_BUCKET"),
},
pinata: {
// https://app.pinata.cloud/keys
jwt: env("PINATA_JWT"),
},
fleek: {
// https://app.fleek.co/#/settings/general/profile
key: env("FLEEK_KEY"),
secret: env("FLEEK_SECRET"),
bucket: env("FLEEK_BUCKET"),
},
web3: {
// https://web3.storage/tokens/
token: env("WEB3_TOKEN"),
},
lighthouse: {
// https://files.lighthouse.storage/dashboard/apikey
token: env("LIGHTHOUSE_TOKEN"),
},
},
},
},
// ...
});.env
FILEBASE_KEY=""
FILEBASE_SECRET=""
FILEBASE_BUCKET=""
PINATA_JWT=""
FLEEK_KEY=""
FLEEK_SECRET=""
FLEEK_BUCKET=""
WEB3_TOKEN=""
LIGHTHOUSE_TOKEN=""Configuration Strapi + Filebase [ tutorial ]
| Variable | Type | Description | Required |
|---|---|---|---|
| key | string | Filebase access key | yes |
| secret | string | Filebase access secret | yes |
| bucket | string | Filebase bucket name | yes |
module.exports = ({ env }) => ({
// ...
upload: {
config: {
provider: "strapi-provider-upload-ipfs-storage",
providerOptions: {
defaultStorage: "filebase",
filebase: {
// https://console.filebase.com/keys
key: env("FILEBASE_KEY"),
secret: env("FILEBASE_SECRET"),
bucket: env("FILEBASE_BUCKET"),
},
},
},
},
// ...
});Configuration Strapi + Pinata
| Variable | Type | Description | Required |
|---|---|---|---|
| jwt | string | Pinata JWT (Secret access token) | yes |
module.exports = ({ env }) => ({
// ...
upload: {
config: {
provider: "strapi-provider-upload-ipfs-storage",
providerOptions: {
defaultStorage: "pinata",
pinata: {
// https://app.pinata.cloud/keys
jwt: env("PINATA_JWT"),
},
},
},
},
// ...
});Configuration Strapi + Fleek
| Variable | Type | Description | Required |
|---|---|---|---|
| key | string | Fleek Storage API key | yes |
| secret | string | Fleek Storage API secret | yes |
| bucket | string | Fleek bucket name (e.g. 71a...-bucket) | yes |
module.exports = ({ env }) => ({
// ...
upload: {
config: {
provider: "strapi-provider-upload-ipfs-storage",
providerOptions: {
defaultStorage: "fleek",
fleek: {
// https://app.fleek.co/#/settings/general/profile
key: env("FLEEK_KEY"),
secret: env("FLEEK_SECRET"),
bucket: env("FLEEK_BUCKET"),
},
},
},
},
// ...
});Configuration Strapi + Web3
| Variable | Type | Description | Required |
|---|---|---|---|
| token | string | Web3 Storage API Token | yes |
module.exports = ({ env }) => ({
// ...
upload: {
config: {
provider: "strapi-provider-upload-ipfs-storage",
providerOptions: {
defaultStorage: "web3",
web3: {
// https://web3.storage/tokens/
token: env("WEB3_TOKEN"),
},
},
},
},
// ...
});Configuration Strapi + Lighthouse
| Variable | Type | Description | Required |
|---|---|---|---|
| token | string | Lighthouse Storage API Token | yes |
module.exports = ({ env }) => ({
// ...
upload: {
config: {
provider: "strapi-provider-upload-ipfs-storage",
providerOptions: {
defaultStorage: "lighthouse",
lighthouse: {
// https://files.lighthouse.storage/dashboard/apikey
token: env("LIGHTHOUSE_TOKEN"),
},
},
},
},
// ...
});Security Middleware Configuration
Due to the default settings in the Strapi Security Middleware you will need to modify the contentSecurityPolicy settings to properly see thumbnail previews in the Media Library. You should replace strapi::security string with the object bellow instead as explained in the middleware configuration documentation.
./config/middlewares.js
module.exports = [
// ...
{
name: "strapi::security",
config: {
contentSecurityPolicy: {
useDefaults: true,
directives: {
"connect-src": ["'self'", "https:"],
"img-src": [
"'self'",
"data:",
"blob:",
"dl.airtable.com",
"*.ipfs.dweb.link", // ipfs.tech
"*.ipfs.cf-ipfs.com", // cloudflare.com
"*.ipfs.w3s.link", // web3.storage
],
"media-src": [
"'self'",
"data:",
"blob:",
"dl.airtable.com",
"*.ipfs.dweb.link", // ipfs.tech
"*.ipfs.cf-ipfs.com", // cloudflare.com
"*.ipfs.w3s.link", // web3.storage
],
upgradeInsecureRequests: null,
},
},
},
},
// ...
];Links
- Strapi website
- IPFS website
- Filebase website
- Pinata website
- Fleek website
- Web3 website
- Lighthouse website
(c) Alex Baker
