yg-yygl 0.0.1

package/src/views/data/interface-oauth/components/interface-oauth-log.vue

@@ -0,0 +1,79 @@
+<script setup lang="ts">
+import type { SearchItemConfig } from '@udp/component-ui';
+
+import { Search, Table, useTable } from '@udp/component-ui';
+
+import { getDataInterfaceLogPage } from '../../../../api/data-interface';
+
+const props = defineProps<{
+  authId: string;
+  dataInterfaceId: string[];
+}>();
+
+const searchItems: SearchItemConfig[] = [
+  {
+    prop: 'timeRange',
+    label: '请求时间',
+    type: 'daterange',
+    gridCols: 2, // 占用2列，让日期选择器有足够的宽度
+    props: {
+      type: 'datetimerange',
+      format: 'YYYY-MM-DD HH:mm:ss',
+    },
+  },
+];
+
+const columns = [
+  { prop: 'dataInterfaceName', label: '接口名称', minWidth: 130 },
+  { prop: 'dataInterfaceCode', label: '接口编码', minWidth: 100 },
+  { prop: 'requestUrl', label: '请求地址', minWidth: 120 },
+  { prop: 'requestTime', label: '请求时间', minWidth: 155 },
+  { prop: 'ipAddress', label: '请求IP', minWidth: 90 },
+  { prop: 'requestMethod', label: '请求类型', minWidth: 90 },
+  { prop: 'requestDuration', label: '耗时(毫秒)', minWidth: 100 },
+  { prop: 'platForm', label: '请求设备', minWidth: 130 },
+];
+
+const {
+  loading,
+  data,
+  pagination,
+  search,
+  reset,
+  handleSizeChange,
+  handleCurrentPageChange,
+} = useTable({
+  api: {
+    list: (params: any) => {
+      params.model = {
+        oauthId: props.authId,
+        dataInterfaceId: props.dataInterfaceId,
+        start: params.model.timeRange?.[0] || '',
+        end: params.model.timeRange?.[1] || '',
+      };
+      return getDataInterfaceLogPage(params);
+    },
+  },
+});
+</script>
+<template>
+  <div class="w-full">
+    <Search :items="searchItems" @search="search" @reset="reset" />
+    <Table
+      :data="data"
+      :columns="columns"
+      :loading="loading"
+      :pagination="pagination"
+      height="500px"
+      :show-toolbar="false"
+      show-pagination
+      :show-top-actions="false"
+      :show-action="false"
+      :show-layout="false"
+      layout-type="table"
+      action-width="160px"
+      @size-change="handleSizeChange"
+      @current-page-change="handleCurrentPageChange"
+    />
+  </div>
+</template>

package/src/views/data/interface-oauth/components/interface-oauth.vue

