이 페이지는 현재 영어로만 제공되며 한국어 버전은 곧 제공될 예정입니다. 기다려 주셔서 감사드립니다.

签名 URL

操作场景

签名 URL 是指基于图片模板动态修改图片元素变量后生成签名 URL 链接并作为分享使用,本文将介绍如何生成签名 URL 链接。

前提条件

1. 开通 Open Edge

开通 Open Edge 服务,详细请参见 快速入门

2. 获取图片渲染 API 密钥

获取生成签名 URL 所需的安全凭证,即 API Key,步骤如下:
打开图片模板后,切换到 Settings,查看 API Key 一项。
注意:
API Key 用于生成签名链接及 API 调用,并被用来识别账号的唯一性,请保管好您的 API Key 避免泄漏。




示例代码

为了方便用户开发,图片渲染提供多语言 Demo,详情请参见下方:
Node.js
Golang
Java
PHP
Python
const crypto = require('crypto');

function generateMD5(input) {
return crypto.createHash('md5').update(input).digest('hex');
}


// 模板中设置的图片格式,可在 Settings 中查看
const format = 'png';
// 用户 Id,可在 Settings 中查看
const userId = '6b4afbd3d1834aa0a5537e5b02ddab3e';
// 模板 Id,可在 Settings 中查看
const templateId = 'ep-Zl1EQGmDexeY';
// 生成签名的API Key,可在 Settings 中查看
const apiKey = '$YOUR_API_KEY$';


/** 请在这里填入要修改的模板变量参数! */
const params = {
title: 'Hello, Edge',
};
// 对参数key进行排序
const sortedKeys = Object.keys(params).sort();
// 对参数进行拼接
const searchParams = sortedKeys.map(key => `${key}=${params[key]}`).join('&');


// 待签名的数据
const signData = JSON.stringify({
apiKey: apiKey,
searchParams: searchParams,
});
// 调用 md5 生成签名
const sign = generateMD5(signData);

// 对 URL 参数的值执行 encodeURIComponent,以编码 URL 中的特殊字符
const encodedSearchParams = sortedKeys.map(key => `${key}=${encodeURIComponent(params[key])}`).join('&');
const finalUrl = `https://image.edgeone.site/${sign}/${userId}/${templateId}.${format}?${encodedSearchParams}`;
console.log(finalUrl);
// 打印的示例URL: https://image.edgeone.site/c640ab6cb550eaf87fd13d7bb716370f/6b4afbd3d1834aa0a5537e5b02ddab3e/ep-Zl1EQGmDexeY.png

package main
import (
"crypto/md5"
"encoding/hex"
"encoding/json"
"fmt"
"net/url"
"sort"
)

func generateMD5(input string) string {
hash := md5.New()
hash.Write([]byte(input))
return hex.EncodeToString(hash.Sum(nil))
}

func main() {
// 模板中设置的图片格式,可在 Settings 中查看
format := "png"
// 用户 Id,可在 Settings 中查看
userId := "6b4afbd3d1834aa0a5537e5b02ddab3e"
// 模板 Id,可在 Settings 中查看
templateId := "ep-Zl1EQGmDexeY"
// 生成签名的API Key,可在 Settings 中查看
apiKey := "$YOUR_API_KEY$"
/** 请在这里填入要修改的模板变量参数! */
params := map[string]string{
"title": "Hello, Edge",
}
// 对参数key进行排序
sortedKeys := make([]string, 0, len(params))
for key := range params {
sortedKeys = append(sortedKeys, key)
}
sort.Strings(sortedKeys)
// 对参数进行拼接
searchParams := ""
for i, key := range sortedKeys {
if i > 0 {
searchParams += "&"
}
searchParams += fmt.Sprintf("%s=%s", key, params[key])
}
// 待签名的数据
signData := map[string]interface{}{
"apiKey": apiKey,
"searchParams": searchParams,
}
signDataJSON, _ := json.Marshal(signData)
// 调用 md5 生成签名
sign := generateMD5(string(signDataJSON))
// 对 URL 参数的值执行 encodeURIComponent,以编码 URL 中的特殊字符
encodedSearchParams := ""
for i, key := range sortedKeys {
if i > 0 {
encodedSearchParams += "&"
}
encodedValue := url.QueryEscape(params[key])
encodedSearchParams += fmt.Sprintf("%s=%s", key, encodedValue)
}
finalUrl := fmt.Sprintf("https://image.edgeone.site/%s/%s/%s.%s?%s", sign, userId, templateId, format, encodedSearchParams)

fmt.Println(finalUrl)
// 打印的示例URL: https://image.edgeone.site/c640ab6cb550eaf87fd13d7bb716370f/6b4afbd3d1834aa0a5537e5b02ddab3e/ep-Zl1EQGmDexeY.png
}
import java.security.MessageDigest;
import java.security.NoSuchAlgorithmException;
import java.net.URLEncoder;
import java.nio.charset.StandardCharsets;
import java.util.HashMap;
import java.util.Map;
import java.util.TreeMap;
public class Main {
// 生成 MD5 哈希
public static String generateMD5(String input) {
try {
MessageDigest md = MessageDigest.getInstance("MD5");
byte[] messageDigest = md.digest(input.getBytes(StandardCharsets.UTF_8));
StringBuilder hexString = new StringBuilder();
for (byte b : messageDigest) {
String hex = Integer.toHexString(0xff & b);
if (hex.length() == 1) hexString.append('0');
hexString.append(hex);
}
return hexString.toString();
} catch (NoSuchAlgorithmException e) {
throw new RuntimeException(e);
}
}
public static void main(String[] args) {
// 模板中设置的图片格式,可在 Settings 中查看
String format = "png";
// 用户 Id,可在 Settings 中查看
String userId = "6b4afbd3d1834aa0a5537e5b02ddab3e";
// 模板 Id,可在 Settings 中查看
String templateId = "ep-Zl1EQGmDexeY";
// 生成签名的API Key,可在 Settings 中查看
String apiKey = "$YOUR_API_KEY$";
Map<String, String> params = new HashMap<>();
/** 请在这里填入要修改的模板变量参数! */
params.put("title", "Hello, Edge");

// 对参数key进行排序
TreeMap<String, String> sortedParams = new TreeMap<>(params);
// 对参数进行拼接
StringBuilder searchParams = new StringBuilder();
for (Map.Entry<String, String> entry : sortedParams.entrySet()) {
if (searchParams.length() > 0) {
searchParams.append("&");
}
String escapedValue = entry.getValue().replace("\"", "\\\"");
searchParams.append(entry.getKey()).append("=").append(escapedValue);
}
// 待签名的数据
String signData = String.format("{\"apiKey\":\"%s\",\"searchParams\":\"%s\"}", apiKey, searchParams.toString());
// 调用 md5 生成签名
String sign = generateMD5(signData);
// 对 URL 参数的值执行 encodeURIComponent,以编码 URL 中的特殊字符
StringBuilder encodedSearchParams = new StringBuilder();
for (Map.Entry<String, String> entry : sortedParams.entrySet()) {
if (encodedSearchParams.length() > 0) {
encodedSearchParams.append("&");
}
String encodedValue = URLEncoder.encode(entry.getValue(), StandardCharsets.UTF_8);
encodedSearchParams.append(entry.getKey()).append("=").append(encodedValue);
}
String finalUrl = String.format("https://image.edgeone.site/%s/%s/%s.%s?%s", sign, userId, templateId, format, encodedSearchParams.toString());

System.out.println(finalUrl);
// 打印的示例URL: https://image.edgeone.site/c640ab6cb550eaf87fd13d7bb716370f/6b4afbd3d1834aa0a5537e5b02ddab3e/ep-Zl1EQGmDexeY.png
}
}
<?php

