Microsemi AN1256 Web Awọn oluṣeto ohun elo Itọsọna olumulo

Awọn akoonu tọju

1 Microsemi AN1256 Web Programmers elo

2 Ọrọ Iṣaaju

3 JSON wiwọle data sisan

4 Web ilana

5 Itọsọna fun JSON Web apẹrẹ oju-iwe

5.1 Ṣatunkọ Web oju-iwe

6 Àfikún

6.1 Iṣeto Digi&RMiror

7 Awọn itọkasi

8 Awọn iwe aṣẹ / Awọn orisun

8.1 Awọn itọkasi

9 jẹmọ Posts

Microsemi AN1256 Web Programmers elo

Ọrọ Iṣaaju

JSON (Akọsilẹ Nkan JavaScript) jẹ boṣewa-ìmọ file ọna kika ti o nlo ọrọ kika eniyan fun paṣipaarọ data. O jẹ ọna kika data ti o wọpọ ti a lo fun ẹrọ aṣawakiri asynchronous/ibaraẹnisọrọ olupin.
Fun titun web apẹrẹ oju-iwe, ọna kika JSON le jẹ iyipada fun aṣa AJAX atilẹba. Afiwera si AJAX, lilo JSON mu ki awọn Web imuse rọrun ati ki o rọrun. Olùgbéejáde nikan nilo si idojukọ lori web apẹrẹ iwe ati awọn Web imuse imuse le yọkuro nitori ọna iraye si JSON ti ni atilẹyin tẹlẹ ninu ọkọọkan WebStaX software modulu.
Iwe yii sọ itọsọna awọn pirogirama fun ẹlẹrọ sọfitiwia ti o nilo lati ṣe agbekalẹ naa Web oju-iwe nipasẹ JSON. Awọn ilana alaye ati examples tun to wa ninu awọn wọnyi ruju.

JSON wiwọle data sisan

Pariview
Eyi ni sisan wiwọle data JSON eyiti asopọ HTTP kan ti bẹrẹ lati ọdọ alabara (oluwakiri). Tabili HTML ni a ṣẹda ni agbara ni ibamu si data JOSN ti o gba lati ẹgbẹ olupin (DUT).

Olusin 1. Ṣiṣan iwọle laarin alabara ati olupin

Beere / Idahun JSON data
Pakẹti ibeere JSON da lori ọna ifiweranṣẹ HTTP ati pe akoonu ni lati tẹle ọna kika MSCC JSON.

