1С веб кардары жөнүндө

1C: Enterprise технологиясынын жагымдуу өзгөчөлүктөрүнүн бири башкарылуучу формалар технологиясын колдонуу менен иштелип чыккан тиркеме чечими Windows, Linux, MacOS X үчүн жука (аткалуучу) кардарда да, 5 браузер үчүн веб кардар катары да ишке киргизилиши мүмкүн. Chrome, Internet Explorer, Firefox, Safari, Edge жана мунун баары колдонмонун баштапкы кодун өзгөртпөстөн. Мындан тышкары, сырттан жука кардардагы жана браузердеги тиркеме иштейт жана дээрлик бирдей көрүнөт.
10 айырманы табыңыз (кесилген 2 сүрөт):

Linux боюнча жука кардар терезеси:

1С веб кардары жөнүндө

Веб кардардагы ошол эле терезе (Chrome браузеринде):

1С веб кардары жөнүндө

Эмне үчүн биз веб кардарды жасадык? Бир аз аянычтуу айтканда, мезгил бизге ушундай милдетти койду. Интернет аркылуу иштөө бизнес тиркемелери үчүн көптөн бери зарыл шарт болуп келген. Биринчиден, биз жука кардарыбыз үчүн Интернет аркылуу иштөө мүмкүнчүлүгүн коштук (биздин кээ бир атаандаштарыбыз, демек, ошол жерде токтошту; башкалары, тескерисинче, жука кардарды таштап, веб-кардарларды ишке ашыруу менен чектелишти). Биз колдонуучуларыбызга аларга эң ылайыктуу кардар опциясын тандоо мүмкүнчүлүгүн берүүнү чечтик.

1С веб кардары жөнүндө

Жука кардарга веб-негизделген мүмкүнчүлүктөрдү кошуу кардар-сервер архитектурасын толук өзгөртүү менен чоң долбоор болду. Веб кардарды түзүү - нөлдөн баштап, таптакыр жаңы долбоор.

Тапшырманын коюлушу

Ошентип, долбоордун талаптары: желе кардары жука кардар сыяктуу эле кылышы керек, тактап айтканда:

  1. Колдонуучу интерфейсин көрсөтүү
  2. 1С тилинде жазылган кардар кодун аткарыңыз

1Сдеги колдонуучу интерфейси визуалдык редактордо сүрөттөлөт, бирок декларативдик түрдө элементтердин пикселдик-пикселдик жайгашуусу жок; Интерфейс элементтеринин үч ондогон түрү колдонулат - баскычтар, киргизүү талаалары (текст, сан, дата/убакыт), тизмелер, таблицалар, графиктер ж.б.

1С тилиндеги кардар коду сервердик чалууларды, жергиликтүү ресурстар менен иштөөнү (файлдарды ж.б.), басып чыгарууну жана башка көптөгөн нерселерди камтышы мүмкүн.

Жука кардар (веб аркылуу иштөөдө) да, веб-кардар да 1С тиркеме сервери менен байланышуу үчүн бир эле веб-кызматтарды колдонушат. Кардардын ишке ашыруулары, албетте, ар кандай - жука кардар C++ тилинде, веб-кардар JavaScript тилинде жазылган.

Бир аз тарыхы

Веб кардар долбоору 2006-жылы башталган, анын курамында (орто эсеп менен) 5 адам. Долбоордун белгилүү этаптарында белгилүү бир функцияны ишке ашыруу үчүн иштеп чыгуучулар тартылган (электрондук таблица документи, диаграммалар ж.б.); эреже катары, бул жука кардарда бул функцияны аткарган ошол эле иштеп чыгуучулар. Ошол. иштеп чыгуучулар мурда C++ тилинде жараткан компоненттерди JavaScriptде кайра жазышты.

Эки тилдин ортосундагы күчтүү концептуалдык айырмачылыктардан улам биз эң башынан эле C++ жука кардар кодун JavaScript веб кардарына автоматтык түрдө (ал тургай жарым-жартылай) конверсиялоо идеясын четке какканбыз; желе кардары нөлдөн баштап JavaScript менен жазылган.

