update front development guide

front/README.md

@@ -0,0 +1,57 @@
+# contract-java-example 前端开发说明
+
+前端与后端支持分离开发。注意，启动好docker与后端之后，可单独对前端进行调试和开发。
+注意在单独开发前端时，需将后端地址设置为可配置的选项。
+当前端代码与后端代码打包到一起之后，前端中的`./index.html`文件会映射为`http://host:port/DOIP/ContractExample/assets/index.html`。
+因此，后端的地址可通过以下代码计算得出：
+```javascript
+var url = document.location.href.replaceAll(/\/DOIP.*$/g,'/SCIDE')
+// 对应后端地址为：url = 'http://host:port/SCIDE';
+```
+前端代码成功打包之后，可通过以下路径分访问前端页面。
+```json
+http://127.0.0.1:21030/DOIP/ContractExample/assets/vite/dist/index.html
+http://127.0.0.1:21030/DOIP/ContractExample/assets/html/index.html
+```
+
+
+## 使用html/js
+见`html/index.html`。
+引用sdk及其依赖的js文件。
+```
+    <script src="./cryptico.iife.js"></script>
+    <script src="./sm2.js"></script>
+    <script src="./axios-fetch.iife.js"></script>
+    <script src="./axios.min.js"></script>
+    <script src="./bdcontract-sdk.iife.js"></script>
+```
+
+### 调试与开发
+可在本地安装npm，利用`npm install -g http-server`来安装一个简单的httpserver。
+在命令行中可启动该服务器，托管前端代码。
+```
+cd ./front/html
+http-server
+```
+后续仅需修改`front/html`下的前端文件即可。
+
+
+## 使用ts+vite等框架开发前端
+[前端sdk](https://www.npmjs.com/package/@bdware/bdcontract-sdk) 在npm仓库中。
+调用示例参考：`front/vite/src/main.ts`。
+
+```javascript
+const url = 'http://127.0.0.1:21030/SCIDE';
+var sm2Key = {"publicKey": "04180354fdb6507f8ab98ccfbe165ce11da74ba733f81af86ad6d32216b32cf4f797c559d50ceeefbf4c760c3483840471c67471b90acdffb388cd7d496d9a1610",
+               "privateKey": "1d4196947f59532db6f8f4055e58474a48db8f30b476ae3edc66406464521b3b"};
+const client = new HttpClient(url, sm2Key);
+const data = await client.executeContract(
+    'ContractExample',
+    'callHello',
+    'abc');
+alert(data.data);
+```
+### 调试与开发
+打开命令行，在`front/vite`目录下，使用`npm run dev`，开启调试，
+打开按命令行中的提示地下，打开浏览器页面，如`http://localhost:3000/`即可。
+