API Issues

[swissky]

Hey, thank you for your Plugin, i like the idea and we are trying to move from Image Resizing to Cloudflare Images and later delete all the Images from the Server and serve it just from CF.

For our first try i test your plugin with one site (and later with a second) and we got API Errors.

During the Mass Upload we are getting a this message inside the Log: Missing Cloudflare Image ID or hash

If i try to upload it from the Media Library it shows {"success":false,"errors":[{"code":10000,"message":"Authentication error"}]}

The API Token is correct and the Site ID too. Do you have any idea? If i press the Check API Status inside your Plugin i don't get any Message or Error.

Best Kevin

[av3nger]

Hi. First of all, thank you for sponsoring the plugin! Much appreciated.

Regarding the error. This is related to either an expired token or incorrect permissions. I wrote a setup guide with screenshots on how to setup the Cloudflare account and the API token: https://vcore.au/tutorials/how-to-setup-cloudflare-images-plugin/#cloudflare-account-id-and-api-token

Could you please check and verify that you have the token setup as per the instructions and the Cloudflare Images service is active on your account.

Best regards, Anton

[swissky]

Hey Anton

Your welcome. We love to help good projects, which we use for us and our clients.

I read your Blogpost and look here are the details to proof that everything is right from our side

And here the integration to my personal site to test it, with the Error i get from the Logs.

Can you maybe send me the API Call you did, so we can test it with Curl on our side?

[av3nger]

Hm... I tried a couple of different variation, and I get this error if I use an incorrect API Token.

This is a test CURL request that should work: curl --location 'https://api.cloudflare.com/client/v4/accounts/<ACCOUNT_ID>/images/v1' --header 'Authorization: Bearer <API_TOKEN>' --form 'file=@"/full/path/to/image.jpg"'

And you should be able to test the API Token with the following CURL command: curl --location 'https://api.cloudflare.com/client/v4/user/tokens/verify' --header 'Authorization: Bearer <API_TOKEN>' --header 'Content-Type: application/json'

Just to double check, you also don't have any Client IP Address Filtering or TTL set on the token, right?

[swissky]

Just to double check, you also don't have any Client IP Address Filtering or TTL set on the token, right? No

And you should be able to test the API Token with the following CURL command: curl --location 'https://api.cloudflare.com/client/v4/user/tokens/verify' --header 'Authorization: Bearer ' --header 'Content-Type: application/json' {"result":{"id":"2f9b54dfaf08c3188e20ffd28b147381","status":"active"},"success":true,"errors":[],"messages":[{"code":10000,"message":"This API Token is valid and active","type":null}]}

[av3nger]

Ok. That's good, the token passes verification. Are you able to upload a test image via the first CURL command?

[swissky]

Your code got me some errors, so I changed the File Part a little bit.

The request is not good, but the Error is the same as before {"success":false,"errors":[{"code":10000,"message":"Authentication error"}]}

[av3nger]

Can you please try to create a new test API Token with just the Edit permission for the Cloudflare Images service?

[swissky]

Sure

Same error.

[swissky]

Btw. it would be amazing if you implemented an option like "Backup restore". So if all images are on CF and not anymore in the Media Library, the Restore would bring the images back to the Library.

[av3nger]

I think your next best bet on the authentication issue is to contact Cloudflare support directly or via the community forums here: https://community.cloudflare.com/c/developers/api/23. I wish they had better error messages.

With the restore - there's already that functionality in the plugin. It's under experimental features. You can fully remove an image from the media library and rely on just the Cloudflare Images. You will also be able to restore the originals, if required.

[swissky]

I think your next best bet on the authentication issue is to contact Cloudflare support directly or via the community forums here: https://community.cloudflare.com/c/developers/api/23. I wish they had better error messages.