Beere JSON sintasi:{"Ọna":" "," params":[ ], "id:"jsonrpc"}
Idahun JSON sintasi: {"aṣiṣe": "esi": , "id:"jsonrpc"}

Awọn aworan aworan atẹle n ṣe afihan akoonu JSON laarin ẹrọ aṣawakiri ati DUT.

Olusin 2. Fọto ti ibeere HTTP lati ọdọ alabara

Olusin 3. Aworan esi HTTP lati ọdọ olupin

MSCC JSON sipesifikesonu
Lati gba alaye JSON ni kikun pẹlu ọna, paramita, apejuwe ati bẹbẹ lọ Tẹ “http:// / json_spec” lori ọpa adirẹsi aṣawakiri rẹ. Ọna iwọle miiran wa nipasẹ orukọ ọna JSON “jsonRpc.status.introspection.specific.inventory.get”, o jẹ lilo fun ọna kan pato.

Olusin 4. Aworan ti alaye sipesifikesonu JSON web oju-iwe

Web ilana

Awọn Web ilana ni WebSọfitiwia StaX da lori orisun ṣiṣi MooTools. O jẹ akojọpọ awọn ohun elo JavaScript pẹlu iwe-aṣẹ MIT. (http://mootools.net/license.txt) Awọn akojọ bar ati julọ ti web awọn oju-iwe ti o da lori ilana. Mejeeji AJAX ati JSON algorithm ti wa ni idapo tẹlẹ ninu awọn ohun elo rẹ.
Yato si, WebSọfitiwia StaX n pese awọn ohun elo miiran ti o wulo fun JSON web apẹrẹ oju-iwe.

json.js - Lo fun a atagba/gba awọn ìmúdàgba data pẹlu JSON sintasi.

dynforms.js – Lo fun a ṣẹda HTML tabili ìmúdàgba.
fọwọsi.js - Lo fun afọwọsi ti HTML fọọmu.

Awọn ile-ikawe JavaScript ni kikun wa labẹ itọsọna igi orisun: webstax2 \ vtss_appl \web\html\lib.

Itọsọna fun JSON Web apẹrẹ oju-iwe

Abala yii ṣe itọsọna bi o ṣe le ṣe apẹrẹ kan web oju-iwe ti o da lori awọn ile-ikawe JavaScript MSCC. A lo digi agbaye ni tunto web iwe bi example nibi. Ibaraẹnisọrọ asynchronous da lori HTTP JSON ọna wiwọle ati gbogbo agbaye tunto sile ti wa ni akojọ si ni ọkan ìmúdàgba tabili HTML.
Awọn web Ifilelẹ oju-iwe ti wa ni akojọ si isalẹ ati pe koodu orisun ni kikun wa labẹ itọsọna igi orisun: webstax2 \ vtss_appl \ digi \ html \ mirror_ctrl.htm. Lati gba diẹ aṣoju web awọn itọkasi oju-iwe, wo apakan apakan.

Mirror& RMirror iṣeto ni Table

Olusin 5. Example ti agbaye ni tunto tabili

Ṣatunkọ Web oju-iwe

HTML akọsori
Fi awọn ile-ikawe JS ti o nilo ninu HTML tag.

Initialize awọn ìmúdàgba tabili awọn oluşewadi

Nigbati iwe HTML ba ti ṣetan, pe DynamicTable () lati ṣe ipilẹṣẹ orisun tabili ti o ni agbara.

DynamicTable () ni a lo lati ṣẹda tabili ti o ni agbara lẹhin gbigba data JSON.
Yoo pe ibeereUpdate lati bẹrẹ sisan aṣẹ JSON.

window.addEvent ('domready', iṣẹ () {
// Ṣẹda fọọmu pẹlu ara tabili fun gbigba / atagba data JSON
myDynamicTable = DynamicTable tuntun ("myTableContent", "konfigi","PlusRowCtrlBar");
4
ìbéèrèUpdate ();
});

Beere / Idahun JSON data

Nigbati iwe HTML ba ti ṣetan, lo requestJsonDoc() lati fi ibeere JSON ranṣẹ “mirror.config.session.get” lati gba alaye nipa awọn akoko iṣeto.

Lẹhin ti data JSON fun “mirror.capabilities.get” ti gba, iṣẹ-ipepada yoo ṣe imudojuiwọn imudojuiwọn () naa. Ibeere iṣẹ naaUpdate yoo pe “mirror.config.session.get” lati gba iṣeto ni lọwọlọwọ. Nigbati iṣeto lọwọlọwọ ba gba, a pe ilana imudojuiwọn iṣẹ lati kọ tabili lati ṣafihan.

ìbéèrè iṣẹ Imudojuiwọn()
{
// Mu pada akoonu tabili
myDynamicTable.restore ();
5
// Yi tabili meji JSON data.
requestJsonDoc ("mirror.config.session.get", asan, ilanaUpdate, "konfigi");
}

Ṣiṣẹ data JSON ti o gba

Ilana iṣẹ naaUpdate () ni a lo lati ṣeto tabili ti o ni agbara lẹhin gbigba data JSON.

AddRows () ni a lo lati ṣafikun awọn ori ila tabili. myDynamicTable.update () ipalemo awọn
HTML tabili gẹgẹ data ninu tabili awọn ori ila.

Imudojuiwọn ilana iṣẹ (recv_json, orukọ)
{
// Foju ilana naa ti ko ba gba data
ti (!recv_json) {
gbigbọn ("Gba data ti o ni agbara kuna.");
pada;
}
// Fipamọ data JSON ti o gba
myDynamicTable.saveRecvJson ("konfigi", recv_json);
// Fi awọn ori ila tabili
var table_rows = addRows (recv_json);
myDynamicTable.addRows (tabili_rows);
// Mu yi ìmúdàgba tabili
myDynamicTable.update ();
// Sọ aago
var autorefresh = document.getElementById ("autorefresh");
ti o ba jẹ (autorefresh && autorefresh.checked) {
ti (timerID) {
clearTimeout (akoko ID);
}
timeID = setTimeout('requestUpdate()', settingsRefreshInterval());
}
}

Fi awọn ori ila tabili kun

Ninu iṣẹ addRows (), a lo ọna kika JSON lati kun paramita atunto agbaye kọọkan ni laini tabili.

Gbogbo awọn aaye HTML ti wa ni akojọ ni ọna JSON ("tabili_rows") ati pe sintasi ti aaye tabili wa ni isalẹ.

Sisọpọ:
tabili_tabili:[ , ,… ] : { , ,… }
: {"Iru": , "params":[ , ,…, ]}

Ni idi eyi, ila kọọkan ni awọn aaye marun: "ID ID", "Ipo", "Iru", "VLAN ID" ati "Port Reflector" Fun ex.ample,

ID igba (Aaye orukọ: int32_t)	1 (Idi igba digi)
Ipo (Aaye orukọ: vtss_bool_t)	ooto (Itumọ pe igba digi ti ṣiṣẹ)
Iru (Aaye orukọ: enumeration {digi, rMirrorSource, rMirrorDestination}	RMirror Orisun (Eyi ni orisun igba digi latọna jijin
VLAN ID (Aaye orukọ: uint16_t)	200 (vlan ti a lo fun digi)
Port Reflector (Aaye orukọ: vtss_ifindex_t)	Gi 1/1 (Ibu-ibudo eyiti o ti firanṣẹ ijabọ digi naa

MyDynamicTable.addRows() yoo yi data JSON pada si ọna kika HTML ati gbejade tabili HTML.

iṣẹ addRow (bọtini, val)
{
var none_map_val = 0xFFFFFFFF, none_map_text = "Kò sí", none_interface_text = "KÒ SÍ";
var tunnel_mode_suffix = val.TunnelMode == “useglobal”? " (" + oTTunnelMode[oVTunnelMode.indexOf(global_conf.tunnelMode)] + ")" : "";

var kana = {awọn aaye:[
{iru:”ọna asopọ”, params:[“cr”, “mirror.htm?session_id=” + bọtini, bọtini]},
{iru:”ọrọ”, params:[oTMode[oVMode.indexOf(val.Mode)], “c”]},
{iru:”ọrọ”, params:[oTType[oVType.indexOf(val.Type)], “c”]},
{iru:”ọrọ”, params:[val.Type == “digi”? "-":
val.RMirrorVlan, “c”]},
{iru:”ọrọ”, params:[val.Type == “rMirrorSource”?
val.ReflectorPort: "-" , "c"]}
]};
ila pada;
}
addRows iṣẹ (recv_json)
{
var kana, empty_colspan = 7;
var table_rows = titun orun ();
// Fi tabili akọsori
addHeader (tabili_rows);
// Fi nikan kana
Object.each (recv_json, iṣẹ (igbasilẹ) {
table_rows.push (addRow (record.key, record.val));
});
pada table_rows;
}

Web iwe iranlọwọ
Fun awọn web apẹrẹ oju-iwe iranlọwọ, apejuwe iranlọwọ le tọka si sipesifikesonu JSON, pe ọrọ apejuwe le ni ibamu pẹlu iṣẹjade JSON ati iranlọwọ lati dinku awọn apejuwe laiṣe. Example nibi ti wa ni ya lati dhcp6 yii iṣeto ni.

Hyper-ọna asopọ ni orisun file
Fi iranlọwọ ranṣẹ file ipo ni awọn oniwe-orisun file HTML tag. Orukọ oniyipada ti o wa titi "help_page" ni a lo fun web oju-iwe iranlọwọ iṣẹ.

// Iranlọwọ iwe idan
var help_page = "/iranlọwọ/help_xxx.htm";

Ṣe imudojuiwọn apejuwe aaye HTML lati ijuwe JSON

Lo tabi HTML tag lati sọ HTML tabili apejuwe ati ki o fun a oto ID fun awọn tag.

Nigbati iwe HTML ba ti šetan, pe loadXMLDoc() lati gba gbogbo alaye sipesifikesonu JSON tabi gba apejuwe ọna kan pato nipasẹ orukọ ọna JSON "jsonRpc.status.introspection.specific.inventory.get".
Awọn ilanaTableDesc () ti lo lati mu awọn tabili apejuwe ati processUpdate () ti lo lati mu tabili paramita apejuwe.

Ninu ilanaUpdate (), pe updateTableParamsDesc () lati mu awọn eroja JSON dojuiwọn eyiti o baamu awọn orukọ eroja kan pato.
Ṣe imudojuiwọn awọn tabi tag HTML inu ni ibamu si apejuwe eroja.

/* Ṣe imudojuiwọn awọn aaye apejuwe HTML */
ilana iṣẹTableDesc (req) {
ti (! req.responseText) {
pada;
}
var json_spec = JSON.decode (req.responseText);
// Update tabili apejuwe
$ ("TableDesc").innerHTML = getJsonSpecElement (json_spec, "awọn ẹgbẹ", "dhcp6_relay.config.vlan").apejuwe;
}
/* Ṣe imudojuiwọn apejuwe paramita tabili HTML */
Ilana iṣẹ imudojuiwọn(recv_json) {
// Apejuwe paramita tabili imudojuiwọn
var param_names = [
{
"inagijẹ": "Interface",
"iru": "vtss_ifindex_t",
"orukọ": "vlanInterface",
"suffix": "."
},
{
"inagijẹ": "Atupalẹ Ayika",
"iru": "vtss_ifindex_t",
"orukọ": "relayVlanInterface",
"ìfikún": ". id ti wiwo ti a lo fun isọdọtun."
},
{
"inagijẹ": "Ile-pada sisẹ",
"iru": "mesa_ipv6_t",
"Orukọ": "relay_destination",
"ìfikún": ". Adirẹsi IPv6 ti olupin DHCPv6 ti o beere ni yoo tan si. Iye aiyipada 'ff05 :: 1: 3' mans 'eyikeyi olupin DHCP'."
}
];
updateTableParamsDesc ("TableParamsDesc", recv_json, "dhcp6_relay.config.vlan.get", param_names);
}
/* Gba JSON sipesifikesonu */
window.addEvent ('domready', iṣẹ () {
loadXMLDoc ("/ json_spec", ilanaTableDesc);
requestJsonDoc ("jsonRpc.status.introspection.specific.inventory.get", "dhcp6_relay.config.vlan", processUpdate);
});

Hyper-ọna asopọ ni akojọ bar

Awọn HTML orisun koodu ti akojọ bar ti wa ni ti ipilẹṣẹ lati file webstax2 \vtss_applweb\ menu_default.cxx.
Ṣatunkọ awọn nkan inu eyi file fun awọn Web oju-iwe hyper-ọna asopọ.

#ti o ba jẹ asọye (VTSS_SW_OPTION_DHCP6_RELAY)
ITEM (” Relay,dhcp6_relay.htm”);
#endif //VTSS_SW_OPTION_DHCP6_RELAY

AKIYESI
Ṣe akiyesi pe nọmba ohun kikọ aaye ninu ITEM(“”), eyiti a lo lati pinnu ipele ẹgbẹ ninu ọpa akojọ aṣayan. Ni idi eyi, gbogbo web Awọn oju-iwe wa labẹ ẹgbẹ “DHCPv6”.

Aworan 6. Eksample ti agbaye ni tunto tabili

Àfikún

Aṣoju web awọn oju-iwe

Orisirisi aṣoju lo wa web awọn oju-iwe le ṣee lo fun apẹrẹ itọkasi. Ọkan afikun example ṣe afihan nibi ni iṣeto ti igba digi kan ti a rii ni vtss_appl digi \ html mirror.htm.
Awọn web oju-iwe pese iṣeto alaye fun igba digi kan. Gbogbo tunto sile ti wa ni akojọ.

Tẹ bọtini “Fipamọ” lati lo iṣeto lọwọlọwọ.
Tẹ bọtini “Tunto” lati tun atunto lọwọlọwọ to.
Tẹ "Fagilee" lati pada si awọn loriview ti awọn akoko digi

Iṣeto Digi&RMiror

Agbaye Eto

Orisun VLAN(e) Iṣeto ni

Port iṣeto ni

Olusin 7. Example ti iṣeto ni alaye ti igba digi
Awọn bọtini “Fipamọ”, “Tunto” ati “Fagilee” jẹ afikun nipasẹ koodu html:

JSON Òfin sisan
Oju-iwe yii nilo sisan pipaṣẹ igbesẹ meji:

Ni akọkọ o nilo lati gba awọn agbara ti ẹrọ naa pẹlu ọna "mirror.capabilities.get". Awọn agbara ko yipada ati pe o ni lati ka ni ẹẹkan.
Lẹhinna o nilo lati gba iṣeto lọwọlọwọ ti ẹrọ nipa lilo awọn ọna “mirror.config.session.get”, “port.status.get” ati ni ọran ti stacking “topo.config.stacking.get”.

Ipe ti “mirror.capabilities.get” ti bẹrẹ nipasẹ iṣẹlẹ “domready” ati pe abajade ti wa ni tunto lati ṣe itọju nipasẹ ibeere iṣẹ imudojuiwọn.
Update ìbéèrè naa yoo bẹrẹ ipe ti “mirror.config.session.get”,
"port.status.get" ati ni irú ti stacking "topo.config.stacking.get" ati awọn esi ti awọn wọnyi awọn ipe ti wa ni tunto lati wa ni lököökan nipasẹ awọn iṣẹ preparedUpdate.
Imudara iṣẹ naa yoo gba gbogbo awọn abajade, ati pe nigbati gbogbo wọn ba ti gba yoo pe ilana iṣẹ naaUpdate ti yoo kọ awọn tabili lati ṣafihan lori web.