Client Side Signed Upload - Upload Widget Or Not
Hello All:
I want to enable my users to upload a profile image to cloudinary directly without it hitting my servers. I am trying to use the Upload Widget. However where do I specify the signature? My server is returning the signature. Do I also return a timestamp? The documentation is very mixed up about all this.
Once I have the signature where do I put it? The example shows the below for the widget. But this has no spot to take in a signature? I have created an upload preset for signed. However it is still is detecting it as unsigned.
var widget = window.cloudinary.createUploadWidget({
cloudName: cloudName,
uploadPreset: uploadPreset,
cropping: false,},
(error, result) => {
if (!error && result && result.event === "success") {
console.log("Done! Here is the image info: ", result.info);
document
.getElementById("uploadedimage")
.setAttribute("src", result.info.secure_url);
}
}
);
Isnt there a more straightforward way to do this?
Comments
-
I also tried to do a signed upload like this
var widget = window.cloudinary.createUploadWidget({
cloudName: cloudName,
api_key : "522sdsdsdsds7",
uploadSignature: data.signature,
cropping: false,},
(error, result) => {
if (!error && result && result.event === "success") {
console.log("Done! Here is the image info: ", result.info);
document
.getElementById("uploadedimage")
.setAttribute("src", result.info.secure_url);
}
}
);
It gives me an error. What format does upload signature have to be in?
How is the timestamp to be treated?
Am just not able to get the signed upload happening
0 -
Hi,
Thank you for reaching out! Please follow our Manual signature generation. Taking from the document's example:
For example, if your API secret is abcd, your API key is 1234, the Unix time now is 1315060510 and you are posting a request to upload a file from 'https://www.example.com/sample.jpg', set its Public ID as sample_image, and eagerly generate 2 images:
Parameters to sign:
timestamp: 1315060510
public_id: sample_image
eager: w_400,h_300,c_pad|w_260,h_200,c_cropSerialized sorted parameters in a single string:
eager=w_400,h_300,c_pad|w_260,h_200,c_crop&public_id=sample_image×tamp=1315060510
String including the API secret that is used to create the SHA-1 signature:
eager=w_400,h_300,c_pad|w_260,h_200,c_crop&public_id=sample_image×tamp=1315060510abcdSHA-1 hexadecimal result:
bfd09f95f331f558cbd1320e67aa8d488770583e
The final request parameters for the upload POST request:timestamp: 1315060510
public_id: sample_image
api_key: 1234
eager: w_400,h_300,c_pad|w_260,h_200,c_crop
file: https://www.example.com/sample.jpg
signature: bfd09f95f331f558cbd1320e67aa8d488770583eLet us know if you encounter any errors and need further assistance.
Regards,
AnthonyDeveloper Support Engineer
CloudinaryJoin the Cloudinary Community
0 -
Hello all I finally got the signed uploads working and wrote a blog post about it, for those who follow it is here
https://medium.com/@leodeo/signed-uploads-to-cloudinary-b3b30f00613d
0