Долбоордун биринчи итерацияларында веб кардар орнотулган 1С тилиндеги кардар кодун түздөн-түз JavaScriptке айландырган. Жука кардар башкача иш кылат - 1С тилиндеги код байткодго түзүлөт, андан кийин бул байт код кардар чечмеленет. Кийинчерээк, веб-кардар да ушундай кыла баштады - биринчиден, ал натыйжалуулугун жогорулатты, экинчиден, жука жана веб кардарлардын архитектурасын бириктирүүгө мүмкүндүк берди.

1С: Enterprise платформасынын веб кардарлардын колдоосу менен биринчи версиясы 2009-жылы чыккан. Ошол убакта веб-кардар 2 браузерди колдогон - Internet Explorer жана Firefox. Баштапкы пландар Opera үчүн колдоону камтыган, бирок ошол кездеги Opera'дагы тиркемени жабуу менен чечилгис көйгөйлөрдөн улам (тиркеме жабылып жатканын 100% ишенимдүү көзөмөлдөө мүмкүн эмес болчу жана ошол учурда өчүрүү процедурасын аткаруу мүмкүн эмес болчу. 1С колдонмо сервери) бул пландардан баш тартууга туура келди.

Долбоордун структурасы

Жалпысынан 1С: Enterprise платформасында JavaScript-те жазылган 4 долбоор бар:

  1. WebTools - башка долбоорлор тарабынан колдонулган жалпы китепканалар (биз да кирет Google Closure Library).
  2. Башкаруу элементи Formatted Document (жука кардарда да, веб кардарда да JavaScript-те ишке ашырылат)
  3. Башкаруу элементи Пландаштыруучу (жука кардарда да, веб кардарда да JavaScript-те ишке ашырылат)
  4. Веб кардары

Ар бир долбоордун түзүмү Java долбоорлорунун структурасына окшош (же .NET долбоорлору - кайсынысы жакын болсо); Бизде аттар мейкиндиги бар жана ар бир аталыш мейкиндиги өзүнчө папкада. Папканын ичинде файлдар жана аттар мейкиндиги класстары бар. Веб кардар долбоорунда 1000ге жакын файлдар бар.