@@ -0,0 +1,151 @@
+<script setup lang="tsx">
+import type { RenderContentFunction } from 'element-plus';
+
+import type { DataInterface, InterfaceTree } from '../../../../api/data-interface/types';
+
+import { onMounted, ref } from 'vue';
+
+import { Icon } from '@udp/component-ui';
+
+import { Search as SearchIcon } from '@element-plus/icons-vue';
+
+import { getDataInterfaceTree } from '../../../../api/data-interface';
+
+type Props = {
+  hasTab?: boolean;
+  selectList?: DataInterface[];
+};
+
+const props = withDefaults(defineProps<Props>(), {
+  hasTab: true,
+  selectList: () => [],
+});
+
+// 当前已选账号列表
+const selections = ref<DataInterface[]>(props.selectList || []);
+
+// 搜索文本
+const searchText = ref('');
+
+// 搜索账号结果列表
+const treeData = ref<InterfaceTree[]>([]);
+
+// 搜索账号
+const search = async () => {
+  loadInterfaceTree();
+};
+
+const loadInterfaceTree = async () => {
+  treeData.value = await getDataInterfaceTree({
+    dataInterfaceName: searchText.value || '',
+  });
+};
+
+// 树结构配置
+const treeProps = {
+  children: 'children',
+  label: 'name',
+  value: 'id',
+};
+
+// 清空已选
+const handleClear = () => {
+  selections.value = [];
+};
+
+// 全部数据节点点击
+const handleNodeClick = (data: any) => {
+  if (
+    +data.type === 1 &&
+    !selections.value.some((item) => +item.id === +data.id)
+  ) {
+    selections.value.push(data as DataInterface);
+  }
+};
+
+// 删除已选
+const handleDelete = (item: DataInterface) => {
+  selections.value = selections.value.filter((i) => i.id !== item.id);
+};
+
+// 渲染树结构内容
+const renderContent: RenderContentFunction = (h, { node, data }) => {
+  console.log(node, data);
+  return h(
+    'div',
+    {
+      class: 'w-full flex items-center gap-2',
+    },
+    [
+      h(Icon, {
+        name: +data.type === 1 ? 'mdi:file' : 'mdi:folder-open',
+        class: 'text-gray-500 dark:text-gray-400',
+      }),
+      h('span', null, node.label),
+    ],
+  );
+};
+
+// 生命周期
+onMounted(() => {
+  loadInterfaceTree();
+});
+
+// 暴露方法
+defineExpose({
+  selections: () => selections.value,
+});
+</script>
+
+<template>
+  <div class="flex w-full items-center gap-4">
+    <div class="flex-1">
+      <el-input v-model="searchText" placeholder="请输入接口名称" clearable>
+        <template #append>
+          <el-button :icon="SearchIcon" @click="search" />
+        </template>
+      </el-input>
+      <div
+        class="mt-4 h-[45vh] w-full flex-1 rounded-[var(--radius)] border-[1px] border-gray-200 dark:border-gray-700"
+      >
+        <!-- 全部数据 -->
+        <el-tree
+          class="h-full w-full overflow-y-auto bg-transparent py-2"
+          :data="treeData"
+          :props="treeProps"
+          default-expand-all
+          node-key="id"
+          :render-content="renderContent"
+          @node-click="handleNodeClick"
+        />
+      </div>
+    </div>
+    <div class="flex-1">
+      <div class="flex w-full items-center justify-between">
+        <div>已选（{{ selections.length }}）</div>
+        <el-button type="danger" link @click="handleClear">清空列表</el-button>
+      </div>
+      <!-- 已选列表 -->
+      <div
+        class="mt-4 h-[45vh] w-full flex-1 overflow-y-auto rounded-[var(--radius)] border-[1px] border-gray-200 px-4 py-2 dark:border-gray-700"
+      >
+        <template v-if="selections.length > 0">
+          <div
+            v-for="item in selections"
+            :key="item.id"
+            class="flex w-full items-center justify-between rounded-lg border-b border-gray-100 px-2 py-4 hover:bg-gray-50 dark:border-gray-700 dark:hover:bg-gray-800"
+          >
+            <div>{{ item.name }}</div>
+            <Icon
+              class="text-gray-500 hover:scale-125 dark:text-gray-400"
+              name="mdi:close"
+              clickable
+              @click="handleDelete(item)"
+            />
+          </div>
+        </template>
+        <el-empty v-else description="暂无数据" />
+      </div>
+    </div>
+  </div>
+</template>

package/src/views/data/interface-oauth/components/interface-table.vue

