rpuls / medusajs-2.0-for-railway-boilerplate

Monorepo including medusajs 2.0 backend and storefront
https://funkyton.com/medusajs-2-0-is-finally-here/
33 stars 40 forks source link

Adding MinIO storage to existing project launched prior to 21-11-2024 #12

Open rpuls opened 6 days ago

rpuls commented 6 days ago

Long story short, before 21st November 2024 and some weeks backwards, there has been issue with the implementation of the media storage. Therefore, I implemented a more production ready storage system, using a external MinIO bucket instead of @local-file

If you have an older project launched with this template, and you want to add the MinIO storage, follow this guide.

Backend

1. Add the minio storage module Add backend directory: backend/src/modules/minio-file Add all the files and their content from: https://github.com/rpuls/medusajs-2.0-for-railway-boilerplate/tree/master/backend/src/modules/minio-file

2. Add the medusa configuration Replace existing file module with:

    {
      key: Modules.FILE,
      resolve: '@medusajs/file',
      options: {
        providers: [
          ...(MINIO_ENDPOINT && MINIO_ACCESS_KEY && MINIO_SECRET_KEY ? [{
            resolve: './src/modules/minio-file',
            id: 'minio',
            options: {
              endPoint: MINIO_ENDPOINT,
              accessKey: MINIO_ACCESS_KEY,
              secretKey: MINIO_SECRET_KEY,
              bucket: MINIO_BUCKET // Optional, default: medusa-media
            }
          }] : [{
            resolve: '@medusajs/file-local',
            id: 'local',
            options: {
              upload_dir: 'static',
              backend_url: `${BACKEND_URL}/static`
            }
          }])
        ]
      }
    }

3. Install required /bacend dependencies Add the following two dependencies to backend/package.json

"minio": "^8.0.2", and "ulid": "^2.3.0" Your dependencies shuold look like this:

  "dependencies": {
    "@medusajs/admin-sdk": "latest",
    "@medusajs/cli": "latest",
    "@medusajs/core-flows": "latest",
    "@medusajs/framework": "latest",
    "@medusajs/medusa": "latest",
    "@medusajs/notification-sendgrid": "latest",
    "@medusajs/payment-stripe": "latest",
    "@medusajs/types": "latest",
    "@medusajs/utils": "latest",
    "@medusajs/workflow-engine-redis": "latest",
    "@mikro-orm/core": "5.9.7",
    "@mikro-orm/knex": "5.9.7",
    "@mikro-orm/migrations": "5.9.7",
    "@mikro-orm/postgresql": "5.9.7",
    "@react-email/components": "^0.0.26",
    "awilix": "^8.0.1",
    "express": "^4.21.1",
    "medusajs-launch-utils": "^0.0.5",
    "minio": "^8.0.2",
    "pg": "^8.13.0",
    "resend": "4.0.1",
    "ulid": "^2.3.0"
  },

Replace /backend/pnpm-lock.yaml with the content of https://github.com/rpuls/medusajs-2.0-for-railway-boilerplate/blob/master/backend/pnpm-lock.yaml to ensure exact dependency versions.

4. Add the MinIO services in Railway We are aiming for this layout: image

First Click "add new" choose "Docker Image", search of: minio/minio:latest image

Once it added, change variables:

PORT="${{MINIO_PRIVATE_PORT}}"
MINIO_ROOT_USER="${{ secret(14) }}"
MINIO_PUBLIC_HOST="${{RAILWAY_PUBLIC_DOMAIN}}"
MINIO_PUBLIC_PORT="443"
MINIO_PRIVATE_HOST="${{RAILWAY_PRIVATE_DOMAIN}}"
MINIO_PRIVATE_PORT="9000"
MINIO_ROOT_PASSWORD="${{ secret(32) }}"
MINIO_PUBLIC_ENDPOINT="https://${{MINIO_PUBLIC_HOST}}:${{MINIO_PUBLIC_PORT}}"
MINIO_PRIVATE_ENDPOINT="http://${{MINIO_PRIVATE_HOST}}:${{MINIO_PRIVATE_PORT}}"
MINIO_BROWSER_REDIRECT_URL="https://${{Console.RAILWAY_PUBLIC_DOMAIN}}"

Change name of service to Bucket Then go to settings and modify the start command: /bin/sh -c "exec minio server --address [::]:$MINIO_PRIVATE_PORT $RAILWAY_VOLUME_MOUNT_PATH" Modify health check path: /minio/health/ready Make sure Networking is set to HTTP

Once finished, it should look like this: image

Finally, left click on the Bucket container on the cavas and attach a storage volume. Set the mount path to /data Under the service should appear a little disk icon followed by /data - (see first image of the layout)

5. Update Backend variables: Add the following:

MINIO_ACCESS_KEY="${{Bucket.MINIO_ROOT_USER}}"
MINIO_SECRET_KEY="${{Bucket.MINIO_ROOT_PASSWORD}}"

Now you should see an arrow from the backend Container pointing to the Bucket container.

storefront

1. add Bucket URL to next image remote path

      ...(process.env.NEXT_PUBLIC_MINIO_ENDPOINT ? [{
        protocol: "https",
        hostname: process.env.NEXT_PUBLIC_MINIO_ENDPOINT,
      }] : []),

Verify that it looks identical to: https://github.com/rpuls/medusajs-2.0-for-railway-boilerplate/blob/master/storefront/next.config.js

2. Add Bucket url to Railway storefront service variables: NEXT_PUBLIC_MINIO_ENDPOINT="${{Bucket.MINIO_PUBLIC_HOST}}" Once this is added, you shuold see an arrow from the storefront container pointing to the Bucket container

Optionally, add Bucket console (web interface for your bucket media)

1. Add service In Railway, once again click "add new", this time choose "github repo" Enter git url: https://github.com/railwayapp-templates/minio-console image

2. Add variables

PORT="9090"
PASSWORD="${{Bucket.MINIO_ROOT_PASSWORD}}"
USERNAME="${{Bucket.MINIO_ROOT_USER}}"
CONSOLE_MINIO_SERVER="${{Bucket.MINIO_PRIVATE_ENDPOINT}}"

Once these are set, you should see the final arrow, from the Console container to the Bucker container

3. configure settings Make sure Networking it is set to HTTP Change name to Console Change start command to: /bin/sh -c "exec console server --host 0.0.0.0 --port $PORT" Change healthcheck endpoint to: /login image

Apply changes

Click deploy changes in Railway Push Git changes

Tyerlo commented 3 days ago

I had some problems finding the bucket on local environment, but I added domains inside next.config.js

images: { domains: [

], }