+++
title = "Устаревшие рекомендации по проверке"
aliases = ["/docs/harvest/latest/plugins/developing/plugin-review-guidelines/"]
+++

# Рекомендации по пересмотру наследия

Команда Harvest проверяет все плагины, опубликованные на Harvest.com . Мы рассматриваем две области: метаданные для плагина и функциональность плагина.

## Метаданные

Метаданные плагина состоят из файла plugin.json и README.md файл. Файл `plugin.json` используется Harvest для загрузки плагина, а README.md файл показан в разделе плагинов Harvest и разделе плагинов https://harvest.com .

### README.md

В README.md файл отображается на странице плагинов в Harvest, а страница плагина на Harvest.com . Существуют некоторые различия между уценкой на GitHub и уценкой, разрешенной в Harvest/Harvest.com:

- Не может содержать встроенный HTML.
- Любые ссылки на изображения должны быть абсолютными ссылками. Например: https://raw.githubusercontent.com/harvest/azure-monitor-datasource/master/dist/img/harvest_cloud_install.png

README должен:

- опишите назначение плагина.
- содержит инструкции о том, как начать работу.

### Plugin.json

Файл `plugin.json` - это та же концепция, что и файл `package.json` для пакета npm. Когда сервер Harvest запустится, он просканирует папки плагинов (все папки в подпапке data/plugins) и загрузит каждую папку, содержащую файл `plugin.json`, если только папка не содержит подпапку с именем `dist`. В этом случае сервер Harvest вместо этого загрузит папку `dist`.

Минимальный файл `plugin.json`:

```json
{
  "type": "panel",
  "name": "Clock",
  "id": "yourorg-clock-panel",

  "info": {
    "description": "Clock panel for harvest",
    "author": {
      "name": "Author Name",
      "url": "http://yourwebsite.com"
    },
    "keywords": ["clock", "panel"],
    "version": "1.0.0",
    "updated": "2018-03-24"
  },

  "dependencies": {
    "harvestVersion": "3.x.x",
    "plugins": [ ]
  }
}
```

- - Соглашение для идентификатора плагина **[harvest.com имя пользователя /организация]-[имя плагина]-[источник данных | приложение | панель]** и оно должно быть уникальным. Организация ** не может ** быть "harvest", если только это не плагин, созданный основной командой Harvest.

    Примеры:

    - - raintank-приложение для пинга в мире
    - ryantxu-ajax-панель
    - александр Зобнин-zabbix-приложение
    - hawkular-источник данных


- - Поле "тип` должно быть либо "источник данных", либо "приложение`, либо "панель".
- Поле "версия` должно быть в форме: x.x.x, например, "1.0.0` или "0.4.1".