@@ -0,0 +1,70 @@
+<script setup lang="ts">
+import type { DataInterface } from '../../../../api/data-interface/types';
+
+import { onMounted, ref } from 'vue';
+
+import { Table } from '@udp/component-ui';
+
+import { getBindInterfaceList } from '../../../../api/interface-oauth';
+
+const props = defineProps<{
+  interfaceIds: string[];
+}>();
+
+const data = ref<DataInterface[]>([]);
+const columns = [
+  { prop: 'name', label: '接口名称', type: 'expand' },
+  { prop: 'code', label: '接口编码' },
+  { prop: 'requestUrl', label: '接口地址', minWidth: 120 },
+  { prop: 'method', label: '接口类型' },
+];
+
+const expandColumns = [
+  { prop: 'field', label: '参数名称' },
+  { prop: 'dataType', label: '参数类型' },
+  { prop: 'defaultValue', label: '默认值' },
+];
+
+const loadData = async () => {
+  // parameterJson
+  const res = await getBindInterfaceList(props.interfaceIds);
+  data.value = res?.map((item) => {
+    item.parameterJson = JSON.parse(item.parameterJson || '[]');
+    return item;
+  });
+};
+
+onMounted(() => {
+  if (props.interfaceIds.length > 0) {
+    loadData();
+  }
+});
+</script>
+
+<template>
+  <Table
+    :data="data"
+    :columns="columns"
+    :show-layout="false"
+    layout-type="table"
+    :show-expand="true"
+  >
+    <template #expand="{ row }">
+      <div class="w-full bg-[#f5f5f5] px-4 pb-2">
+        <Table
+          :data="row.parameterJson"
+          :columns="expandColumns"
+          :show-layout="false"
+          :show-toolbar="false"
+          :show-top-actions="false"
+          layout-type="table"
+          :header-cell-style="{
+            backgroundColor: '#f5f5f5 !important',
+          }"
+        />
+      </div>
+    </template>
+  </Table>
+</template>
+
+<style scoped lang="scss"></style>

package/src/views/data/interface-oauth/components/user-table.vue

@@ -0,0 +1,50 @@
+<script setup lang="ts">
+import { onMounted, ref } from 'vue';
+
+import { Table } from '@udp/component-ui';
+
+import { getBindAccountList } from '../../../../api/interface-oauth';
+
+const props = defineProps<{
+  id: string;
+}>();
+
+type UserItem = {
+  name: string;
+  userKey: string;
+};
+
+const data = ref<UserItem[]>([]);
+const columns = [
+  { prop: 'name', label: '用户' },
+  { prop: 'userKey', label: 'userKey' },
+];
+
+const getBindUserList = async () => {
+  const res = await getBindAccountList(props.id);
+  data.value =
+    res?.map((item) => {
+      return {
+        name: `${item.nickname}/${item.loginCode}`,
+        userKey: item.userKey,
+      };
+    }) || [];
+};
+
+onMounted(() => {
+  getBindUserList();
+});
+</script>
+
+<template>
+  <div class="h-full w-full overflow-y-hidden">
+    <Table
+      :data="data"
+      :columns="columns"
+      :show-layout="false"
+      layout-type="table"
+    />
+  </div>
+</template>
+
+<style scoped lang="scss"></style>

package/src/views/data/interface-oauth/components/verify-signature-description.vue

