Microsemi AN1256 Web Ариза барои барномасозон
Муқаддима
JSON (JavaScript Object Notation) як стандарти кушода аст file формате, ки матни аз ҷониби инсон хондашаванда барои табодули маълумот истифода мебарад. Ин формати маъмули додаест, ки барои иртиботи асинхронии браузер/сервер истифода мешавад.
Барои нав web тарҳи саҳифа, формати JSON метавонад ивази услуби аслии AJAX бошад. Бо AJAX муқоиса кунед, бо истифода аз JSON Web ба амал баровардан осонтар ва осонтар аст. Таҳиягар бояд танҳо ба он таваҷҷӯҳ кунад web тарҳрезии саҳифа ва Web татбиқи коркардкунандаро сарфи назар кардан мумкин аст, зеро усули дастрасии JSON дар ҳар яке аллакай дастгирӣ карда мешавад WebМодулҳои нармафзори StaX.
Ин ҳуҷҷат дастури барномасозонро барои муҳандиси нармафзор, ки бояд таҳия кунад Web саҳифа тавассути JSON. Тартиби тафсилот ва собиқamples низ дар бахшҳои зерин дохил карда шудаанд.
Ҷараёни дастрасии додаҳои JSON
Барview
Ин аст ҷараёни дастрасии додаҳои JSON, ки пайвасти HTTP аз муштарӣ (браузер) оғоз мешавад. Ҷадвали HTML мувофиқи маълумоти JOSN аз ҷониби сервер (DUT) гирифташуда динамикӣ сохта мешавад.
Расми 1. Ҷараёни дастрасӣ байни муштарӣ ва сервер
Маълумоти JSON-ро дархост/ҷавоб диҳед
Бастаи дархости JSON ба усули интишори дархости HTTP асос ёфтааст ва мундариҷа бояд формати MSCC JSON-ро риоя кунад.
- Синтаксиси JSON-ро дархост кунед:{"метод":" ""параметрҳо":[ ], "id:"jsonrpc"}
- Синтаксиси ҷавоби JSON: {"хатогӣ": ,"натиҷа": , "id:"jsonrpc"}
Лавҳаҳои зерин мундариҷаи JSON-ро байни браузер ва DUT нишон медиҳанд.
Расми 2. Сурати дархости HTTP аз муштарӣ
Расми 3. Сурати посухи HTTP аз сервер
Мушаххасоти MSCC JSON
Барои гирифтани маълумоти пурраи JSON, аз ҷумла усул, параметр, тавсиф ва ғайра. "http://" нависед. /json_spec" дар сатри суроғаҳои браузери шумо. Усули дигари дастрасӣ тавассути номи усули JSON "jsonRpc.status.introspection.specific.inventory.get" мавҷуд аст, ки он барои усули мушаххас истифода мешавад.
Расми 4. Намоиши мушаххасоти JSON web саҳифа
Web чаҳорчӯба
Дар Web чаҳорчӯба дар WebНармафзори StaX ба як манбаи кушодаи MooTools асос ёфтааст. Ин маҷмӯи утилитаҳои JavaScript бо иҷозатномаи MIT мебошад. (http://mootools.net/license.txt) Сатри меню ва аксари web саҳифаҳо ба чаҳорчӯба асос ёфтаанд. Ҳарду алгоритми AJAX ва JSON аллакай дар утилитаҳои он муттаҳид карда шудаанд.
Гайр аз ин, WebНармафзори StaX дигар утилитҳоро таъмин мекунад, ки барои JSON муфиданд web тарҳрезии саҳифа.
- json.js - Барои интиқол/қабули маълумоти динамикӣ бо синтаксиси JSON for-ро истифода баред.
- dynforms.js - Барои ба таври динамикӣ сохтани ҷадвали HTML истифода баред.
- validate.js - Барои тасдиқи шакли HTML истифода баред.
Китобхонаҳои пурраи JavaScript дар зери феҳристи дарахти манбаъ ҷойгиранд: webstax2\ vtss_appl\web\html\lib.
Дастур барои JSON Web тарҳрезии саҳифа
Ин бахш тарзи тарҳрезии a web саҳифа дар асоси китобхонаҳои MSCC JavaScript. Мо Mirror глобалии танзимшударо истифода мебарем web саҳифа ҳамчун собиқampдар ин ҷо. Муоширати асинхронӣ ба усули дастрасии HTTP JSON асос ёфтааст ва ҳамаи параметрҳои танзимшудаи глобалӣ дар як ҷадвали динамикии HTML номбар шудаанд.
Дар web тарҳбандии саҳифа дар зер оварда шудааст ва рамзи пурраи манбаъ дар феҳристи дарахти манбаъ ҷойгир аст: webstax2\vtss_appl\mirror\html\mirror_ctrl.htm. Барои бештар маъмул шудан web истинод ба саҳифаҳо, ба фасли замима нигаред.
Ҷадвали конфигуратсияи Mirror & RMirror
Расми 5. Example аз ҷадвали танзимшудаи глобалӣ
Таҳрир Web саҳифа
Сарлавҳаи HTML
Китобхонаҳои JS-ро, ки дар HTML лозиманд, дохил кунед tag.
Сарчашмаи ҷадвали динамикӣ оғоз кунед
- Вақте ки ҳуҷҷати HTML омода аст, DynamicTable() -ро даъват кунед, то манбаи ҷадвали динамикиро оғоз кунад.
- DynamicTable() барои сохтани ҷадвали динамикӣ пас аз гирифтани маълумоти JSON истифода мешавад.
- Он гоҳ дархости Update -ро даъват мекунад, то ҷараёни фармони JSON-ро оғоз кунад.
- window.addEvent('domready', function() {
- // Барои қабул/интиқоли додаҳои JSON бо сохтори ҷадвал форма эҷод кунед
- myDynamicTable = Ҷадвали нави динамикӣ("myTableContent", "config","plusRowCtrlBar");
4 - requestUpdate();
- });
Маълумоти JSON-ро дархост/ҷавоб диҳед
- Вақте ки ҳуҷҷати HTML омода аст, requestJsonDoc()-ро барои фиристодани дархости JSON "mirror.config.session.get" истифода баред, то маълумот дар бораи сессияҳои танзимшуда гиред.
- Пас аз гирифтани маълумоти JSON барои "mirror.capabilities.get", функсияи бозпас занг задан requestUpdate() коркард мешавад. Функсияи requestUpdate пас барои гирифтани конфигуратсияи ҷорӣ "mirror.config.session.get"-ро даъват мекунад. Вақте ки конфигуратсияи ҷорӣ қабул карда мешавад, функсияи processUpdate барои сохтани ҷадвали намоиш дода мешавад.
- Функсияи дархости Навсозӣ ()
- {
- // Барқарор кардани мундариҷаи ҷадвал
- myDynamicTable.restore();
5 - // Ин ҷадвал ду маълумоти JSON.
- requestJsonDoc("mirror.config.session.get", нул, processUpdate, "config");
- }
Маълумоти қабулшудаи JSON-ро коркард кунед
- Функсияи processUpdate() барои тарҳрезии ҷадвали динамикӣ пас аз гирифтани маълумоти JSON истифода мешавад.
- AddRows() барои илова кардани сатрҳои ҷадвал истифода мешавад. myDynamicTable.update() тарҳбандии
Ҷадвали HTML мувофиқи маълумот дар сатрҳои ҷадвал.
- функсияи processUpdate(recv_json, ном)
- {
- // Агар ягон маълумот гирифта нашавад, равандро нодида гиред
- агар (!recv_json) {
- огоҳӣ ("Гаридани маълумоти динамикӣ ноком шуд.");
- бозгашт;
- }
- // Маълумоти қабулшудаи JSON-ро захира кунед
- myDynamicTable.saveRecvJson("конфигуратсия", recv_json);
- // Иловаи сатрҳои ҷадвал
- var table_rows = addRows(recv_json);
- myDynamicTable.addRows(ҷадвал_сатр);
- // Ин ҷадвали динамикӣ навсозӣ кунед
- myDynamicTable.update();
- // Вақтсанҷи навсозӣ
- var autorefresh = document.getElementById("autorrefresh");
- агар (autorrefresh && autorefresh.checked) {
- агар (таймер ID) {
- clearTimeout (TimerID);
- }
- timerID = setTimeout('requestUpdate()', settingsRefreshInterval());
- }
- }
Сатрҳои ҷадвалро илова кунед
- Дар функсияи addRows() мо формати JSON-ро барои пур кардани ҳар як параметри танзимшудаи глобалӣ дар сатри ҷадвал истифода мебарем.
- Ҳама майдонҳои HTML дар массиви JSON («table_rows») номбар шудаанд ва синтаксиси майдони ҷадвал дар зер оварда шудааст.
Синтаксис:
ҷадвал_сатрҳо:[ , , … ] : { , , … }
: {"навъ": , "парамс":[ , , …, ]}
- Дар ин ҳолат, ҳар як сатр панҷ майдон дорад: "Идентификатори сеанс", "Мод", "Намуд", "ID VLAN" ва "Порт рефлектор" Барои мисолampле,
ID-и сессия (Майдони ном: int32_t) | 1 (Иди сессияи оина) |
Режим (Майдони ном: vtss_bool_t) | дуруст (Маънои сессияи оина фаъол аст) |
Навъи (Майдони ном: рӯйхат
{оина, rMirrorSource, rMirrorDestination} |
Манбаи RMirror (ин манбаи сессияи оинаи дурдаст аст |
ID VLAN (Майдони ном: uint16_t) | 200 (vlan барои оина истифода мешавад) |
Порти рефлектор (Майдони ном: vtss_ifindex_t) | Ги 1/1 (Бандаре, ки трафики инъикосшуда ба он фиристода мешавад |
- myDynamicTable.addRows() маълумоти JSON-ро ба формати HTML табдил медиҳад ва ҷадвали HTML-ро мебарорад.
- функсияи addRow (калид, val)
- {
- var none_map_val = 0xFFFFFFFF, none_map_text = "Ҳеҷ", none_interface_text = "ҲЕҶ";
- var tunnel_mode_suffix = val.TunnelMode == "useglobal"? ” (” + oTTunnelMode[oVTunnelMode.indexOf(global_conf.tunnelMode)] + ")" : "";
- var row = {майдонҳо:[
- {намуд:"пайванд", параметрҳо:["cr", "mirror.htm?session_id=" + калид, калид]},
- {намуд:"матн", параметрҳо:[oTMode[oVMode.indexOf(val.Mode)], "c"]},
- {намуд:"матн", параметрҳо:[oTType[oVType.indexOf(val.Type)], "c"]},
- {намуд:"матн", параметрҳо:[val.Type == "оина" ? "-":
val.RMirrorVlan, "c"]}, - {намуд:"матн", параметрҳо:[val.Type == "rMirrorSource" ?
val.ReflectorPort: "-" , "c"]} - ]};
- қатори бозгашт;
- }
- Функсияи addRows (recv_json)
- {
- var row, empty_colspan = 7;
- var table_rows = Массиви нав();
- // Иловаи сарлавҳаи ҷадвал
- addHeader (ҷадвал_сатрҳо);
- // Як қатор илова кунед
- Object.each (recv_json, функсия (сабт) {
- table_rows.push (addRow (record.key, record.val));
- });
- баргардонидани ҷадвали_сатрҳо;
- }
Web саҳифаи кӯмак
Барои web тарроҳии саҳифаи кӯмак, тавсифи кӯмак метавонад ба мушаххасоти JSON ишора кунад, ки матни тавсиф метавонад бо баромади JSON мувофиқат кунад ва барои кам кардани тавсифи зиёдатӣ кӯмак кунад. Мисолample ин ҷо аз конфигуратсияи релеи dhcp6 гирифта шудааст.
Гипер-пайванд дар манбаъ file
Кӯмакро таъин кунед file ҷойгиршавӣ дар манбаи он file HTML tag. Номи тағирёбандаи собит "help_page" барои web супориши саҳифаи кӯмак.
- // Ҷодуи саҳифаи кӯмак
- var help_page = "/help/help_xxx.htm";
Тавсифи майдони HTML аз мушаххасоти JSON навсозӣ кунед
- Истифода баред ё HTML tag барои эълон кардани тавсифи ҷадвали HTML ва ID ягона барои tag.
- Вақте ки ҳуҷҷати HTML омода аст, ба loadXMLDoc() занг занед, то тамоми мушаххасоти JSON-ро гиред ё тавсифи усули мушаххасро бо номи усули JSON "jsonRpc.status.introspection.specific.inventory.get" гиред.
- ProcessTableDesc () барои навсозии тавсифи ҷадвал ва processUpdate () барои навсозии тавсифи параметри ҷадвал истифода мешавад.
- Дар processUpdate() ба updateTableParamsDesc() занг занед, то унсурҳои JSON-ро навсозӣ кунед, ки ба номҳои мушаххаси элемент мувофиқанд.
- Навсозии ё tag HTML-и дохилӣ мувофиқи тавсифи элемент.
- /* Майдонҳои тавсифи HTML навсозӣ */
- function processTableDesc(req) {
- агар (!req.responseText) {
- бозгашт;
- }
- var json_spec = JSON.decode(req.responseText);
- // Тавсифи ҷадвалро навсозӣ кунед
- $(“TableDesc”).innerHTML = getJsonSpecElement(json_spec, “гурӯҳҳо”, “dhcp6_relay.config.vlan”). тавсиф;
- }
- /* Тавсифи параметри ҷадвали HTML навсозӣ */
- function processUpdate(recv_json) {
- // Тавсифи параметри ҷадвалро навсозӣ кунед
- var param_names = [
- {
- "тахаллус": "Интерфейс",
- "намуд": "vtss_ifindex_t",
- "ном": "vlanInterface",
- "суффикс": "."
- },
- {
- "тахаллус": "Интерфейси реле",
- "намуд": "vtss_ifindex_t",
- "ном": "relayVlanInterface",
- "суффикс": ". Иди интерфейси барои интиқол истифодашаванда."
- },
- {
- "тахаллус": "Макони интиқол",
- "навъи": "mesa_ipv6_t",
- "ном": "relay_destination",
- "суффикс": ". Суроғаи IPv6-и сервери DHCPv6, ки дархостҳо ба он интиқол дода мешаванд. Қимати пешфарз 'ff05::1:3' 'ягон сервери DHCP'-ро дорад."
- }
- ];
- updateTableParamsDesc (“TableParamsDesc”, recv_json, “dhcp6_relay.config.vlan.get”, param_names);
- }
- /* Мушаххасоти JSON гиред */
- window.addEvent('domready', функсия () {
- loadXMLDoc("/json_spec", processTableDesc);
- requestJsonDoc("jsonRpc.status.introspection.specific.inventory.get", "dhcp6_relay.config.vlan", processUpdate);
- });
Гипер-пайванд дар сатри меню
- Рамзи сарчашмаи HTML-и сатри меню аз file webstax2\vtss_appl\web\ menu_default.cxx.
- Ададҳоро дар ин таҳрир кунед file барои Web гиперпайванди саҳифа.
- #агар муайян карда шуда бошад(VTSS_SW_OPTION_DHCP6_RELAY)
- ITEM("Relay,dhcp6_relay.htm");
- #endif //VTSS_SW_OPTION_DHCP6_RELAY
ШАРҲ
Аҳамият диҳед, ки шумораи аломати фосила дар ITEM(“”), ки барои муайян кардани сатҳи гурӯҳ дар сатри меню истифода мешавад. Дар ин ҳолат, ҳама web саҳифаҳо зери гурӯҳи "DHCPv6" мебошанд.
Расми 6. Мисample аз ҷадвали танзимшудаи глобалӣ
Замима
маъмулӣ web саҳифаҳо
Якчанд маъмул вуҷуд дорад web саҳифаҳоро барои тарҳрезии истинод истифода бурдан мумкин аст. Як собиқи иловагӣampДар ин ҷо нишон дода мешавад, ки конфигуратсияи як сессияи оина дар vtss_appl\mirror\html\mirror.htm пайдо шудааст.
Дар web саҳифа конфигуратсияи муфассалро барои як сессияи оина таъмин мекунад. Ҳама параметрҳои танзимшуда номбар шудаанд.
- Барои татбиқ кардани конфигуратсияи ҷорӣ тугмаи "Захира" -ро клик кунед.
- Барои аз нав барқарор кардани конфигуратсияи ҷорӣ тугмаи "Бозсозӣ" -ро клик кунед.
- Барои баргаштан ба боло "Бекор кардан" -ро клик кунедview сессияҳои оина
Танзимоти Mirror&RMirror
Танзимоти глобалӣ
Конфигуратсияи сарчашмаи VLAN(ҳо).
Танзимоти порт
Расми 7. Example аз конфигуратсияи муфассали сессияи оина
Тугмаҳои "Захира", "Бозсозӣ" ва "Бекор кардан" бо рамзи html илова карда мешаванд:
Ҷараёни фармони JSON
Ин саҳифа ҷараёни фармони ду қадамро талаб мекунад:
- Аввалан он бояд имкониятҳои дастгоҳро бо усули "mirror.capabilities.get" дарёфт кунад. Имкониятҳо тағир намеёбанд ва танҳо як маротиба хондан лозим аст.
- Пас ба он лозим меояд, ки конфигуратсияи ҷории дастгоҳро бо истифода аз усулҳои “mirror.config.session.get”, “port.status.get” ва дар ҳолати stacking “topo.config.stacking.get” гирад.
Даъвати "mirror.capabilities.get" аз ҷониби ҳодисаи "domready" оғоз мешавад ва натиҷа барои коркарди функсияи requestUpdate танзим карда мешавад.
ReviewUpdate занги "mirror.config.session.get" -ро оғоз мекунад,
"port.status.get" ва дар ҳолати stacking "topo.config.stacking.get" ва натиҷаҳои ин зангҳо танзим карда мешаванд, то аз ҷониби функсияи readyUpdate идора карда шаванд.
Функсияи PreparatUpdate ҳамаи натиҷаҳоро ҷамъ меорад ва танҳо вақте ки ҳама гирифта шудаанд, он функсияи processUpdate-ро даъват мекунад, ки ҷадвалҳоро барои нишон додани ҷадвалҳо месозад. web.
Иқтибосҳо
- Википедиа JavaScript https://en.wikipedia.org/wiki/JavaScript
- JSON https://www.json.org/
- MoonTools https://mootools.net/
Ҳуҷҷатҳо / Сарчашмаҳо
![]() |
Microsemi AN1256 Web Ариза барои барномасозон [pdf] Дастури корбар АН1256, АН1256 Web Ариза барои барномасозон, Web Ариза барои барномасозон, Ариза |