我如何使用签名上传到cloudinary

Sam*_* Ek 3 jquery node.js cloudinary

我需要确保客户端上传到cloudinary的安全,以便我使用cloudinary api_secret密钥和时间从节点服务器端生成签名令牌,使用此代码 api_sign_request = function(params_to_sign, api_secret)。在这些之后,如何使用此令牌将图像从前端上传到 cloudinary

Dem*_*tix 7

让我们花点时间指出 Cloudinary 的文档有多么糟糕。这很容易是我见过的最糟糕的。噩梦燃料。

现在我已经把这个想法说出来了……我真的需要能够做到这一点,而且我花了太长时间把头撞到墙上,而这本来应该是非常简单的。这里是...

服务器(Node.js)

您需要一个向前端返回签名时间戳对的端点:

import cloudinary from 'cloudinary'

export async function createImageUpload() {
  const timestamp = new Date().getTime()
  const signature = await cloudinary.utils.api_sign_request(
    {
      timestamp,
    },
    process.env.CLOUDINARY_SECRET
  )
  return { timestamp, signature }
}
Run Code Online (Sandbox Code Playgroud)

客户端(浏览器)

客户端向服务器请求签名时间戳对,然后使用它来上传文件。示例中使用的文件应来自<input type='file'/>更改事件等。

const CLOUD_NAME = process.env.CLOUDINARY_CLOUD_NAME
const API_KEY = process.env.CLOUDINARY_API_KEY

async function uploadImage(file) {
  const { signature, timestamp } = await api.post('/image-upload')
  const form = new FormData()
  form.append('file', file)
  const res = await fetch(
    `https://api.cloudinary.com/v1_1/${CLOUD_NAME}/image/upload?api_key=${API_KEY}&timestamp=${timestamp}&signature=${signature}`,
    {
      method: 'POST',
      body: form,
    }
  )
  const data = await res.json()
  return data.secure_url
}
Run Code Online (Sandbox Code Playgroud)

就是这样。仅此而已。如果 Cloudinary 在他们的文档中有这个就好了。

非常感谢@jpschroeder 的回答,它从一开始就为我指明了正确的方向。