How can I upload assets to Cloudinary using a Bitbucket pipeline?

[greatAndPowerfulOz]

I use Bitbucket to house and deploy code for a couple of small websites I've developed. I currently use Bitbucket Pipelines to push any updated files in a pull request for the `deploy` branch to hosting web servers via FTP. Git FTP is nice for this, because it will only push changed files to the web server, and also allows me to specify files to ignore and/or forcibly include, via `.git-ftp-ignore` and `.git-ftp-include` config files. Here's what my `bitbucket-pipelines.yml` file looks like to do this:

pipelines:
  default:
    - step:
        script:
          - echo "No deployment occurred (non-production branch)."
  branches:
    deploy:
      - step:
          script:
            - sudo -s
            - add-apt-repository ppa:git-ftp/ppa
            - apt-get update
            - apt-get -qq install git-ftp
            - git ftp push -u $FTP_USERNAME -p $FTP_PASSWORD $FTP_URL

One of my clients (an illustrator) stores samples of her digital artwork in Cloudinary, and I also have the need to store a couple of CSS and JS files there. Whenever I make updates to those files, I currently upload them manually via Cloudinary's web interface, but I'd like to do this in an automated fashion as part of my Bitbucket pipeline, if possible (i.e., if a given pull request contains updated files that should be stored in Cloudinary, they will be pushed there via FTP or some other means).

Cloudinary has a well-documented API, which I imagine is what I need to do what I'm explaining here, however I'm not familiar at all with using APIs and, unfortunately, I become a bit lost when reading through all the docs! I was hoping that someone in this community with more experience in this sort of thing could "throw me a bone" and offer a clear explanation/example of how to get this going.

Here are some links to what I think might be the applicable documentation from Cloudinary:

• https://cloudinary.com/documentation/upload_images#ftp_url
• https://cloudinary.com/documentation/image_upload_api_reference#examples
• https://cloudinary.com/documentation/node_image_and_video_upload#server_side_upload

If anyone can please help point me in the right direction, it would be greatly appreciated. Thank you!

[Daniil Penkin]

Hello @greatAndPowerfulOz,

Thanks for reaching out!

I'm not familiar with Cloudinary at all but a quick search revealed at least a couple of existing CLI tools to interact with it: cloudinary-cli (JS) and cloudinary-cli (Python). I also found a tutorial on how to set one of them up.

Now you need to figure out the command to list the files you need to upload. This depends a lot on what your repository type is and how you define the files you need to upload. If you give some more details on this, I might be able to suggest something.

Hope this helps.

Cheers,
Daniil

[greatAndPowerfulOz]

Thank you for your quick response, @Daniil Penkin! I'll see about installing the cloudinary-cli tool as a solution.

There are only two specific files I need to upload to Cloudinary at present, so I know their exact names and locations. I suppose that's how I'd "define" them, in addition to the criterion that they be included in the latest commit(s) to my deployment branch (as having changed). Of course, the names and number of files I need to upload could change over time, so if I were to offer a more "dynamic" definition of the files, they would match three criteria:

1. They are in either the /js  or /css directory of the repo
2. Their file name matches the pattern all-*.min.*
3. They are identified as new or changed in the commit(s) included in the pull request being processed

As to the type of repo I have, I'm not sure I understand what you're asking. Can you give me examples of "repo types"?

Also, something I need to consider is the ability to upload each file to the correct Cloudinary folder (i.e., all .css files will need to go into the /CSS folder I maintain in Cloudinary, and all .js files need to go into the /JS folder there). I'm thinking that an easy (albeit not necessarily elegant) way to handle that would be to just run two separate commands: one for .css files and one for .js files. With each command, I'd specify the appropriate Cloudinary destination folder for the files identified.

Thanks, again. I hope the info above gives you or anyone else what you need to help work out a full solution. I'm a newbie with pipelines and Bitbucket, in general, so I really appreciate your input!