update readme

README.md

@@ -3,6 +3,8 @@
 
 使用 Vue 、ts 和 Vite 创建 kintone plugin 的初始化模板，先由 [create-plugin](https://cybozu.dev/ja/kintone/sdk/development-environment/create-plugin/) 生成之后再手动引入 Vue。
 
+并且提供了 [License 检查](#License-检查) 的功能。
+
 > プラグイン開発手順：https://cybozu.dev/ja/kintone/tips/development/plugins/development-plugin/
 
 包括了以下 kintone 库：
@@ -76,6 +78,18 @@ npm install # 或 yarn
 }
 ```
 
+3. 如果需要使用 License 检查，请参考： [License 检查](#License-检查)
+
+一般需要修改 `LicenseStatus.vue` 里面的 `purchaseLicense()` 中打开的链接。
+
+```diff
+function purchaseLicense() {
+  // ...
++  window.open(`修改购买页面，或者重用也不是不可以`)
+-  window.open(`https://alisurvey.alicorns.co.jp/s/Iuc5RxZv?${queryParams}`);
+}
+```
+
 
 # 编译流程
 
@@ -161,6 +175,8 @@ npm run build-upload # 或 yarn build-upload
 ├── package.json
 ├── private.ppk              # 当前 plugin 密钥，首次 build 自动生成
 ├── README.md
+├── rsa_private.pem          # license 验证密钥
+├── rsa_public.pem           # license 公钥，需要被添加到密钥检查的后端系统中
 ├── tsconfig.json
 └── vite.config.ts           # 主要的 vite 配置
 └── vite.iife.config.ts      # 用于打包 desktop/mobile 文件的配置
@@ -229,7 +245,6 @@ client.app...
 ```
 
 
-
 ## 关于 i18n
 
 在 desktop/mobile：
@@ -439,3 +454,57 @@ kuc 没有实现插槽，所以应该当成一个普通组件使用：
 const buyButton = shallowRef<HTMLButtonElement | null>(null);
 </script>
 ```
+
+---
+
+## License 检查
+
+目前 License 的检查使用的是后端传一个 RSA 密钥加密的 JWT，前端使用公钥验证是否被修改过，并且保存在 Localstorage 中。
+
+每隔一天都会从后端重新获取新的 License 信息。
+
+默认试用是 30 天，还剩 7 天的时候会进行提醒。（在 `license-service.ts` 中修改）
+
+当点击购买的时候，会跳转到一个外部网站，这里可以使用 AliSurvey 进行表单填写。
+
+
+### 创建密钥
+
+创建密钥可以使用 openssl 命令行工具：
+
+```sh
+openssl genrsa -out ./rsa_private.pem 2048
+```
+
+然后公钥可以放在同一个文件夹中：
+
+```sh
+openssl rsa -in ./rsa_private.pem -pubout -out ./rsa_public.pem
+```
+
+> 公钥需要被放到后端系统中
+
+
+### 使用
+
+在 desktop/mobile 中只要在所有的逻辑外部多包裹一层 `LicenseService.loadPluginIfAuthorized()` ：
+
+```ts
+kintone.events.on('app.record.index.show', async () => {
+  LicenseService.loadPluginIfAuthorized(PLUGIN_ID,    // <--- 内部会进行 license 判断
+    async () => {
+      // 已有的逻辑代码
+    },
+  );
+});
+```
+
+在 vue 中只要在顶部引入 ` LicenseStatus.vue`：
+
+```vue
+<template>
+  <!-- 许可证状态信息 -->
+  <LicenseStatus />
+
+  <h2 class="settings-heading">{{ $t('config.title') }}</h2>
+```

src/components/LicenseStatus.vue

@@ -141,7 +141,20 @@ function purchaseLicense() {
   const { name, email } = kintone.getLoginUser();
   const domain = licenseInfo.value?.domain;
   const pluginId = licenseInfo.value?.pluginId;
-  window.open(`https://alisurvey.alicorns.co.jp/s/Iuc5RxZv?input1761283180784=${domain}&input1761283200616=${pluginId}&input1761283314263=${name}&input1761283275767=${email}`);
+
+  const params = {
+    name: { inputId: 'input1761283314263', value: name },
+    email: { inputId: 'input1761283275767', value: email },
+    domain: { inputId: 'input1761283180784', value: domain },
+    pluginId: { inputId: 'input1761283200616', value: pluginId }
+  };
+
+  const queryParams = Object.values(params)
+    .filter(param => param.value)
+    .map(param => `${param.inputId}=${encodeURIComponent(param.value as string)}`)
+    .join('&');
+
+  window.open(`https://alisurvey.alicorns.co.jp/s/Iuc5RxZv?${queryParams}`);
 }
 
 function hidePaidMsg() {