create-simpleadmin-ui 2.0.0

package/template/src/utils/requestSign.ts

@@ -0,0 +1,162 @@
+/**
+ * 请求签名（HMAC-SHA256），与后端 RequestSignCanonical 规则一致。
+ */
+
+/** 空 body 的 SHA-256 小写 hex */
+export const EMPTY_BODY_SHA256 =
+  'e3b0c44298fc1c149afbf4c8996fb92427ae41e4649b934ca495991b7852b855'
+
+const HEX = '0123456789abcdef'
+const textEncoder = new TextEncoder()
+
+/** 缓存 HMAC CryptoKey，避免每次请求 importKey */
+let cachedHmacKey: CryptoKey | null = null
+let cachedHmacSecret = ''
+
+/**
+ * 规范化路径：小写、去掉末尾斜杠（根除外）。
+ * @param path 原始路径
+ */
+export function normalizeSignPath(path: string): string {
+  let p = (path || '/').trim()
+  if (!p.startsWith('/')) p = `/${p}`
+  p = p.toLowerCase()
+  while (p.length > 1 && p.endsWith('/')) p = p.slice(0, -1)
+  return p
+}
+
+/**
+ * 拼接完整 API 路径（含 /api/v1 前缀）。
+ * @param baseURL axios baseURL
+ * @param url 相对或绝对路径
+ */
+export function resolveApiPath(baseURL: string | undefined, url: string): string {
+  const raw = String(url || '')
+  if (/^https?:\/\//i.test(raw)) {
+    try {
+      return normalizeSignPath(new URL(raw).pathname)
+    } catch {
+      return normalizeSignPath(raw)
+    }
+  }
+
+  const base = String(baseURL || '').replace(/\/+$/, '')
+  const path = raw.startsWith('/') ? raw : `/${raw}`
+  const full = path.toLowerCase().startsWith('/api') ? path : `${base}${path}`
+  return normalizeSignPath(full)
+}
+
+/**
+ * 将 params 规范为排序 QUERY 串。
+ * @param params axios params
+ */
+export function buildSignQuery(params: unknown): string {
+  if (params == null || typeof params !== 'object') return ''
+
+  const map = new Map<string, string[]>()
+  for (const [key, value] of Object.entries(params as Record<string, unknown>)) {
+    if (!key || value === undefined || value === null) continue
+    const list = map.get(key) ?? []
+    if (Array.isArray(value)) {
+      for (const item of value) list.push(String(item))
+    } else {
+      list.push(String(value))
+    }
+    map.set(key, list)
+  }
+
+  if (map.size === 0) return ''
+
+  const keys = [...map.keys()].sort()
+  return keys
+    .map((k) => {
+      const values = map.get(k)!
+      if (values.length > 1) values.sort()
+      return `${k}=${values.join(',')}`
+    })
+    .join('&')
+}
+
+/**
+ * 拼接待签字符串（path 应已规范化）。
+ */
+export function buildCanonicalString(parts: {
+  method: string
+  path: string
+  query: string
+  timestamp: string
+  nonce: string
+  bodySha256: string
+  idempotencyKey: string
+}): string {
+  return `${parts.method}\n${parts.path}\n${parts.query || ''}\n${parts.timestamp}\n${parts.nonce}\n${parts.bodySha256}\n${parts.idempotencyKey || ''}`
+}
+
+function toHex(buf: ArrayBuffer): string {
+  const bytes = new Uint8Array(buf)
+  let out = ''
+  for (let i = 0; i < bytes.length; i++) {
+    const b = bytes[i]
+    out += HEX[b >>> 4] + HEX[b & 0xf]
+  }
+  return out
+}
+
+/**
+ * SHA-256 小写 hex。
+ * @param text UTF-8 文本
+ */
+export async function sha256Hex(text: string): Promise<string> {
+  if (!text) return EMPTY_BODY_SHA256
+  const buf = await crypto.subtle.digest('SHA-256', textEncoder.encode(text))
+  return toHex(buf)
+}
+
+async function getHmacKey(secret: string): Promise<CryptoKey> {
+  if (cachedHmacKey && cachedHmacSecret === secret) return cachedHmacKey
+  cachedHmacKey = await crypto.subtle.importKey(
+    'raw',
+    textEncoder.encode(secret),
+    { name: 'HMAC', hash: 'SHA-256' },
+    false,
+    ['sign'],
+  )
+  cachedHmacSecret = secret
+  return cachedHmacKey
+}
+
+/**
+ * HMAC-SHA256 小写 hex（缓存 CryptoKey）。
+ * @param secret AppSecret
+ * @param message 待签串
+ */
+export async function hmacSha256Hex(secret: string, message: string): Promise<string> {
+  const key = await getHmacKey(secret)
+  const sig = await crypto.subtle.sign('HMAC', key, textEncoder.encode(message))
+  return toHex(sig)
+}
+
+/**
+ * 生成 Nonce（16–64 字符）。
+ */
+export function createNonce(): string {
+  if (typeof crypto !== 'undefined' && crypto.getRandomValues) {
+    const bytes = new Uint8Array(16)
+    crypto.getRandomValues(bytes)
+    let out = ''
+    for (let i = 0; i < bytes.length; i++) {
+      out += HEX[bytes[i] >>> 4] + HEX[bytes[i] & 0xf]
+    }
+    return out
+  }
+  return `${Date.now().toString(36)}${Math.random().toString(36).slice(2, 14)}`
+}
+
+/**
+ * 是否为签名失败类 401（不应清登录态）。
+ * @param message 错误文案
+ */
+export function isRequestSignFailureMessage(message: string | undefined): boolean {
+  if (!message) return false
+  return /签名|Nonce|AppId|时间戳|缺少签名/.test(message)
+}

package/template/src/views/error/NotFound.vue

@@ -0,0 +1,49 @@
+<script setup lang="ts">
+import { useRouter } from 'vue-router'
+const router = useRouter()
+</script>
+
+<template>
+  <div class="not-found sa-page">
+    <div class="not-found__card">
+      <p class="not-found__code">404</p>
+      <h1>页面不存在</h1>
+      <p>请检查菜单路由配置，或返回工作台继续操作。</p>
+      <el-button type="primary" @click="router.push('/index')">返回首页</el-button>
+    </div>
+  </div>
+</template>
+
+<style scoped lang="scss">
+.not-found {
+  min-height: 60vh;
+  display: grid;
+  place-items: center;
+}
+.not-found__card {
+  text-align: center;
+  padding: 40px 36px;
+  background: #fff;
+  border: 1px solid var(--sa-border);
+  border-radius: 20px;
+  box-shadow: var(--sa-shadow);
+  max-width: 420px;
+}
+.not-found__code {
+  margin: 0;
+  font-size: 64px;
+  font-weight: 800;
+  letter-spacing: -0.06em;
+  color: var(--sa-accent);
+  line-height: 1;
+}
+h1 {
+  margin: 8px 0 0;
+  font-size: 24px;
+}
+p {
+  margin: 10px 0 22px;
+  color: var(--sa-ink-secondary);
+  font-size: 14px;
+}
+</style>