Структуралык жактан веб-кардар негизинен төмөнкү подсистемаларга бөлүнөт:

  • Башкарылган кардар колдонмо интерфейси
    • Жалпы колдонмо интерфейси (системалык менюлар, панелдер)
    • Башкарылган формалардын интерфейси, анын ичинде 30га жакын башкаруу элементтери (баскычтар, киргизүү талааларынын ар кандай түрлөрү - текст, сан, дата/убакыт ж.б., таблицалар, тизмелер, графиктер ж.б.)

  • Кардардагы иштеп чыгуучуларга жеткиликтүү объект модели (жалпысынан 400дөн ашык түрү: башкарылуучу интерфейс объектинин модели, маалымат жайгашуу орнотуулары, шарттуу стилдөө ж.б.у.с.)
  • Камтылган 1С тилинин котормочусу
  • Браузер кеңейтүүлөрү (JavaScript'те колдоого алынбаган функциялар үчүн колдонулат)
    • Криптография менен иштөө
    • Файлдар менен иштөө
    • Сырткы компоненттердин технологиясы, аларды жука жана веб кардарларда колдонууга мүмкүндүк берет

Өнүгүү өзгөчөлүктөрү

Жогоруда айтылгандардын баарын JavaScriptте ишке ашыруу оңой эмес. Балким, 1С веб кардары JavaScript-те жазылган эң чоң кардар тараптагы колдонмолордун бири болуп саналат - болжол менен 450.000 XNUMX сап. Биз веб-кардар кодунда объектиге багытталган ыкманы активдүү колдонобуз, бул мындай чоң долбоор менен иштөөнү жеңилдетет.

Кардар кодунун өлчөмүн азайтуу үчүн биз алгач өзүбүздүн обфускаторубузду колдондук жана 8.3.6 платформа версиясынан баштап (2014-жылдын октябры) колдоно баштадык. Google Closure Compiler. Сандар менен колдонуунун эффектиси – бүдөмүктөн кийин веб-кардар алкагынын өлчөмү:

  • Өздүк обфускатор – 1556 кб
  • Google Closure Compiler – 1073 кб

Google Closure Compiler колдонуу веб-кардардын иштешин өзүбүздүн обфускаторубузга салыштырмалуу 30% жакшыртууга жардам берди. Мындан тышкары, тиркеме тарабынан керектелген эстутумдун көлөмү 15-25% га кыскарган (браузерге жараша).

Google Closure Compiler объектиге багытталган код менен абдан жакшы иштейт, ошондуктан анын веб кардары үчүн эффективдүүлүгү мүмкүн болушунча жогору. Closure Compiler биз үчүн бир нече жакшы нерселерди жасайт:

  • Долбоорду куруу стадиясында статикалык типти текшерүү (кодду JSDoc аннотациялары менен жабууну камсыздайт). Натыйжада статикалык терүү, C++ тилинде терүүгө абдан жакын. Бул долбоорду түзүү стадиясында каталардын кыйла чоң пайызын кармоого жардам берет.
  • Түшүндүрмө аркылуу коддун өлчөмүн азайтуу
  • Аткарылган коддун бир катар оптималдаштыруулары, мисалы:
    • катардагы функцияларды алмаштыруу. JavaScript'те функцияны чакыруу бир топ кымбат операция жана көп колдонулган майда ыкмаларды сапта алмаштыруу кодду бир топ ылдамдатат.
    • Компиляция учурунда константаларды эсептөө. Эгерде туюнтма константага көз каранды болсо, анда туруктуу чоңдуктун чыныгы мааниси ага алмаштырылат

Биз WebStormду веб кардар өнүктүрүү чөйрөбүз катары колдонобуз.

Код талдоо үчүн биз колдонобуз SonarQube, бул жерде биз статикалык код анализаторлорун бириктиребиз. Анализаторлорду колдонуу менен биз JavaScript баштапкы кодунун сапатынын начарлашына көз салып, анын алдын алууга аракет кылабыз.

1С веб кардары жөнүндө

Биз кандай көйгөйлөрдү чечип жатабыз?

Долбоорду ишке ашыруунун жүрүшүндө биз чечүүгө туура келген бир катар кызыктуу көйгөйлөргө туш болдук.

Сервер менен жана терезелердин ортосунда маалымат алмашуу

Баштапкы кодду бүдөмүктөө тутумдун иштешине тоскоол боло турган жагдайлар бар. Веб кардарынын аткарылуучу кодунан тышкары код, бүдөмүктөнгөндүктөн, биздин аткарылуучу код күткөндөн айырмаланган функция жана параметр аталыштарына ээ болушу мүмкүн. Биз үчүн тышкы код:

  • Берилиш структуралары түрүндө серверден келген код
  • Башка колдонмо терезеси үчүн код

Сервер менен иштешүүдө башаламандыкка жол бербөө үчүн @expose тэгин колдонобуз:

/**
 * @constructor
 * @extends {Base.SrvObject}
 */
Srv.Core.GenericException = function ()
{
    /**
     * @type {string}
     * @expose
     */
    this.descr;

    /**
     * @type {Srv.Core.GenericException}
     * @expose
     */
    this.inner;

    /**
     * @type {string}
     * @expose
     */
    this.clsid;

    /**
     * @type {boolean}
     * @expose
     */
    this.encoded;
}

Жана башка терезелер менен иштешүүдө бүдөмүк болуп калбаш үчүн биз экспорттолгон интерфейстерди (бардык ыкмалар экспорттолгон интерфейстер) колдонобуз.

/**
 * Экспортируемый интерфейс контрола DropDownWindow
 *
 * @interface
 * @struct
 */
WebUI.IDropDownWindowExp = function(){}

/**
 * Перемещает выделение на 1 вперед или назад
 *
 * @param {boolean} isForward
 * @param {boolean} checkOnly
 * @return {boolean}
 * @expose
 */
WebUI.IDropDownWindowExp.prototype.moveMarker = function (isForward, checkOnly){}

/**
 * Перемещает выделение в начало или конец
 *
 * @param {boolean} isFirst
 * @param {boolean} checkOnly
 * @return {boolean}
 * @expose
 */
WebUI.IDropDownWindowExp.prototype.moveMarkerTo = function (isFirst, checkOnly){}

/**
 * @return {boolean}
 * @expose
 */
WebUI.IDropDownWindowExp.prototype.selectValue = function (){}

Виртуалдык DOM негизги агымга айланганга чейин колдондук)