Yes i`m already in touch with them (we use CF Enterprise)

With the restore - there's already that functionality in the plugin. It's under experimental features. You can fully remove an image from the media library and rely on just the Cloudflare Images. You will also be able to restore the originals, if required. Ohh thank you, just saw the feature without the Restore.

[swissky]

So everything is working. There was an API function disabled (strange Enterprise function).

Now I have the opportunity to test everything (just the resizing function is not working, but that's a CF Problem I think)

Could you please add these 2 Options "Buttons" to help with the main function.

Also do you have an idea to change the URL from https://domain.ch/cdn-cgi/imagedelivery/AtkWLf3OS3gR69rPs-XmmA/windweek.ch/2023/11/Header-Windweek.jpg/w=2560

to

https://domain.ch/cdn-cgi/Header-Windweek.jpg/w=2560

Thank you

[av3nger]

What function did you need to enable? Is this something that I can add in the docs for others to check?

I can add that functionality, but I've only tested this on my site and don't have enough feedback to guarantee that this works flawlessly. Once you fully offload, the image URLs for new posts will be saved as Cloudflare URLs to the database, it might not be possible to roll back from that without manual database search & replace functionality. That's the only reason why I haven't added bulk functionality to this option.

For URLs, there's already functionality to change it to a custom URL with a worker. You could change https://domain.ch/cdn-cgi/imagedelivery/AtkWLf3OS3gR69rPs-XmmA/windweek.ch/2023/11/Header-Windweek.jpg/w=2560 to https://domain.ch/images/domain.ch/2023/03/2023/11/Header-Windweek.jpg/w=2560. The images part can be any custom string. To set it up, in the plugin settings go to Pro Features -> Custom image URLs & stats and follow the instructions.

[swissky]

When i activate "Full offload" the images are still inside the Library and on the server. A button which deletes all these images would be nice, so no SFTP and manually looking for all images which are not SVG or PDFs.

When someone wan`t to get the images back, he can click the second button "Restore from Cloudflare back to Library". So images come back.

If you need help for testing, let me know. As i wrote in my first message, i would like to outsource all images from my clients to CF, so thats why i test everything and give you feedback what i would need ;)

About the URLs. The Instructions are not really good...sorry.

Use the current site domain instead of imagedelivery.net, or specify a custom domain. Note: The domain must be linked with Cloudflare in order to work correctly.

In my case i mean everything what is behind the domain. Domain is already set, but i want to delete the bold stuff https:/domain.ch/cdn-cgi/imagedelivery/AtkWLf3OS3gR69rPs-XmmA/windweek.ch/2023/11/Header-Windweek.jpg/w=2560

[swissky]

If you like to discuss it more private, I can invite you to Slack or mail. So I can share emails and logins if you want to see more and test.

[av3nger]

For the custom domain:

1. Enable the "Serve from custom domain" option in the plugin, add your domain, for example, "https://example.com"
2. You'll need to create an account on https://getfuzion.io
3. Connect to the service from the plugin using your email/pass or generate an API key on https://getfuzion.io/user/api-tokens, make sure to select cf-images in permissions.
4. Go to https://getfuzion.io/cloudflare and follow the instructions to setup a Cloudflare worker. You can also enable "Track usage per domain", that will setup the worker in a way that it tracks usage between sites. Useful, if you have all your client sites on your account and you're billing them based on usage.
5. Once the worker is created, it should sync up with the plugin and you're good to go.

With full offload. I'll try to explain what I mean.

1. Upload a test image
2. In the media library in the optimization column - offload the image and remove it
3. Create a test post and add that image to the post. At this point, the post should contain the Cloudflare image URL
4. Restore back the image, and remove it from Cloudflare
5. The post still contains the Cloudflare URL That's the problem I was referring to. The feature works, but if you even decide to go back, you will need to do a search and replace in the database. I'm thinking about ways to automate this, but there's not many users that leave feedback on this feature, so it's going a bit slowly.

Emails would be easier. You can reach me at anton@vcore.au

[alhrmss]

Hey brother, and thank you for your hard work, but really we need to remove the files after we upload it to Cloudflare, and the full offload not working to delete the files from our server.

[av3nger]

Hey @alhrmss,

I've added a beta version that adds the bulk remove button. https://github.com/av3nger/cf-images/releases/tag/1.8.0.beta-1 But, please make sure you have a backup of all your files. This is an experimental feature.

Also, something worth noting. Once you fully remove all the images - any new posts that you add with those "offloaded" images will have Cloudflare URLs hard coded into the posts. There isn't an easy way to roll that back.