@@ -0,0 +1,290 @@
+<script setup lang="ts"></script>
+<template>
+  <div class="w-full">
+    <span class="text-lg font-bold">验证开启</span>
+    <p>验证签名关闭，不使用验证机制</p>
+    <p>
+      直接将appId和appSecret，按照 Authorization: appId::appSecret 格式加入到
+      Header 中。
+    </p>
+    <p>验证签名开启，使用下列签名验证机制</p>
+    <span class="text-lg font-bold">签名验证机制</span>
+    <p>
+      和第三方服务对接时，需要建立通讯双方的信任关系，以及确保通讯内容不被篡改，不被重放等。通常，我们采用
+      HTTPS 和 KeyId/SecretKey 的方式：
+    </p>
+    <ol>
+      <li>HTTPS 用来确定接收方的身份，利用公钥证书机制来保证。</li>
+      <li>
+        根据双方共享的一对 keyId/secret，使用 HMAC
+        签名机制，发送方对请求内容进行签名，并加入到Header中，接收方使用同样的方式对请求进行签名计算，比对签名结果用来判别发送方的身份。
+      </li>
+    </ol>
+    <p>
+      当前HTTP授权证书支持globalsign, symantec, geotrust,
+      comodo这四类，其余证书类型需要经过处理，暂时不推荐。
+    </p>
+    <p>本系统内采用appId/appSecret来进行签名。</p>
+    <span class="text-lg font-bold">签名过程</span>
+    <p>签名分为以下4个步骤:</p>
+    <ol>
+      <li>选择合适的签名方法</li>
+      <li>根据对应的签名，构建待签名的字符串</li>
+      <li>根据对应的签名算法和对应的appSecret，计算待签名字符串的 Hmac 签名</li>
+      <li>
+        将签名按规定格式加入到 Header: Authorization中。
+        <p>通常使用: Authorization: SignVersion:KeyId:Scope:Signature;</p>
+      </li>
+      <p>本系统内最终以KeyId:Signature规则展示</p>
+    </ol>
+    <span class="text-lg font-bold">签名方法</span>
+    <p>
+      为了使双方采用一致的算法计算签名，需要规定签名字符串的构建和签名算法，为了满足后续的签名算法升级，当前支持的签名方式为：
+      HmacSHA256
+    </p>
+    <p>待签名字符串，请按照以下顺序构建</p>
+    <ol>
+      <li>
+        <p>Http Method, 大写。例如 GET, POST。加上换行符 \n</p>
+      </li>
+      <li>
+        <p>URI Path。query params string 之前的部分。 加上换行符 \n</p>
+      </li>
+      <li>
+        <p>
+          Header 中的 YmDate， 以时间戳的形式，例如（2022-06-28
+          16:26:11=&gt;1656404771000）。加上换行符 \n
+        </p>
+        <p>
+          该时间将会用来判断请求有效性，限定一分钟之内有效。若无效返回验证超时。
+        </p>
+      </li>
+      <li>
+        <p>UserKey用于用户认证 \n</p>
+      </li>
+      <li>
+        <p>Header 中的 Host，为开发者自身的域名，加上换行符 \n</p>
+      </li>
+    </ol>
+    <p>Header规范化方法如下:</p>
+    <ol>
+      <li>将所有的 header name 都变成小写，按照字典序排序。</li>
+      <li>
+        对每一个小写的 name, 取出所有的对应的 value。如果有多个 value, 对所有的
+        value 进行字典序排序，用逗号 (,) 连接。
+      </li>
+      <li>对每一对 name, value。按照如下方式拼接：name:value\n (\n 为换行)</li>
+    </ol>
+    <span class="text-lg font-bold">计算待签名字符串的签名</span>
+    <p><b>签名使用的 Key</b></p>
+    <ol>
+      <li>
+        HmacSHA256 方式直接使用 appId 对应的 appSecret。通常这是一个32位 Base64
+        字符串，将其 Base64 decode 为字节数组。
+      </li>
+      <li>
+        其他方法，为了更加安全的保护 appSecret, 可能会使用特定的算法根据
+        appSecret 派生出新的签名用的 key。目前保留。
+      </li>
+    </ol>
+    <p><b>计算签名</b></p>
+    <ol>
+      <li>使用 HmacSha256 计算 Hmac 签名。</li>
+      <li>将待签名字符串，获取对应的 UTF-8 字节数组。</li>
+      <li>使用签名算法对待签名字节数组计算 Hmac 签名。</li>
+      <li>将签名结果变成 Hex 字符串。</li>
+      <li>
+        将签名结果，按照 Authorization: &lt;KeyId&gt;:&lt;Signature&gt;
+        格式加入到 Header 中。
+      </li>
+    </ol>
+    <span class="text-lg font-bold">签名示例</span>
+    <p>针对 appId, appSecret (abcde, xxxxxxxxxxxxxxxxyyyyyyyyyyyyyyyy)</p>
+    <p>
+      appId和appSecret为必传参数。可以添加为请求头参数（Header）如：abcde:xxxxxxxxxxxxxxxxyyyyyyyyyyyyyyyy
+    </p>
+    <p>
+      其他参数：如果是GET请求，统一路径传参；如果是POST请求，统一Body-application/json传参。
+    </p>
+    <span class="text-lg font-bold">GET 请求：</span>
+    <p>
+      <em>GET</em>
+      /api/system/DataInterface/{id}/Actions/Response?tenantId=xxxxx&amp;name=abc<br />
+      Host : localhost:30000<br />
+      YmDate : 1656404771000<br />
+      UserKey : xxxxxxx<br />
+    </p>
+    <p>按照规则生成的待签名字符串如下：</p>
+    <table class="table-bordered table">
+      <thead>
+        <tr>
+          <th>签名结果</th>
+          <th>说明</th>
+        </tr>
+      </thead>
+      <tbody>
+        <tr>
+          <td>待签名字段名</td>
+          <td>待签名字段值</td>
+        </tr>
+        <tr>
+          <td>Http Method</td>
+          <td>GET</td>
+        </tr>
+        <tr>
+          <td>URL Path</td>
+          <td>/api/system/DataInterface/{id}/Actions/Response</td>
+        </tr>
+        <tr>
+          <td>YmDate</td>
+          <td>1656404771000</td>
+        </tr>
+        <tr>
+          <td>UserKey</td>
+          <td>xxxxxxx</td>
+        </tr>
+        <tr>
+          <td>Host</td>
+          <td>localhost:30000</td>
+        </tr>
+        <tr>
+          <td>最终待签名字符串</td>
+          <td>
+            以下 \n 表明换行<br />GET\n<br />/api/system/DataInterface/{id}/Actions/Response\n<br />1656404771000\n
+            <br />localhost:30000\n<br />
+          </td>
+        </tr>
+        <tr>
+          <td>最终计算的 Authorization header</td>
+          <td>
+            Authorization:
+            abcde::5a13e56353da7954a96605c7f21f0f14a26a49baf387f95e600cdbdd7f0dc604
+          </td>
+        </tr>
+      </tbody>
+    </table>
+    <span class="text-lg font-bold">POST 请求：</span>
+    <p>
+      <em>
+        POST /api/system/DataInterface/{id}/Actions/Response<br />
+        Host : localhost:30000<br />
+        YmDate : 1656404771000<br />
+        UserKey : xxxxxxx<br />
+        body参数json格式如：{"tenantId":"123","name":"abc"}
+      </em>
+    </p>
+    <p>按照规则生成的待签名字符串如下：</p>
+    <table class="table-bordered table">
+      <thead>
+        <tr>
+          <th>签名结果</th>
+          <th></th>
+        </tr>
+      </thead>
+      <tbody>
+        <tr>
+          <td>待签名字段名</td>
+          <td>待签名字段值</td>
+        </tr>
+        <tr>
+          <td>Http Method</td>
+          <td>POST</td>
+        </tr>
+        <tr>
+          <td>URL Path</td>
+          <td>/api/system/DataInterface/{id}/Actions/Response</td>
+        </tr>
+        <tr>
+          <td>YmDate</td>
+          <td>1656404771000</td>
+        </tr>
+        <tr>
+          <td>UserKey</td>
+          <td>xxxxxxx</td>
+        </tr>
+        <tr>
+          <td>Host</td>
+          <td>localhost:30000</td>
+        </tr>
+        <tr>
+          <td>最终待签名字符串</td>
+          <td>
+            以下 \n 表明换行<br />POST\n<br />/hmac/testPost\n<br />1656404771000\n
+            <br />localhost:30000\n<br />
+          </td>
+        </tr>
+        <tr>
+          <td>最终计算的 Authorization header</td>
+          <td>
+            Authorization :
+            abcde::7af664ac15b675633bc13a3ab03adc2d0c6e3834999785698e5830ae215a8545
+          </td>
+        </tr>
+      </tbody>
+    </table>
+    <span class="text-lg font-bold">(java版)生成待签名字符串及Authorization代码示例:</span>
+    <pre
+      class="language-java"
+    ><code class="language-java"><span class="token keyword">import</span> org<span class="token punctuation">.</span>apache<span class="token punctuation">.</span>commons<span class="token punctuation">.</span>codec<span class="token punctuation">.</span>binary<span class="token punctuation">.</span>Base64<span class="token punctuation">;</span>
+<span class="token keyword">import</span> org<span class="token punctuation">.</span>apache<span class="token punctuation">.</span>commons<span class="token punctuation">.</span>codec<span class="token punctuation">.</span>binary<span class="token punctuation">.</span>Hex<span class="token punctuation">;</span>
+<span class="token keyword">import</span> javax<span class="token punctuation">.</span>crypto<span class="token punctuation">.</span>Mac<span class="token punctuation">;</span>
+<span class="token keyword">import</span> javax<span class="token punctuation">.</span>crypto<span class="token punctuation">.</span>spec<span class="token punctuation">.</span>SecretKeySpec<span class="token punctuation">;</span>
+<span class="token keyword">import</span> java<span class="token punctuation">.</span>io<span class="token punctuation">.</span>UnsupportedEncodingException<span class="token punctuation">;</span>
+<span class="token keyword">import</span> java<span class="token punctuation">.</span>security<span class="token punctuation">.</span>InvalidKeyException<span class="token punctuation">;</span>
+<span class="token keyword">import</span> java<span class="token punctuation">.</span>security<span class="token punctuation">.</span>NoSuchAlgorithmException<span class="token punctuation">;</span>
+<span class="token keyword">public</span> <span class="token keyword">class</span> <span class="token class-name">EncryDemo</span> <span class="token punctuation">{</span>
+    <span class="token keyword">public</span> <span class="token keyword">static</span> <span class="token keyword">void</span> <span class="token function">main</span><span class="token punctuation">(</span>String<span class="token punctuation">[</span><span class="token punctuation">]</span> args<span class="token punctuation">)</span> <span class="token keyword">throws</span> NoSuchAlgorithmException<span class="token punctuation">,</span> InvalidKeyException<span class="token punctuation">,</span> UnsupportedEncodingException <span class="token punctuation">{</span>
+        String secret <span class="token operator">=</span> <span class="token string">"xxxxxxxxxxxxxxxxyyyyyyyyyyyyyyyy"</span><span class="token punctuation">;</span>
+        String algorithmForMac <span class="token operator">=</span> <span class="token string">"HmacSHA256"</span><span class="token punctuation">;</span>
+        String method <span class="token operator">=</span> <span class="token string">"POST"</span><span class="token punctuation">;</span>
+        String urlPath <span class="token operator">=</span> <span class="token string">"/api/system/DataInterface/{id}/Actions/Response"</span><span class="token punctuation">;</span>
+        String YmDate <span class="token operator">=</span> <span class="token string">"1656404771000"</span><span class="token punctuation">;</span>
+        String host <span class="token operator">=</span> <span class="token string">"localhost:30000"</span><span class="token punctuation">;</span>
+        String source <span class="token operator">=</span> <span class="token keyword">new</span> <span class="token class-name">StringBuilder()</span>
+                      <span class="token punctuation">.</span><span class="token function">append</span>(method)<span class="token punctuation">.</span><span class="token function">append</span><span class="token punctuation">(</span><span class="token string">'\n'</span><span class="token punctuation">)</span>
+                      <span class="token punctuation">.</span><span class="token function">append</span>(url)<span class="token punctuation">.</span><span class="token function">append</span><span class="token punctuation">(</span><span class="token string">'\n'</span><span class="token punctuation">)</span>
+                      <span class="token punctuation">.</span><span class="token function">append</span>(ymdate)<span class="token punctuation">.</span><span class="token function">append</span><span class="token punctuation">(</span><span class="token string">'\n'</span><span class="token punctuation">)</span>
+                      <span class="token punctuation">.</span><span class="token function">append</span>(host)<span class="token punctuation">.</span><span class="token function">append</span><span class="token punctuation">(</span><span class="token string">'\n'</span><span class="token punctuation">)</span><span class="token punctuation">.toString();</span>
+        Mac mac <span class="token operator">=</span> Mac<span class="token punctuation">.</span><span class="token function">getInstance</span><span class="token punctuation">(</span>algorithmForMac<span class="token punctuation">)</span><span class="token punctuation">;</span>
+        SecretKeySpec secretKeySpec <span class="token operator">=</span> <span class="token keyword">new</span> <span class="token class-name">SecretKeySpec</span><span class="token punctuation">(</span>Base64<span class="token punctuation">.</span><span class="token function">decodeBase64</span><span class="token punctuation">(</span>secret<span class="token punctuation">)</span><span class="token punctuation">,</span> algorithmForMac<span class="token punctuation">)</span><span class="token punctuation">;</span>
+        mac<span class="token punctuation">.</span><span class="token function">init</span><span class="token punctuation">(</span>secretKeySpec<span class="token punctuation">)</span><span class="token punctuation">;</span>
+        String signature <span class="token operator">=</span> Hex<span class="token punctuation">.</span><span class="token function">encodeHexString</span><span class="token punctuation">(</span>mac<span class="token punctuation">.</span><span class="token function">doFinal</span><span class="token punctuation">(</span>source<span class="token punctuation">.</span><span class="token function">getBytes</span><span class="token punctuation">(</span><span class="token string">"utf-8"</span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
+        System<span class="token punctuation">.</span>out<span class="token punctuation">.</span><span class="token function">println</span><span class="token punctuation">(</span>signature<span class="token punctuation">)</span><span class="token punctuation">;</span>
+    <span class="token punctuation">}</span>
+<span class="token punctuation">}</span>
+</code></pre>
+    <span class="text-lg font-bold">(.net版)生成待签名字符串及Authorization代码示例:</span>
+    <pre
+      class="language-java"
+    ><code class="language-java"><span class="token keyword">using</span><span> System.Security.Cryptography;</span>
+<span class="token keyword">using</span><span> System.Text;</span>
+<span class="token keyword">using</span><span> JNPF.Common.Extension;</span>
+<span class="token keyword">namespace JNPF.Systems.System</span>
+<span class="token punctuation">{</span>
+    <span class="token keyword"> internal class Class1</span>
+    <span class="token punctuation">{</span>
+      <span class="token keyword"> static void Main(string[] args)</span>
+      <span class="token punctuation">{</span>
+        String secret <span class="token operator">=</span> <span class="token string">"xxxxxxxxxxxxxxxxyyyyyyyyyyyyyyyy"</span><span class="token punctuation">;</span>
+        String method <span class="token operator">=</span> <span class="token string">"POST"</span><span class="token punctuation">;</span>
+        String urlPath <span class="token operator">=</span> <span class="token string">"/api/system/DataInterface/{id}/Actions/Response"</span><span class="token punctuation">;</span>
+        String YmDate <span class="token operator">=</span> <span class="token string">"1656404771000"</span><span class="token punctuation">;</span>
+        String host <span class="token operator">=</span> <span class="token string">"localhost:30000"</span><span class="token punctuation">;</span>
+        String source <span class="token operator">=</span> <span class="token keyword">new</span> <span class="token class-name">StringBuilder()</span>
+                      <span class="token punctuation">.</span><span class="token function">Append</span>(method)<span class="token punctuation">.</span><span class="token function">Append</span><span class="token punctuation">(</span><span class="token string">'\n'</span><span class="token punctuation">)</span>
+                      <span class="token punctuation">.</span><span class="token function">Append</span>(url)<span class="token punctuation">.</span><span class="token function">Append</span><span class="token punctuation">(</span><span class="token string">'\n'</span><span class="token punctuation">)</span>
+                      <span class="token punctuation">.</span><span class="token function">Append</span>(ymdate)<span class="token punctuation">.</span><span class="token function">Append</span><span class="token punctuation">(</span><span class="token string">'\n'</span><span class="token punctuation">)</span>
+                      <span class="token punctuation">.</span><span class="token function">Append</span>(host)<span class="token punctuation">.</span><span class="token function">Append</span><span class="token punctuation">(</span><span class="token string">'\n'</span><span class="token punctuation">)</span><span class="token punctuation">.ToString();</span>
+        <span>using (var hmac = </span><span class="token keyword">new</span><span> HMACSHA256(secret.</span><span class="token function">ToBytes</span><span>(Encoding.UTF8)))</span>
+        <span class="token punctuation">{</span>
+          <span>byte[] hashmessage = hmac.</span><span class="token function">ComputeHash</span><span>(source.</span><span class="token function">ToBytes</span><span>(Encoding.UTF8));</span>
+          <span>var signature = hashmessage.</span><span class="token function">ToHexString</span><span>();</span>
+          <span>Console.</span><span class="token function">WriteLine</span><span>(signature);</span>
+          <span>Console.</span><span class="token function">ReadKey</span><span>();</span>
+        <span class="token punctuation">}</span>
+      <span class="token punctuation">}</span>
+    <span class="token punctuation">}</span>
+<span class="token punctuation">}</span>
+</code></pre>
+  </div>
+</template>