Татаал Web UI менен алектенген бардык иштеп чыгуучулар сыяктуу эле, биз DOM динамикалык колдонуучу интерфейстери менен иштөөгө начар ылайыктуу экенин тез түшүндүк. Дээрлик дароо эле, UI менен иштөөнү оптималдаштыруу үчүн Virtual DOM аналогу ишке ашырылган. Окуяны иштетүү учурунда, бардык DOM өзгөрүүлөр эстутумда сакталат жана бардык операциялар аяктагандан кийин гана, топтолгон өзгөртүүлөр DOM дарагына колдонулат.

Веб кардарды оптималдаштыруу

Биздин веб кардар тезирээк иштеши үчүн, биз стандарттык браузердин мүмкүнчүлүктөрүн (CSS ж.б.) максималдуу колдонууга аракет кылабыз. Ошентип, форманын командалык панели (тиркеменин дээрлик бардык формаларында жайгашкан) CSS негизиндеги динамикалык макетти колдонуу менен гана браузер куралдарын колдонуу менен көрсөтүлөт.

1С веб кардары жөнүндө

тестирлөө

Функционалдык жана эффективдүү тестирлөө үчүн биз проприетардык куралды (Java жана C++ тилдеринде жазылган), ошондой эле анын үстүнө курулган тесттердин топтомун колдонобуз. селен.

Биздин курал универсалдуу - ал дээрлик бардык терезелүү программаларды сынап көрүүгө мүмкүндүк берет, ошондуктан жука кардарды да, веб-кардарды да сыноо үчүн ылайыктуу. Курал скрипт файлына 1С тиркемесинин чечимин ишке киргизген колдонуучунун аракеттерин жазат. Ошол эле учурда экрандын иштөө аймагынын сүрөттөрү — стандарттар — жазылат. Веб кардардын жаңы версияларына мониторинг жүргүзүүдө скрипттер колдонуучунун катышуусуз ойнотулат. Скриншот кайсы бир кадамда шилтемеге дал келбеген учурларда, тест өтпөй калды деп эсептелет, андан кийин сапат боюнча адис бул катабы же системанын жүрүм-турумунун пландаштырылган өзгөрүшү экендигин аныктоо үчүн иликтөө жүргүзөт. Пландуу жүрүм-турум болгон учурда стандарттар автоматтык түрдө жаңыларына алмаштырылат.

Курал ошондой эле 25 миллисекундга чейинки тактык менен колдонмонун иштешин өлчөйт. Кээ бир учурларда, убакыттын өтүшү менен аткаруу убактысынын начарлашын талдоо үчүн скрипттин бөлүктөрүн (мисалы, буйрук жазуусун бир нече жолу кайталап) айлантабыз. Бардык өлчөөлөрдүн натыйжалары талдоо журналына жазылат.

1С веб кардары жөнүндө
Биздин тестирлөө куралы жана колдонмо сыноодон өтүп жатат

Биздин курал жана Селен бири-бирин толуктап турат; мисалы, экрандардын бириндеги кандайдыр бир баскыч анын жайгашкан жерин өзгөртсө, Selenium муну байкабай калышы мүмкүн, бирок биздин куралыбыз байкайт, анткени скриншотту стандарт менен пиксел-пикселге салыштырууну жасайт. Курал ошондой эле клавиатурадан же чычкандан киргизүүнү иштетүүдөгү көйгөйлөргө көз сала алат, анткени ал дал ушул нерсени чыгарат.

Эки куралдардагы тесттер (биздики жана Selenium) биздин колдонмо чечимдерибизден типтүү иш сценарийлерин иштетет. Тесттер 1С: Enterprise платформасынын күнүмдүк түзүлүшү аяктагандан кийин автоматтык түрдө ишке киргизилет. Эгерде скрипттер жайыраак болсо (мурунку түзүүгө салыштырмалуу), биз жайлоонун себебин изилдеп, чечебиз. Биздин критерий жөнөкөй - жаңы курулуш мурункуга караганда жайыраак иштеши керек.

