Add basic type check for Item value

CHANGES.md

@@ -27,6 +27,7 @@ Apollo 2.1.0
 * [fix the deleted at timestamp issue](https://github.com/apolloconfig/apollo/pull/4493)
 * [add configuration processor for portal developers](https://github.com/apolloconfig/apollo/pull/4521)
 * [Add a potential json value check feature](https://github.com/apolloconfig/apollo/pull/4519)
+* [Add basic type check for Item value](https://github.com/apolloconfig/apollo/pull/4542)
 
 ------------------
 All issues and pull requests are [here](https://github.com/apolloconfig/apollo/milestone/11?closed=1)

apollo-adminservice/src/main/java/com/ctrip/framework/apollo/adminservice/controller/ItemController.java

@@ -143,7 +143,8 @@ public ItemDTO update(@PathVariable("appId") String appId,
 
     Item beforeUpdateItem = BeanUtils.transform(Item.class, managedEntity);
 
-    //protect. only value,comment,lastModifiedBy can be modified
+    //protect. only value,type,comment,lastModifiedBy can be modified
+    managedEntity.setType(entity.getType());
     managedEntity.setValue(entity.getValue());
     managedEntity.setComment(entity.getComment());
     managedEntity.setDataChangeLastModifiedBy(entity.getDataChangeLastModifiedBy());

apollo-biz/src/main/java/com/ctrip/framework/apollo/biz/entity/Item.java

@@ -38,6 +38,9 @@ public class Item extends BaseEntity {
   @Column(name = "key", nullable = false)
   private String key;
 
+  @Column(name = "type")
+  private int type;
+
   @Column(name = "value")
   @Lob
   private String value;
@@ -88,8 +91,17 @@ public void setLineNum(Integer lineNum) {
     this.lineNum = lineNum;
   }
 
+  public int getType() {
+    return type;
+  }
+
+  public void setType(int type) {
+    this.type = type;
+  }
+
   public String toString() {
-    return toStringHelper().add("namespaceId", namespaceId).add("key", key).add("value", value)
-        .add("lineNum", lineNum).add("comment", comment).toString();
+    return toStringHelper().add("namespaceId", namespaceId).add("key", key)
+            .add("type", type).add("value", value)
+            .add("lineNum", lineNum).add("comment", comment).toString();
   }
 }

apollo-common/src/main/java/com/ctrip/framework/apollo/common/dto/ItemDTO.java

@@ -25,6 +25,8 @@ public class ItemDTO extends BaseDTO{
 
   private String key;
 
+  private int type;
+
   private String value;
 
   private String comment;
@@ -90,4 +92,12 @@ public void setLineNum(int lineNum) {
     this.lineNum = lineNum;
   }
 
+  public int getType() {
+    return type;
+  }
+
+  public void setType(int type) {
+    this.type = type;
+  }
+
 }

apollo-portal/src/main/resources/static/i18n/zh-CN.json

@@ -68,15 +68,24 @@
   "Component.ConfigItem.ModifyItem": "修改配置项",
   "Component.ConfigItem.ItemKey": "Key",
   "Component.ConfigItem.ItemValue": "Value",
-  "Component.ConfigItem.ItemValueTips": "注意: 隐藏字符（空格、换行符、制表符Tab）容易导致配置出错，如果需要检测 Value 中隐藏字符，请点击",
-  "Component.ConfigItem.ItemValueShowDetection": "检测隐藏字符",
-  "Component.ConfigItem.ItemValueNotHiddenChars": "无隐藏字符",
+  "Component.ConfigItem.ItemValueTips": "注意: 特殊字符(空格、换行符、制表符Tab、中文逗号)容易导致配置出错，如果需要检测 Value 中特殊字符，请点击",
+  "Component.ConfigItem.ItemValueShowDetection": "检测特殊字符",
+  "Component.ConfigItem.ItemValueNotHiddenChars": "无特殊字符",
   "Component.ConfigItem.ItemJSONValueTips": "注意: 检测JSON字符串格式是否正确，请点击",
   "Component.ConfigItem.ItemJSONValueDetection": "检测JSON格式",
   "Component.ConfigItem.ValidItemJSONValue": "JSON格式正确",
   "Component.ConfigItem.InvalidItemJSONValue": "JSON格式错误",
   "Component.ConfigItem.ItemComment": "Comment",
   "Component.ConfigItem.ChooseCluster": "选择集群",
+  "Component.ConfigItem.ItemTypeName": "类型",
+  "Component.ConfigItem.ItemTypeString": "String",
+  "Component.ConfigItem.ItemTypeNumber": "Number",
+  "Component.ConfigItem.ItemTypeBoolean": "Boolean",
+  "Component.ConfigItem.ItemTypeJson": "Json",
+  "Component.ConfigItem.ItemNumberError": "非法 Number",
+  "Component.ConfigItem.ItemJsonError": "JSON 格式不正确",
+  "Component.ConfigItem.ItemTypeTrue": "true",
+  "Component.ConfigItem.ItemTypeFalse": "false",
   "Component.MergePublish.Title": "全量发布",
   "Component.MergePublish.Tips": "全量发布将会把灰度版本的配置合并到主分支，并发布。",
   "Component.MergePublish.NextStep": "全量发布后,您希望",
@@ -124,6 +133,7 @@
   "Component.Namespace.MasterBranch.Body.PublishState": "发布状态",
   "Component.Namespace.MasterBranch.Body.ItemKey": "Key",
   "Component.Namespace.MasterBranch.Body.ItemValue": "Value",
+  "Component.Namespace.MasterBranch.Body.ItemType": "类型",
   "Component.Namespace.MasterBranch.Body.ItemComment": "备注",
   "Component.Namespace.MasterBranch.Body.ItemLastModify": "最后修改人",
   "Component.Namespace.MasterBranch.Body.ItemLastModifyTime": "最后修改时间",
@@ -132,6 +142,10 @@
   "Component.Namespace.MasterBranch.Body.ItemNoPublish": "未发布",
   "Component.Namespace.MasterBranch.Body.ItemEffective": "已生效的配置",
   "Component.Namespace.MasterBranch.Body.ItemPublished": "已发布",
+  "Component.Namespace.MasterBranch.Body.ItemTypeString": "String",
+  "Component.Namespace.MasterBranch.Body.ItemTypeNumber": "Number",
+  "Component.Namespace.MasterBranch.Body.ItemTypeBoolean": "Boolean",
+  "Component.Namespace.MasterBranch.Body.ItemTypeJson": "Json",
   "Component.Namespace.MasterBranch.Body.AddedItem": "新增的配置",
   "Component.Namespace.MasterBranch.Body.ModifyItem": "修改此灰度配置",
   "Component.Namespace.Branch.GrayScaleRule.NoPermissionTips": "您没有权限编辑灰度规则, 具有 Namespace 修改权或者发布权的人员才可以编辑灰度规则. 如需要编辑灰度规则,请找应用管理员申请权限.",
@@ -813,6 +827,7 @@
   "ItemModal.Tabs": "制表符",
   "ItemModal.NewLine": "换行符",
   "ItemModal.Space": "空格",
+  "ItemModal.ChineseComma": "中文逗号",
   "ApolloNsPanel.LoadingHistoryError": "加载修改历史记录出错",
   "ApolloNsPanel.LoadingGrayscaleError": "加载修改历史记录出错",
   "ApolloNsPanel.Deleted": "删除成功",

apollo-portal/src/main/resources/static/scripts/controller/config/ConfigNamespaceController.js

@@ -250,7 +250,7 @@ function controller($rootScope, $scope, $translate, toastr, AppUtil, EventManage
         }
 
         $scope.item = _.clone(toEditItem);
-
+        $scope.item.type = String($scope.item.type || 0)
         if (namespace.isBranch || namespace.isLinkedNamespace) {
             var existedItem = false;
             namespace.items.forEach(function (item) {
@@ -283,6 +283,9 @@ function controller($rootScope, $scope, $translate, toastr, AppUtil, EventManage
         $scope.item = {
             tableViewOperType: 'create'
         };
+        $scope.item.type = '0';
+        $scope.showNumberError = false;
+        $scope.showJsonError = false;
 
         $scope.toOperationNamespace = namespace;
         AppUtil.showModal('#itemModal');

apollo-portal/src/main/resources/static/scripts/directive/item-modal-directive.js

@@ -41,6 +41,8 @@ function itemModalDirective($translate, toastr, $sce, AppUtil, EventManager, Con
             scope.showHiddenChars = showHiddenChars;
             scope.detectJSON = detectJSON;
             scope.check = check;
+            scope.changeType = changeType;
+            scope.verifyLoseFocus = verifyLoseFocus;
 
             $('#itemModal').on('show.bs.modal', function (e) {
                 scope.showHiddenCharsContext = false;
@@ -57,12 +59,49 @@ function itemModalDirective($translate, toastr, $sce, AppUtil, EventManager, Con
 
             $("#valueEditor").textareafullscreen();
 
+            function verifyLoseFocus() {
+                if (scope.item.type == '1') {
+                    //校验类型为Number的时候输入框的值是否满足
+                    let regNumber = /-[0-9]+(\\.[0-9]+)?|[0-9]+(\\.[0-9]+)?/
+                    if (regNumber.test(Number(scope.item.value)) == true) {
+                        scope.showNumberError = false
+                    } else {
+                        scope.showNumberError = true
+                    }
+                } else if (scope.item.type == '3') {
+                    checkJson(scope.item.value)
+                } else {
+                    scope.showNumberError = false
+                    scope.showJsonError = false
+                }
+            }
+            // 数字 null  字符串 true  false 是合法json 这里暂时排除掉这些内容 为了规范格式
+            function checkJson(str) {
+                if (str.trim() == 'null') {
+                    scope.showJsonError = true
+                } else {
+                    try {
+                        if (!(typeof JSON.parse(str) == 'object')) {
+                            scope.showJsonError = true
+                        } else {
+                            scope.showJsonError = false
+                        }
+                    } catch (error) {
+                        scope.showJsonError = true
+                    }
+                }
+            }
+
             function doItem() {
 
                 if (!scope.item.value) {
                     scope.item.value = "";
                 }
 
+                if (scope.item.type) {
+                    scope.item.type = Number(scope.item.type)
+                }
+
                 if (scope.item.tableViewOperType == TABLE_VIEW_OPER_TYPE.CREATE) {
 
                     //check key unique
@@ -163,6 +202,24 @@ function itemModalDirective($translate, toastr, $sce, AppUtil, EventManager, Con
                 selectedClusters = data;
             }
 
+            function changeType() {
+                scope.showNumberError = false
+                scope.showJsonError = false
+                if (scope.item.type == '2') {
+                    scope.item.lastValue = scope.item.value
+                    scope.item.value = 'false'
+                } else {
+                    if (scope.item.lastType =='2') {
+                        scope.item.value = scope.item.lastValue
+                    } else {
+                        // String Number Json互相切换不做更改
+                    }
+                }
+
+                scope.item.lastType = scope.item.type
+                verifyLoseFocus()
+            }
+
             function check(){
                 var value = scope.item.value;
                 if (!value || value.length < 2) {
@@ -220,7 +277,7 @@ function itemModalDirective($translate, toastr, $sce, AppUtil, EventManager, Con
             }
 
             function isHiddenChar(c) {
-                return c == '\t' || c == '\n' || c == ' ';
+                return c == '\t' || c == '\n' || c == ' ' || c == '，';
             }
 
             function viewHiddenChar(c) {
@@ -231,6 +288,8 @@ function itemModalDirective($translate, toastr, $sce, AppUtil, EventManager, Con
                     return '<mark>#' + $translate.instant('ItemModal.NewLine') + '#</mark>';
                 } else if (c == ' ') {
                     return '<mark>#' + $translate.instant('ItemModal.Space') + '#</mark>';
+                } else if (c == '，') {
+                    return '<mark>#' + $translate.instant('ItemModal.ChineseComma') + '#</mark>';
                 }
 
             }

apollo-portal/src/main/resources/static/views/component/item-modal.html

@@ -43,14 +43,34 @@ <h4 class="modal-title">
                     </div>
                 </div>
                 <div class="form-group">
-                    <label class="col-sm-2 control-label">{{'Component.ConfigItem.ItemValue' | translate }}</label>
+                    <label class="col-sm-2 control-label">
+                        <apollorequiredfield></apollorequiredfield>
+                        {{'Component.ConfigItem.ItemTypeName' | translate }}
+                    </label>
                     <div class="col-sm-10" valdr-form-group>
+                        <select class="form-control" name="type" ng-model="item.type" ng-change="changeType()">
+                            <option value="0">{{'Component.ConfigItem.ItemTypeString' | translate }}</option>
+                            <option value="1">{{'Component.ConfigItem.ItemTypeNumber' | translate }}</option>
+                            <option value="2">{{'Component.ConfigItem.ItemTypeBoolean' | translate }}</option>
+                            <option value="3">{{'Component.ConfigItem.ItemTypeJson' | translate }}</option>
+                        </select>
+                    </div>
+                </div>
+                <div class="form-group">
+                    <label class="col-sm-2 control-label">{{'Component.ConfigItem.ItemValue' | translate }}</label>
+                    <div class="col-sm-10" valdr-form-group ng-show="item.type != '2'">
                         <textarea id="valueEditor" name="value" class="form-control" rows="6" tabindex="2"
-                            ng-required="false" ng-model="item.value" ng-change="check()">
+                            ng-required="false" ng-model="item.value" ng-change="check()" ng-blur="verifyLoseFocus()">
                             </textarea>
                         {{'Component.ConfigItem.ItemValueTips' | translate }} <a
                             ng-click="showHiddenChars()">{{'Component.ConfigItem.ItemValueShowDetection' | translate }}</a>
                         <br>
+                        <div ng-show="showNumberError" ng-model="showNumberError" style="color:red">
+                            {{'Component.ConfigItem.ItemNumberError' | translate }}
+                        </div>
+                        <div ng-show="showJsonError" ng-model="showJsonError" style="color:red">
+                            {{'Component.ConfigItem.ItemJsonError' | translate }}
+                        </div>
                         <div ng-show="showCheckJSONHint">
                             {{'Component.ConfigItem.ItemJSONValueTips' | translate }} <a
                                 ng-click="detectJSON()">{{'Component.ConfigItem.ItemJSONValueDetection' | translate }}</a>
@@ -63,6 +83,12 @@ <h4 class="modal-title">
                         <div class="bg-info" ng-bind-html="jsonDetectResult"
                              ng-show="showJSONDetectContext"></div>
                     </div>
+                    <div class="col-sm-10" valdr-form-group ng-show="item.type == '2'">
+                        <select class="form-control" name="value" ng-model="item.value">
+                            <option value="true">{{'Component.ConfigItem.ItemTypeTrue' | translate }}</option>
+                            <option value="false">{{'Component.ConfigItem.ItemTypeFalse' | translate }}</option>
+                        </select>
+                    </div>
 
 
                 </div>
@@ -92,7 +118,7 @@ <h4 class="modal-title">
                     {{'Common.Cancel' | translate }}
                 </button>
                 <button type="submit" class="btn btn-primary"
-                    ng-disabled="itemForm.$invalid || (item.addItemBtnDisabled && item.tableViewOperType == 'create')">
+                    ng-disabled="itemForm.$invalid || (item.addItemBtnDisabled && item.tableViewOperType == 'create') || showNumberError || showJsonError ">
                     {{'Common.Submit' | translate }}
                 </button>
             </div>

apollo-portal/src/main/resources/static/views/component/namespace-panel-master-tab.html

@@ -291,7 +291,9 @@
                                     ng-click="col='item.key';desc=!desc;">
                                     {{'Component.Namespace.Master.Items.Body.ItemKey' | translate }} 
                                     <span class="glyphicon glyphicon-sort"></span>
-
+                                </th>
+                                <th>
+                                    {{'Component.Namespace.MasterBranch.Body.ItemType' | translate }}
                                 </th>
                                 <th>
                                     {{'Component.Namespace.Master.Items.Body.ItemValue' | translate }}
@@ -350,13 +352,23 @@
                                         data-placement="bottom"
                                         title="{{'Component.Namespace.Master.Items.Body.DeletedTips' | translate }}">{{'Component.Namespace.Master.Items.Body.Deleted' | translate }}</span>
                                 </td>
-                                <td width="30%" class="cursor-pointer"
+                                <td width="7%" class="text-center">
+                                    <span ng-if="config.item.type == '0'"
+                                    >{{'Component.Namespace.MasterBranch.Body.ItemTypeString' | translate }}</span>
+                                    <span ng-if="config.item.type == '1'"
+                                    >{{'Component.Namespace.MasterBranch.Body.ItemTypeNumber' | translate }}</span>
+                                    <span ng-if="config.item.type == '2'"
+                                    >{{'Component.Namespace.MasterBranch.Body.ItemTypeBoolean' | translate }}</span>
+                                    <span ng-if="config.item.type == '3'"
+                                    >{{'Component.Namespace.MasterBranch.Body.ItemTypeJson' | translate }}</span>
+                                </td>
+                                <td width="25%" class="cursor-pointer"
                                     title="{{'Component.Namespace.Master.Items.Body.ClickToSee' | translate }}"
                                     ng-click="showText(config.item.value)">
                                     <span ng-bind="config.item.value | limitTo: 250"></span>
                                     <span ng-bind="config.item.value.length > 250 ? '...': ''"></span>
                                 </td>
-                                <td width="13%" title="{{config.item.comment}}">
+                                <td width="11%" title="{{config.item.comment}}">
                                     <span ng-bind="config.item.comment | limitTo: 250"></span>
                                     <span ng-bind="config.item.comment.length > 250 ?'...' : ''"></span>
                                 </td>

scripts/sql/apolloconfigdb.sql

@@ -232,6 +232,7 @@ CREATE TABLE `Item` (
   `Id` int(10) unsigned NOT NULL AUTO_INCREMENT COMMENT '自增Id',
   `NamespaceId` int(10) unsigned NOT NULL DEFAULT '0' COMMENT '集群NamespaceId',
   `Key` varchar(128) NOT NULL DEFAULT 'default' COMMENT '配置项Key',
+  `Type` tinyint(3) unsigned NOT NULL DEFAULT '0' COMMENT '配置项类型，0: String，1: Number，2: Boolean，3: Json',
   `Value` longtext NOT NULL COMMENT '配置项值',
   `Comment` varchar(1024) DEFAULT '' COMMENT '注释',
   `LineNum` int(10) unsigned DEFAULT '0' COMMENT '行号',

scripts/sql/delta/v190-v200/apolloconfigdb-v190-v200.sql

@@ -37,6 +37,7 @@ ALTER TABLE `GrayReleaseRule`
 
 ALTER TABLE `Item`
     ADD COLUMN `DeletedAt` BIGINT(20) NOT NULL DEFAULT '0' COMMENT 'Delete timestamp based on milliseconds' AFTER `IsDeleted`,
+    ADD COLUMN `Type` tinyint(3) unsigned NOT NULL DEFAULT '0' COMMENT '配置项类型，0: String，1: Number，2: Boolean，3: Json' AFTER `Key`,
     ADD INDEX IX_key (`Key`);
 
 ALTER TABLE `Namespace`