next-cloudinary icon indicating copy to clipboard operation
next-cloudinary copied to clipboard

[Bug] Invalid Signature ***. String to sign - 'source=uw&timestamp=1709830648'.

Open bradenhirschi opened this issue 1 year ago • 2 comments

Bug Report

Describe the bug

I'm getting an error "Invalid Signature ***. String to sign - 'source=uw&timestamp=1709830648'" when attempting a signed upload with CldUploadWidget

Is this a regression?

No

Steps To Reproduce the error

  1. Add NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME, NEXT_PUBLIC_CLOUDINARY_API_KEY, and NEXT_PUBLIC_CLOUDINARY_API_SECRET to .env.local

  2. Add CldUploadWidget to a page in my application Screenshot 2024-03-07 at 11 16 12 AM

  3. Generate SHA signature in api route and return Response.json({ signature}) Screenshot 2024-03-07 at 11 19 38 AM

  4. Attempt to upload image through upload widget

Expected behaviour

Image is uploaded to Cloudinary without error

CodeSandbox or Live Example of Bug

Screenshot or Video Recording

Screenshot 2024-03-07 at 11 06 30 AM

Your environment

  • OS: MacOS Sonoma 14.2.1
  • Node version: 18.17.0
  • Npm version: 10.2.4
  • Browser name and version: Google Chrome 122.0.6261.94

Additional context

I've already tried:

  • Passing environment variables in manually instead of through process.env.***
  • Generating SHA1 signature manually instead of using cloudinary.utils.api_sign_request
  • Adding additional options to the request like uploadPreset, etc.
  • Unsigned upload: this works fine

bradenhirschi avatar Mar 07 '24 17:03 bradenhirschi

Quick comment, I think I found the issue. The issue is that just source=uw is added to the signature when sources aren't specified manually in options. When I restricted it to just local as the source it works fine. I can't see a required source option documented anywhere, please correct me if I'm wrong.

Screenshot 2024-03-07 at 11 25 37 AM

bradenhirschi avatar Mar 07 '24 17:03 bradenhirschi

i dont think that the sources are necessarily required in a general upload, however, the upload widget passes in a source as an upload parameter and the signature needs to match the parameters being sent on that request

image

as far as using cloudinary.utils.api_sign_request, what issue were you hitting with that?

here's a working example of one for app Router:

https://github.com/cloudinary-community/cloudinary-examples/blob/main/examples/nextjs-clduploadwidget-signed/app/page.tsx#L27 https://github.com/cloudinary-community/cloudinary-examples/blob/main/examples/nextjs-clduploadwidget-signed/app/api/sign-image/route.ts

and the Next Cloudinary docs has a few examples similarly for Pages

https://github.com/cloudinary-community/next-cloudinary/blob/main/docs/pages/clduploadwidget/basic-usage.mdx#L142 https://github.com/cloudinary-community/next-cloudinary/blob/main/docs/pages/api/sign-cloudinary-params.js

colbyfayock avatar Mar 07 '24 17:03 colbyfayock

hey @bradenhirschi going to close this for now since we haven't heard back in a while, but please feel free to re-open if you're still seeing issues. thanks

colbyfayock avatar Sep 16 '24 12:09 colbyfayock