Иштеп чыгуучулар жайлоо инциденттерин иликтөө үчүн ар кандай куралдарды колдонушат; негизинен колдонулат Dynatrace AJAX Edition өндүрүштүк компания DynaTrace. Мурунку жана жаңы конструкциялар боюнча көйгөйлүү операциянын аткарылышынын журналдары жазылат, андан кийин журналдар талданат. Ошол эле учурда, жалгыз операциялардын аткарылуу убактысы (миллисекунд менен) чечүүчү фактор боло албайт - таштанды чогултуу сыяктуу сервистик процесстер мезгил-мезгили менен браузерде ишке киргизилет, алар функциялардын аткарылуу убактысы менен кайталанып, сүрөттү бурмалап коюшу мүмкүн. Бул учурда көбүрөөк тиешелүү параметрлер аткарылган JavaScript нускамаларынын саны, DOMдагы атомдук операциялардын саны ж.б. Эгерде бир эле скрипттеги нускамалардын/операциялардын саны жаңы версияда көбөйсө, бул дээрлик дайыма оңдоону талап кылган аткаруунун төмөндөшүн билдирет.

Ошондой эле, өндүрүмдүүлүктүн төмөндөшүнүн себептеринин бири Google Closure Compiler кандайдыр бир себептерден улам функцияны сапка алмаштырууну аткара албаганы болушу мүмкүн (мисалы, функция рекурсивдүү же виртуалдык болгондуктан). Бул учурда, биз баштапкы кодду кайра жазуу менен кырдаалды оңдоого аракет кылабыз.

Браузер кеңейтүүлөрү

Колдонмо чечими JavaScript'те жок функцияга муктаж болгондо, биз браузердин кеңейтүүлөрүн колдонобуз:

Биздин кеңейтүүлөр эки бөлүктөн турат. Биринчи бөлүк браузердин кеңейтүүсү деп аталат (көбүнчө JavaScript-те жазылган Chrome жана Firefox үчүн кеңейтүүлөр), ал экинчи бөлүк менен иштешет - бизге керектүү функцияларды ишке ашырган экилик кеңейтүү. Белгилей кетсек, биз экилик кеңейтүүлөрдүн 3 версиясын жазабыз - Windows, Linux жана MacOS үчүн. Бинардык кеңейтүү 1С: Enterprise платформасынын бир бөлүгү катары берилген жана 1С тиркеме серверинде жайгашкан. Ал биринчи жолу веб кардардан чакырылганда, ал кардар компьютерине жүктөлүп, браузерде орнотулат.

Safariде иштегенде биздин кеңейтүүлөр NPAPI колдонушат; Internet Explorerде иштегенде ActiveX технологиясын колдонушат. Текшерүү жагы азырынча кеңейтүүлөрдү колдобойт, андыктан андагы веб кардар чектөөлөр менен иштейт.

Андан ары өнүктүрүү

Веб-кардарларды иштеп чыгуу тобунун милдеттеринин бири - бул функцияны андан ары өнүктүрүү. Веб-кардардын функционалдуулугу жука кардардын функционалдуулугуна окшош болушу керек; бардык жаңы функциялар жука жана веб-клиенттерде бир убакта ишке ашырылат.

Башка милдеттерге архитектураны өнүктүрүү, рефакторинг, аткарууну жана ишенимдүүлүктү жогорулатуу кирет. Мисалы, багыттардын бири асинхрондук иш моделине карай мындан аркы кыймыл. Веб-кардардын кээ бир функциялары учурда сервер менен өз ара аракеттенүүнүн синхрондуу моделине курулган. Асинхрондук модель азыр браузерлерде (жана браузерлерде гана эмес) актуалдуу болуп баратат жана бул бизди синхрондуу чалууларды асинхрондук чалуулар менен алмаштыруу (жана ошого жараша кодду рефакторинг) аркылуу веб кардарды өзгөртүүгө мажбурлайт. Асинхрондук моделге акырындык менен өтүү бошотулган чечимдерди колдоо жана аларды акырындык менен адаптациялоо зарылчылыгы менен түшүндүрүлөт.

Source: www.habr.com

Комментарий кошуу