Allow authentication token to be passed to React components

[devcjohn]

For our use case, we would like to generate an authentication token on our Node backend, then pass it to our React frontend to be used with the AdvancedImage react component.

It's a similar as this one from the legacy React package:
cloudinary/cloudinary-react#242

Ideally it would look something like this:

  <AdvancedImage cldImg={img} plugins={[responsive(), accessibility()]} token={token} />

[igy]

Hi Chuck,

Thanks for contacting us.

We've created a feature request for our SDK team to consider when planning the future roadmap for the SDK.
If there are any updates or if we have an ETA by which this could be added, we'll add a note here with the details.

In the meantime, alternatives for using Access Control are to enable delivery via your own hostname, so the token can be sent in a cookie, or create the delivery URLs using another method (such as the js-url-gen project) and then adding the URLs via another method.

It may also be possible for you to fork the SDK and add support for this yourself, though we generally recommend using the published SDK versions, because if a bug are found in an SDK version, we'll need to make a new release to resolve ot and your own changes could be incompatible with the new version, preventing you from upgrading to resolve the bug.

Regards,
Stephen

[igy]

Hi Chuck,

Following up on this, the @cloudinary/url-gen library was recently updated to allow passing query string parameters to the URLs it creates, which will allow you to pass tokens when loading assets via our frontend frameworks.

If you update your dependencies to use 1.10.0 of that library, you can pass queryParams as an option when instantiating CloudinaryImage, and the parameters will be added to the URL used by the component.

There's a simple usage example available here, though to actually use token authentication you'll need to retrieve the token from your server-side code before this: https://codesandbox.io/s/morning-voice-vnt3in?file=/src/App.js

Regards,
Stephen

[devcjohn]

Thanks @igy

I am no longer on that team to verify this improvement, but I will make sure they're aware of this.

[cloudy408]

Hi Chuck,

Thank you for doing that. If there are any further questions or comments we can answer them here!

Regards,
John