Simplify your stack and build anything. Or everything.
Build tomorrow’s web with a modern solution you truly own.
Code-based nature means you can build on top of it to power anything.
It’s time to take back your content infrastructure.

Files correctly uploaded to S3 but URL still pointing to localhost

default discord avatar
nicolaslairlast year
4

I have configured the cloud storage plugin with S3, so files are uploaded to S3 - but the S3 URL is not used to download the files - I can't seem to find any information on why this is happening.



This is the payload config:



plugins: [ cloudStorage({ collections: { 'notes': { adapter: s3Adapter({ config: { forcePathStyle: true, region: process.env.S3_REGION, credentials: { accessKeyId: process.env.S3_ACCESS_KEY_ID, secretAccessKey: process.env.S3_SECRET_ACCESS_KEY, }, }, bucket: process.env.S3_BUCKET, }) }, }, }), ],

I am using AWS S3 not the endpoint should not provided...


In the 'Notes' collection - the disableLocalStorage boolean is set to true:



slug: 'notes', upload: { disableLocalStorage: true },

The url of the uploaded file is still "

http://localhost:3000/notes/43_s_rockbass.mp3

" but instead it should point to the corresponding S3 bucket - the file is uploaded on S3 - the problem is just the URL.



I guess I am missing a config in the collection?



Thanks in advance, Nico



Ok I found the answer, it's quite obvious, the server stills acts as a proxy in order to provide access control - "all uploads will still be reached from the default /collectionSlug/staticURL/filename path. This plugin will "pass through" all files that are hosted on your third-party cloud service—with the added benefit of keeping your existing access control in place." -

https://github.com/payloadcms/plugin-cloud-storage/tree/master#payload-access-control
  • default discord avatar
    stc_toome4 months ago

    hey

    @1029713634466734170

    - I believe i'm experiencing the same issue, could you share a little more info on how you resolved this?

  • default discord avatar
    tctoni2 months ago


    I got it to work by adding NEXT_PUBLIC_S3_HOSTNAME to the .env file and generateUrl to the payload config



    Also set disablePayloadAccessControl: true if you want to directly get the image from s3 bucket (which is faster then to go through payload access control, but only recommended for public buckets!)

  • default discord avatar
    tomtana_766612 months ago

    I was struggeling with the same issue.. as pointed out by

    @809096190967676930

    the key is

    disablePayloadAccessControl: true

    . The next problem I ran into was that the

    thumbnailURL

    s were still pointing to the payload url and not to the bucket. I am not sure if this is intentional or a bug but you can fix this with

    adminThumbnail: ({ doc }) => generateThumbnailUrl({ doc }),

    in your collection config, where

    generateThumbnailUrl

    is a [function returning the bucket url](

    https://payloadcms.com/docs/upload/overview#admin-thumbnails

    ).

  • default discord avatar
    layogtimalast month

    This works really well! How do I use the thumbnail URL that's been generated though? Because the current config overrides it, right?



    Danke for posting this, was really helpful!



    This is mine right now, how would I use the imageSizes thumbnail?

Star on GitHub

Star

Chat on Discord

Discord

online

Can't find what you're looking for?

Get dedicated engineering support directly from the Payload team.