// 生成 MD5 哈希
function generateMD5($input) {
return md5($input);
}
// 模板中设置的图片格式,可在 Settings 中查看
$format = 'png';
// 用户 Id,可在 Settings 中查看
$userId = '6b4afbd3d1834aa0a5537e5b02ddab3e';
// 模板 Id,可在 Settings 中查看
$templateId = 'ep-Zl1EQGmDexeY';
// 生成签名的API Key,可在 Settings 中查看
$apiKey = '$YOUR_API_KEY$';
/** 请在这里填入要修改的模板变量参数! */
$params = [
'title' => 'Hello, Edge',
];
// 对参数key进行排序
ksort($params);
// 对参数进行拼接
$searchParams = '';
foreach ($params as $key => $value) {
if ($searchParams !== '') {
$searchParams .= '&';
}
$searchParams .= $key . '=' . $value;
}
// 待签名的数据
$signData = json_encode([
'apiKey' => $apiKey,
'searchParams' => $searchParams,
]);

// 调用 md5 生成签名
$sign = generateMD5($signData);
// 对 URL 参数的值执行 urlencode,以编码 URL 中的特殊字符
$encodedSearchParams = http_build_query($params);
// 构建最终的 URL
$finalUrl = sprintf(
'https://image.edgeone.site/%s/%s/%s.%s?%s',
$sign,
$userId,
$templateId,
$format,
$encodedSearchParams
);

echo $finalUrl;
// 打印的示例URL: https://image.edgeone.site/c640ab6cb550eaf87fd13d7bb716370f/6b4afbd3d1834aa0a5537e5b02ddab3e/ep-Zl1EQGmDexeY.png
?>
import hashlib
import urllib.parse
# 生成 MD5 哈希
def generate_md5(input_string):
return hashlib.md5(input_string.encode('utf-8')).hexdigest()
# 模板中设置的图片格式,可在 Settings 中查看
format = 'png'
# 用户 Id,可在 Settings 中查看
user_id = '6b4afbd3d1834aa0a5537e5b02ddab3e'
# 模板 Id,可在 Settings 中查看
template_id = 'ep-Zl1EQGmDexeY'
# 生成签名的API Key,可在 Settings 中查看
api_key = '$YOUR_API_KEY$'


# 请在这里填入要修改的模板变量参数!
params = {
'title': 'Hello, Edge',
}
# 对参数key进行排序
sorted_params = sorted(params.items())
# 对参数进行拼接,不对值进行 urlencode
search_params = '&'.join(f"{key}={value.replace('\"', '\\\"')}" for key, value in sorted_params)


# 待签名的数据
sign_data = f'{{"apiKey":"{api_key}","searchParams":"{search_params}"}}'
print(sign_data)
# 调用 md5 生成签名
sign = generate_md5(sign_data)
# 对 URL 参数的值进行 urlencode
encoded_search_params = '&'.join(f"{key}={urllib.parse.quote(value)}" for key, value in sorted_params)
# 构建最终的 URL
final_url = f'https://image.edgeone.site/{sign}/{user_id}/{template_id}.{format}?{encoded_search_params}'

print(final_url)
# 打印的示例URL: https://image.edgeone.site/c640ab6cb550eaf87fd13d7bb716370f/6b4afbd3d1834aa0a5537e5b02ddab3e/ep-Zl1EQGmDexeY.png