Modify upload provider with custom path

mkirkland · October 20, 2020, 11:13pm

Im looking to modify a provider that i installed, strapi-provider-upload-google-cloud-storage. I want to add a custom path when it uploads to the bucket. Currently its saving in the main bucket but multiple files/folders are saved at the root of the bucket. I want to add a custom ‘path’ when saving the files to the bucket.

I can modify the node_module code itself for the strapi-provider-upload-google-cloud-storage provider but its probably best to fork that repo and create my own. How do i pass and extra param to the upload method when its called? I cant find in strapi where it calls the upload method.

DMehaffy · October 21, 2020, 8:34pm

Hi @mkirkland

It may be worth it to take a look at the strapi-provider-upload-aws-s3 provider that we manage ourselves, as this currently is the only provider we natively support that also has a path option (sent with the upload request):

github.com

strapi/strapi/blob/81c684d7b4ae6649bf701be119c740234a5f2d12/packages/strapi-provider-upload-aws-s3/lib/index.js#L19-L44

    
      
          return {
            upload(file, customParams = {}) {
              return new Promise((resolve, reject) => {
                // upload file on S3 bucket
                const path = file.path ? `${file.path}/` : '';
                S3.upload(
                  {
                    Key: `${path}${file.hash}${file.ext}`,
                    Body: Buffer.from(file.buffer, 'binary'),
                    ACL: 'public-read',
                    ContentType: file.mime,
                    ...customParams,
                  },
                  (err, data) => {
                    if (err) {
                      return reject(err);
                    }
          
          
          // set the bucket file url
                    file.url = data.Location;

This file has been truncated. show original

As for modification you are correct that you should fork the package and you can drop it in the ./plugins folder (will need to create this folder if you don’t have one), or you can push it into GitHub and use the GitHub packages / NPM to release a modified version.

Alternatively the original author of that provider is quite active in the community and is very open to pull requests, you may want to talk with her @Lith

The repo for that provider is located here: GitHub - Lith/strapi-provider-upload-google-cloud-storage: Google Cloud Storage Upload Provider for Strapi

mkirkland · October 22, 2020, 1:36am

So i’ve locally installed the provider, strapi-provider-upload-google-cloud-storage, using the instructions here: https://strapi.io/documentation/v3.x/plugins/upload.html#create-providers It starts up and runs just fine. But i guess the piece that i dont understand is that i need to modify the Upload method from the main strapi-plugin-upload to insert my custom path? This path is dynamic and will be updated with a uuid that belongs in the model of the event that im uploading these images too.

If i try to override the upload/models/upload.js file in the plugins directory, strapi throws and error and quits. What am i missing?

mkirkland · October 26, 2020, 4:14pm

Any advice on where the upload model can be modified for adding the path?

sunnyson · October 26, 2020, 4:24pm

To modify the Upload model:

Copy file →
./node_modules/strapi-plugin-upload/models/File.settings.json
to:
./extensions/upload/models/File.settings.json and edit it here.

It will overwrite the original model of Upload plugin.

Lith · November 5, 2020, 11:15am

Hello @mkirkland !

Sorry for the delay, hope my answer will help you !

The provider strapi-provider-upload-google-cloud-storage (than I maintain) can be use with custom path.

When you upload a file, you just need to set path.

Please find an example with a formData :

    const formData = new FormData();
    formData.append('ref', 'component');
    formData.append('refId', this.id);
    formData.append('field', field);
    formData.append('path', `my/custom/path/`);

Also, I’ve add an option call basePath than allow you do set a default folder to upload all of your files into (GitHub - Lith/strapi-provider-upload-google-cloud-storage: Google Cloud Storage Upload Provider for Strapi)

Thanks

Umbert_Pensato · February 11, 2021, 12:45pm

Thx for the answer, but could you give an example of the easiest way to add this? I’m, looking for a programmatic way as per the path to be build based on the name of the model is being attached to, and I’m having a hard time understanding at which point I can extend the current funcionality without having to rewrite or copy plugins.

Sorry if this is obvious or been answered somewhere else.

sunnyson · February 16, 2021, 11:57am

@Umbert_Pensato

const modelName = 'articles';
//...
const requestURL = `http://localhost:1337/${model}/`; 
//...
formData.append('path', `${model}/uploads`);

Lith · February 16, 2021, 11:59am

Hi @Umbert_Pensato,

As I understand, you would like to have an automatic path set by default using the component model name ?

I can add an option to the project, a boolean called useModelPath default to false (in order to have a retro-compatibility with all others users, and they are thousands )

If this can help you, I will try to add this option in few days and ask you to test it before release on NPM.

Does it possible to you to write this feature request on the GitHub project ?
Ask for a new feature

It will be easiest for me to follow the development.

Thanks !

Umbert_Pensato · February 16, 2021, 1:13pm

That would be pretty amazing tbh. I’ll write something that is a bit more curated that my brain dump in here

Thx

wing_ctx · January 18, 2022, 4:37am

Dear @sunnyson and @Umbert_Pensato .
I am trying to upload a1.zip file of entryA1 in Collection A (that is Want to upload a1.zip to /public/upload/CollectionA/A1…)

Kindly you explain that
" To modify the Upload model:

Copy file →
./node_modules/strapi-plugin-upload/models/File.settings.json
to:
./extensions/upload/models/File.settings.json and edit it here.

It will overwrite the original model of Upload plugin."

but ./node_modules/strapi-plugin-upload/models/File.settings.json only have json definitions.

no place to add code
const modelName = ‘articles’;
//…
const requestURL = http://localhost:1337/${model}/;
//…
formData.append(‘path’, ${model}/uploads);

Sorry for it if I miss undertstand you r explonation…
Could you tell me a liite more about it ? how to ?
thanks in advance…