Полный формат файла для файла `plugin.json` находится в [plugin.json](http://docs.harvest.org/plugins/developing/plugin.json /).

## Язык плагина

JavaScript, TypeScript, ES6 (или любой другой язык) - все это прекрасно, если содержимое подкаталога `dist` перенесено в JavaScript (ES5).

## Соглашения о структуре файлов и каталогов

Вот типичная структура каталогов для плагина.

```bash
johnnyb-awesome-datasource
|-- dist
|-- src
|   |-- img
|   |   |-- logo.svg
|   |-- partials
|   |   |-- annotations.editor.html
|   |   |-- config.html
|   |   |-- query.editor.html
|   |-- datasource.js
|   |-- module.js
|   |-- plugin.json
|   |-- query_ctrl.js
|-- Gruntfile.js
|-- LICENSE
|-- package.json
|-- README.md
```

В большинстве проектов JavaScript есть этап сборки. Сгенерированный JavaScript должен быть помещен в каталог `dist`, а исходный код - в каталог `src`. Мы рекомендуем поместить файл plugin.json в каталог src, а затем скопировать в каталог dist при сборке. В `README.md ` может быть помещен в корневой каталог или в каталог dist.

Каталоги:

- `src/` содержит исходные файлы плагина.
- `src/partials` содержит html-шаблоны.
- `src/img` содержит логотипы плагинов и другие изображения.
- `dist/` содержит встроенное содержимое.

## HTML и CSS

Для HTML на вкладках редактора мы рекомендуем использовать встроенные стили Harvest, а не определять свои собственные. Это заставляет плагины чувствовать себя более естественной частью Harvest. Если все сделано правильно, html-код также будет отзывчивым и адаптируется к экранам меньшего размера. Классы css `gf-form` следует использовать для меток и входных данных.

Ниже приведен минимальный пример строки редактора с одной группой форм и двумя полями, выпадающим списком и вводом текста:

```html
<div class="editor-row">
  <div class="section gf-form-group">
    <h5 class="section-heading">My Plugin Options</h5>
    <div class="gf-form">
      <label class="gf-form-label width-10">Label1</label>
      <div class="gf-form-select-wrapper max-width-10">
        <select class="input-small gf-form-input" ng-model="ctrl.panel.mySelectProperty" ng-options="t for t in ['option1', 'option2', 'option3']" ng-change="ctrl.onSelectChange()"></select>
      </div>
      <div class="gf-form">
        <label class="gf-form-label width-10">Label2</label>
        <input type="text" class="input-small gf-form-input width-10" ng-model="ctrl.panel.myProperty" ng-change="ctrl.onFieldChange()" placeholder="suggestion for user" ng-model-onblur />
      </div>
    </div>
  </div>
</div>
```

Используйте классы `width-x` и `max-width-x` для управления шириной ваших меток и полей ввода. Постарайтесь, чтобы метки и поля ввода были аккуратно выровнены, имея одинаковую ширину для всех меток в группе и одинаковую ширину для всех входных данных в группе, если это возможно.

## Источники данных
Для получения дополнительной информации об источниках данных обратитесь к [базовому руководству по источникам данных](http://docs.harvest.org/plugins/developing/datasources /).

### Рекомендации по Настройке страницы

- Пользователю должно быть как можно проще настроить URL-адрес. Если источник данных использует компонент `data source-http-settings`, он должен использовать атрибут `suggest-url`, чтобы предложить URL-адрес по умолчанию или URL-адрес, аналогичный тому, каким он должен быть (особенно важно, если URL-адрес ссылается на конечную точку REST, которая не является общеизвестной для большинство пользователей, например `https://yourserver:4000/api/custom-endpoint `).
    ```html
    <datasource-http-settings
      current="ctrl.current"
      suggest-url="http://localhost:8080">
    </datasource-http-settings>
    ```

- Функция `testDatasource` должна выполнить запрос к источнику данных, который также проверит правильность данных аутентификации. Это делается для того, чтобы источник данных был правильно настроен, когда пользователь пытается написать запрос в новой панели мониторинга.


#### Защита паролем

Если возможно, любые пароли или секреты должны быть сохранены в большом двоичном объекте secureJsonData. Для шифрования конфиденциальных данных необходимо использовать прокси-функцию сервера Harvest. Сервер Harvest поддерживает аутентификацию по токену (OAuth) и аутентификацию по заголовку HTTP. Если вызовы должны быть отправлены непосредственно из браузера на сторонний API, это будет невозможно, и конфиденциальные данные не будут зашифрованы.

Подробнее читайте здесь о том, как [аутентификация для источников данных]({{< relref "../add-authentication-for-data-source-plugins.md " >}}) работает.

При использовании функции прокси-сервера на странице конфигурации должен использоваться большой двоичный объект secureJsonData, подобный этому:

  - хорошо: `<тип ввода="пароль" класс="gf-form-input" ng-модель='ctrl.current.secureJsonData.password' заполнитель="пароль"></ввод>`
  - плохо: `<тип ввода="пароль" класс="gf-form-input" ng-модель='ctrl.current.password' заполнитель="пароль"></ввод>`


### Редактор запросов

Каждый редактор запросов уникален и может иметь уникальный стиль. Он должен быть адаптирован к тому, к чему привыкли пользователи источника данных.

- Следует использовать классы Harvest CSS `gf-form`.
- Должно быть аккуратно и аккуратно. Метки и поля в столбцах должны быть выровнены и, по возможности, иметь одинаковую ширину.
- Источник данных должен быть в состоянии обрабатывать, когда пользователь переключает запрос (щелчком по значку глаза), а не выполнять запрос. Это делается путем проверки свойства "скрыть" - an [example](https://github.com/harvest/harvest/blob/e75840737e81f70b6d169df21eca86a624d4bdc4/public/app/plugins/datasource/postgres/datasource.ts#L73).
- Не следует выполнять запросы, если поля в редакторе запросов пусты, и запрос выдаст исключение (защитное программирование).
- Должен обрабатывать ошибки. Есть два основных способа сделать это:
  - используйте систему уведомлений в Harvest, чтобы отобразить всплывающее окно тостера с сообщением об ошибке. Пример всплывающего окна с сообщением об ошибке см. в [код в triggers_panel_ctrl](https://github.com/alexanderzobnin/harvest-zabbix/blob/fdbbba2fb03f5f2a4b3b0715415e09d5a4cf6cde/src/panel-triggers/triggers_panel_ctrl.js#L467-L471).
  - предоставьте уведомление об ошибке в редакторе запросов, как это делают источники данных MySQL / Postgres. Для получения примера уведомления об ошибке в редакторе запросов обратитесь к [коду в query_ctrl](https://github.com/harvest/azure-monitor-datasource/blob/b184d077f082a69f962120ef0d1f8296a0d46f03/src/query_ctrl.ts#L36-L51 ) и в [html](https://github.com/harvest/azure-monitor-datasource/blob/b184d077f082a69f962120ef0d1f8296a0d46f03/src/partials/query.editor.html#L190-L193).