Útmutató az Ethereum decentralizált szavazási alkalmazás fejlesztéséhez

Miután a teljes kriptopénzpiac meghaladta a 700 milliárd dolláros piaci korlátot, a kriptopénz tér felrobbant az elmúlt néhány hónapban. De ez még csak a kezdet. Mivel a blokklánc-rendszerek tovább fejlődnek és terjednek, a decentralizált alkalmazások, más néven dApps egyik nagyszerű módja ennek az új térnek a bejutására és ennek a technológiának a kiaknázására.

Az Ethereum blokklánc torlódásairól híres CryptoKitties remek példa egy dApp-ra, amely egyedülálló módon ötvözi a tenyészhető és gyűjthető macskák fogalmát a blokklánccal. Ez a szenzációs játék csak egy kreatív példa a gyakorlatilag korlátlan számú lehetőségből.

Bár látszólag nagyon bonyolult, bizonyos keretrendszereket és eszközöket kifejlesztettek a blokklánccal és az intelligens szerződésekkel való interakciójának elvonatkoztatására. Ebben a blogbejegyzésben áttekintem a decentralizált szavazási alkalmazás létrehozásának egyik módját az Ethereumon. Röviden áttekintem az Ethereumot, de valószínűleg meg kell értenie, hogy ezt az útmutatót teljes mértékben felhasználja. Ezen kívül azt várom, hogy ismerje a Javascript-et.

Miért készítsen decentralizált szavazás alkalmazást?

Alapvetően egy nagyszerű decentralizált alkalmazás, amely a blockchain technológiát használja, lehetővé teszi, hogy ugyanazokat a műveleteket hajtsa végre, mint ma (például pénzátutalás) megbízható harmadik fél nélkül. A legjobb dApps-eknek van egy konkrét valós használati esetük, amely kihasználja a blokklánc egyedi jellemzőit.

Lényegében a blokklánc egy megosztott, programozható, kriptográfiailag biztonságos és ezért megbízható főkönyv, amelyet egyetlen felhasználó sem irányíthat és amelyet bárki ellenőrizhet. - Klaus Schwab

Annak ellenére, hogy egy szavazó alkalmazás nem biztos, hogy nagyszerű alkalmazás a fogyasztók számára, azért döntöttem úgy, hogy ezt az útmutatót használom, mert a blokklánc által megoldott fő kérdések - az átláthatóság, a biztonság, az akadálymentesség, a hallhatóság - a jelenlegi demokratikus választásokat sújtó fő problémák.

Mivel a blokklánc az elosztott tranzakciók (szavazatok) állandó nyilvántartása, minden szavazat cáfolhatatlanul visszavezethető arra, hogy pontosan mikor és hol történt, anélkül, hogy felfednék a választó személyazonosságát. Ezenkívül a korábbi szavazatokat nem lehet megváltoztatni, míg a jeleneket nem lehet feltörni, mert minden tranzakciót a hálózat minden egyes csomópontja ellenőriz. És minden külső vagy belső támadónak rendelkeznie kell a csomópontok 51% -ának ellenőrzésével a rekord megváltoztatásához.

Még akkor is, ha a támadó képes volt arra, hogy bár a felhasználói szavazatokat helytelenül adta meg valódi azonosítójukkal a radar alá, a végponttól végéig tartó szavazási rendszerek lehetővé tehetik a választók számára, hogy ellenőrizzék, helyesen adták-e be a szavazatukat a rendszerbe, ezáltal a rendszer rendkívül biztonságos.

Az Ethereum alapkomponensei

Arra számítok, hogy megértette a Blockchain-t és az Ethereumot az útmutató további részében. Itt van egy fantasztikus útmutató róla, és írtam egy rövid áttekintést azokról az alapvető összetevőkről, amelyeket szeretném, ha tudnának.

  1. Az intelligens szerződések háttér-logikaként és tárolóként működnek. A szerződés Solidity, intelligens szerződéses nyelven íródott, és egy kód- és adatgyűjtemény, amely az Ethereum blokklánc egy adott címén található. Nagyon hasonlít az Object Oriented Programming osztályához, ahol függvényeket és állapotváltozókat tartalmaz. Az intelligens szerződések és a Blockchain együttesen az összes decentralizált alkalmazás alapját képezik. A Blockchainhoz hasonlóan megváltoztathatatlanok és elosztottak, ami azt jelenti, hogy frissítésük fájdalmat okoz, ha már az Ethereum hálózatban vannak. Szerencsére itt van néhány módszer erre.
  2. Az Ethereum virtuális gép (EVM) kezeli a teljes Ethereum hálózat belső állapotát és számítását. Gondoljon az EVM-re, mint erre a hatalmas decentralizált számítógépre, amely „címeket” tartalmaz, amelyek képesek végrehajtani a kódot, megváltoztatni az adatokat és kölcsönhatásba lépni egymással.
  3. Web3.jsegy Javascript API, amely lehetővé teszi a Blockchain-nel való interakciót, ideértve a tranzakciók lebonyolítását és az intelligens szerződésekre való felhívásokat. Ez az API elvonatkoztatja az Ethereum kliensekkel folytatott kommunikációt, így a fejlesztők az alkalmazásuk tartalmára összpontosíthatnak. Ehhez be kell ágyaznia a web3 példányt a böngészőbe.

Egyéb általunk használt eszközök

  1. Szarvasgombaegy népszerű tesztelési fejlesztési keretrendszer az Ethereum számára. Tartalmaz egy fejlesztési blokkláncot, összeállítási és migrációs szkripteket a szerződés telepítéséhez a blokklánchoz, szerződéses tesztelést és így tovább. Ez megkönnyíti a fejlesztést!
  2. A szarvasgomba-szerződések egy absztrakció a Web3 Javascript API tetején, amely lehetővé teszi, hogy egyszerűen csatlakozzon és kommunikáljon az intelligens szerződésével.
  3. A Metamask elhozza az Ethereumot a böngészőjéhez. Ez egy böngészőbővítmény, amely az Ethereum címéhez kapcsolódó biztonságos web3 példányt biztosít, lehetővé téve a decentralizált alkalmazások használatát. Ebben az oktatóanyagban nem fogjuk használni a Metamask alkalmazást, de ez lehetővé teszi az emberek számára, hogy kölcsönhatásba lépjenek az Ön DAppjával a gyártásban. Ehelyett a saját web3 példányunkat injektáljuk a fejlesztés során. További információért nézze meg ezt a linket.

Kezdjük!

Az egyszerűség kedvéért valójában nem építjük fel azt a teljes szavazási rendszert, amelyet korábban leírtam. A magyarázat megkönnyítése érdekében ez csak egy egyoldalas alkalmazás lesz, ahol a felhasználó megadhatja azonosítóját és szavazhat egy jelöltre. Lesz egy gomb, amely megszámolja és megjeleníti az egy jelöltre jutó szavazatok számát.

Így képesek leszünk összpontosítani az intelligens szerződések létrehozásának és azokkal való interakció folyamatát egy alkalmazáson belül. A teljes alkalmazás forráskódja ebben a lerakatban lesz, és telepítenie kell a Node.js-t és az npm-et.

Először telepítsük a Truffle-t globálisan.

npm install -g truffle

A Szarvasgomba parancsok használatához futtatnia kell őket egy meglévő projektben.

git clone //github.com/tko22/truffle-webpack-boilerplatecd truffle-webpack-boilerplatenpm install

Ez az adattár csak egy szarvasgombás doboz váza, amelyek kazánlemezek vagy példaalkalmazások, amelyeket egy parancsban kaphat - truffle unbox [box name]. A webcsomaggal rendelkező szarvasgomba doboz azonban nem frissül a legújabb verziókkal, és tartalmaz egy példa alkalmazást. Így hoztam létre ezt a repót (amely a fenti utasításokban linkelt).

2. Könyvtár felépítése

A címtárstruktúrának a következőket kell tartalmaznia:

  • contracts/- Az összes Szerződést tartalmazó mappa. NE töröljeMigrations.sol
  • migrations/ - Migrációs fájlokat tartalmazó mappa, amely segít az intelligens szerződések telepítésében a Blockchainbe.
  • src/ - tartalmazza az alkalmazás HTML / CSS és Javascript fájljait
  • truffle.js - Szarvasgomba konfigurációs fájl
  • build/- Ezt a mappát addig nem látja, amíg össze nem állítja a szerződéseit. Ez a mappa tárolja az összeállítás műtermékeit, ezért ne módosítsa ezeket a fájlokat! A Build műtárgyak leírják a szerződés funkcióját és architektúráját, valamint a szarvasgomba-szerződéseknek és a web3-nak információkat nyújtanak arról, hogyan léphetnek kapcsolatba az intelligens szerződéssel a blokkláncban.

1. Írja meg az intelligens szerződéseket

Elég a beállítással és a bevezetéssel. Menjünk be a kódba! Először is megírjuk az intelligens szerződésünket, amely szilárdan íródott (a többi nyelv nem annyira népszerű). Lehet, hogy ijesztőnek tűnik, de nem az.

Bármely alkalmazáshoz azt szeretné , ha az intelligens szerződések a lehető legegyszerűbbek, sőt ostobán egyszerűek lennének. Ne feledje, hogy minden egyes számításért / tranzakcióért fizetnie kell, és az intelligens szerződéseitek örökre a Blockchainen maradnak. Tehát nagyon szeretné, ha tökéletesen működne - vagyis minél összetettebb, annál könnyebb hibázni.

Szerződésünk a következőket tartalmazza:

  1. Állapotváltozók - változó, hogy tartsa értékeket, amelyek tartósan tárolt Blockchain. Állami változókat használunk a szavazók és a jelöltek listájának és számának megtartására.
  2. Funkciók - A függvények az intelligens szerződések futtatható fájljai. Őket hívjuk majd arra, hogy kölcsönhatásba lépjünk a Blockchain-nal, és különböző láthatósági szintjük van, belső és külső szempontból is. Ne feledje, hogy amikor egy változó értékét / állapotát meg akarja változtatni, tranzakciónak kell bekövetkeznie - ennek költsége Ether. Azt is, hogy callsa Blockchain, ami nem kerül semmilyen Éter mert az elvégzett módosítások fog pusztulni (erről bővebben a 3. szakasz, amikor valójában a transactionsés calls).
  3. Események - Amikor eseményt hívnak meg, az eseménybe továbbított érték naplózásra kerül a tranzakció naplójában. Ez lehetővé teszi a Javascript visszahívási funkcióinak vagy a megoldott ígéreteknek, hogy megtekinthessék azt a bizonyos értéket, amelyet tranzakció után vissza akart adni. Ennek oka, hogy minden tranzakció végrehajtásakor a tranzakciós napló visszatér. Eseményt használunk az újonnan létrehozott Jelölt azonosítójának naplózására, amelyet megjelenítünk (ellenőrizze a 3. szakasz első felsorolási pontját).
  4. Struktúra típusok - Ez nagyon hasonlít egy C struktúrához. A struktúrák lehetővé teszik több változó tárolását, és félelmetesek a több attribútummal rendelkező dolgokban. Candidatescsak a nevük és a pártjuk lesz, de mindenképpen hozzáadhat további attribútumokat hozzájuk.
  5. Mappings - Gondolj ezek, mint a hash-térképek és szótárak, ahol van egy kulcs-érték párt. Két leképezést fogunk használni.

Van még pár típus, amelyet itt nem sorolnak fel, de némelyikük kicsit bonyolultabb. Ez az öt olyan struktúrákat foglal magában, amelyeket egy intelligens szerződés általában használni fog. Ezeket a típusokat itt részletesebben elmagyarázzuk.

Hivatkozásként itt találja az intelligens szerződés kódját. Ne feledje, hogy ezt a fájlt meg kell hívni, Voting.solde azt akartam, hogy a Github lényege stílus legyen, ezért .jskiterjesztést adtam neki . Az útmutató többi részéhez hasonlóan a kódban is megjegyzéseket fogok tenni, amelyek elmagyarázzák, hogy mit csinál, és utána elmagyarázom az összképet, rámutatva bizonyos figyelmeztetésekre és logikára.

Alapvetően két olyan struktúránk van (típusok, amelyek több változót tartalmaznak) leírják a szavazókat és a jelölteket. A Strukturokkal több tulajdonságot is rendelhetünk hozzájuk, például e-maileket, címeket stb.

A szavazók és a jelöltek nyomon követése érdekében külön leképezésekbe helyezzük őket, ahol egész indexeléssel rendelkeznek. A jelöltek vagy a szavazók indexe / kulcsa - nevezhetjük azonosítónak - az egyetlen módja annak, hogy a funkciók hozzáférjenek hozzájuk .

Nyilvántartjuk a szavazók és a jelöltek számát is, ami segít indexelni őket. Ezenkívül ne feledkezzen meg a 8. sor eseményéről, amely naplózza a jelentkező azonosítóját, amikor hozzáadódik. Ezt az eseményt a kezelőfelületünk fogja használni, mivel nyomon kell követnünk a jelölt személyazonosító okmányát ahhoz, hogy egy jelöltre szavazzunk.

  1. Tudom, ellentétben azzal, amit korábban a szerződések szuper egyszerűvé tételéről mondtam, egy kicsit bonyolultabbá tettem ezt a szerződést ahhoz képest, amit ez az alkalmazás valójában tesz. Ezt azonban azért tettem, hogy srácok sokkal könnyebben tudjanak utána szerkeszteni és funkciókat hozzáadni ehhez az alkalmazáshoz (erről bővebben a végén). Ha még egyszerűbb szavazási alkalmazást szeretne készíteni, akkor az intelligens szerződés kevesebb, mint 15 kódsorban működhet.
  2. Ne feledje, hogy az állapotváltozók numCandidatesés numVotersnem nyilvánosak. Alapértelmezés szerint ezeknek a változóknak láthatóságuk van internal, ami azt jelenti, hogy csak a jelenlegi szerződés vagy a származtatott szerződések alapján férhetnek hozzá közvetlenül (emiatt ne aggódj, nem fogjuk használni).
  3. A 32byteskarakterláncokhoz használjuk a stringtípus helyett . Az EVM-nek 32 bájtnyi szómérete van, ezért „optimalizált” arra, hogy 32 bájtos darabokban kezelje az adatokat. (Az olyan fordítóknak, mint a Solidity, több munkát kell elvégezniük, és több bájtkódot kell létrehozniuk, ha az adatok nincsenek 32 bájtnyi darabokban, ami gyakorlatilag magasabb gázköltséghez vezet.)
  4. Amikor a felhasználó szavaz, új Voterstruktúra jön létre, és hozzáadódik a leképezéshez. Annak érdekében, hogy megszámlálhassa egy adott jelölt szavazatainak számát, át kell tekintenie az összes szavazót, és meg kell számlálnia a szavazatok számát. A jelöltek ugyanazt a magatartást tanúsítják. Így ezek a leképezések megtartják az összes jelölt és választópolgár történetét.

2. Azonnali web3 és szerződések

Az intelligens szerződésünk befejezésével most futtatnunk kell a teszt blokkláncunkat, és telepítenünk kell ezt a szerződést a Blockchainre. Szükségünk lesz egy módra a beszélgetésre is, amely a web3.js-n keresztül fog történni.

Mielőtt elkezdenénk teszt blokkláncunkat, létre kell hoznunk egy fájlt, amelyet 2_deploy_contracts.jsa mappa belsejében nevezünk /contractsel, és amely azt mondja neki, hogy a migráláskor tartalmazza a Voting Smart Contract-t is.

Az Ethereum blokklánc fejlesztésének elindításához lépjen a parancssorba, és futtassa:

truffle develop

Ez a parancssorodon fog élni. Mivel a Solidity egy lefordított nyelv, az EVM végrehajtásához előbb byte-kódolásra kell fordítanunk.

compile

Most látnia kell egy build/mappát a könyvtárában. Ez a mappa tartalmazza a Szarvasgomba belső működéséhez elengedhetetlen összeállítási tárgyakat, ezért ne nyúljon hozzájuk!

Ezután át kell állítanunk a szerződést. Az Migrations egy Szarvasgomba szkript, amely segít fejleszteni az alkalmazás szerződésének állapotát. Ne feledje, hogy a szerződését a Blockchain egy bizonyos címére telepítették, így bármikor, amikor módosításokat hajt végre, a szerződése egy másik címen található. Az áttelepítések segítenek ebben, és az adatok mozgatásában is.

migrate

Gratulálunk! Az okos szerződésed most már örökre a Blockchainen van. Nos, nem igazán…. mert truffle developminden alkalommal frissít, amikor abbahagyja.

Ha tartós blokkláncot szeretne, vegye fontolóra a Ganache-ot, amelyet szintén a Truffle fejlesztett ki. Ha Ganache-ot használ, akkor nem kell telefonálnia truffle develop. Ehelyett futni fog truffle compileés truffle migrate. Nézze meg ezt a blogbejegyzést, hogy megértse, mi is valójában egy szerződés szarvasgomba nélküli telepítése.

Miután telepítettük az intelligens szerződést a Blockchainhez, a böngészőben minden alkalommal telepítenünk kell egy web3.0 példányt a böngészőben a Javascript segítségével. Így a következő kódrészlet az aljára kerül js/app.js. Ne feledje, hogy a web3.0 0.20.1 verzióját használjuk.

Nem igazán kell aggódnia, ha nem érti ezt a kódot. Csak tudd, hogy ez az alkalmazás indításakor futtatható, és ellenőrzi, hogy van-e már web3 példány (Metamask) a böngésződben. Ha nincs, akkor létrehozunk egyet, amelyik beszélget localhost:9545, vagyis a Szarvasgomba fejlesztési blokkláncot.

A Ganache használata esetén módosítania kell a portot 7545. Miután létrehozott egy példányt, meghívjuk a startfüggvényt (a következő szakaszban definiálom).

3. Adja hozzá a funkcionalitást

Az utolsó dolog, amit meg kell tennünk, meg kell írnunk az alkalmazás felületét. Ez magában foglalja az összes webalkalmazás alapvető fontosságát - HTML, CSS és Javascript (egy web3 példány létrehozásával már írtunk egy keveset a Javascriptről). Először hozzuk létre a HTML fájlunkat.

Ez egy nagyon egyszerű oldal, a felhasználói azonosító beviteli űrlapjával, valamint a szavazás és a szavazatok számlálása gombokkal. Ha rákattint ezekre a gombokra, akkor meghatározott funkciókat hívnak meg, amelyek szavaznak, és megtalálják a jelöltek szavazatainak számát.

Három fontos div elemeket azonban azonosítóval: candidate-box, msgés vote-box, ami tart négyzeteket minden jelölt, egy üzenet, és a szavazatok száma, ill. Importálunk még JQuery-t, Bootstrap-et és app.js.

Most csak kölcsönhatásba kell lépnünk a Szerződéssel, és végre kell hajtanunk a szavazás és az egyes jelöltek szavazatainak számbavételének funkcióit. A JQuery manipulálja a DOM-ot, és az ígéreteket fogjuk használni, amikor tranzakciókat hajtunk végre, vagy hívásokat kezdeményezünk a Blockchain felé. Az alábbiakban található a app.js.

Ne feledje, hogy az előző lépésben megadott kód a web3 példány létrehozásához is itt van. Először importáljuk a szükséges könyvtárakat és webcsomagokat, beleértve a web3 és a szarvasgomba szerződéseket. Szarvasgomba-szerződéseket fogunk használni, amely a web3 tetejére épül, hogy kölcsönhatásba lépjen a Blockchain-nel.

Használatához megragadjuk azokat az összeállítási tárgyakat, amelyek automatikusan épültek, amikor összeállítottuk a szavazási intelligens szerződést, és felhasználjuk őket a Szarvasgomba szerződés megalkotásához. Végül a globális változóban beállítottuk windowaz alkalmazás indításához, egy jelöltre való szavazáshoz és a szavazatok számának megállapításához szükséges funkciókat.

Ahhoz, hogy valóban kapcsolatba léphessünk a Blockchain-nel, létre kell hoznunk a Szarvasgomba-szerződés példányát a deployedfüggvény használatával. Ez viszont ígéretet fog adni a példánnyal, mint a visszatérési értékkel, amelyet az intelligens szerződés függvényeinek meghívására fog használni.

Kétféle módon lehet kölcsönhatásba lépni ezekkel a funkciókkal: tranzakciók és hívások. A tranzakció írási művelet, amelyet a teljes hálózatra sugároznak, és a bányászok feldolgozzák (és így Etherbe kerülnek). Tranzakciót kell végrehajtania, ha egy állapotváltozót módosít, mivel ez megváltoztatja a blokklánc állapotát.

A hívás olvasási művelet, amely egy tranzakciót szimulál, de elveti az állapotváltozást. Így nem kerül Etherbe. Ez nagyszerű a getter függvények hívásához (nézze meg azt a négy getter függvényt, amelyet korábban okos szerződésünkben írtunk).

Ahhoz, hogy egy tranzakció szarvasgombás szerződések, akkor írj instance.functionName(param1, param2), és instancea példány, amit visszaküldött a deployedfüggvény (Check 36. sor példát). Ez a tranzakció ígéretet ad vissza, amelynek tranzakciós adatai megtérülési értékként szerepelnek. Így, ha az intelligens szerződéses függvényben visszaad egy értéket, de ugyanezzel a funkcióval hajt végre tranzakciót, az nem adja vissza ezt az értéket.

Ezért van egy olyan eseményünk, amely naplózza, amit csak akar, hogy beírja a visszaküldött tranzakciós adatokba. A 36–37. Sorok esetében tranzakciót hajtunk végre egy Jelölt felvételével. Amikor megoldjuk az ígéretet, a tranzakciós adatok benne vannak result.

Ahhoz, hogy a candidateID, hogy mi együtt naplózza az eseményt AddedCandidate()(ellenőrizze a smart szerződés látni 0), akkor kell átmenni a naplókat, és vegye át a következő: result.logs[0].args.candidateID.

Ahhoz, hogy valóban lássa, mi történik, használja a Chrome fejlesztői eszközöket a rendszer kinyomtatásához resultés áttekintéséhez result.

Hívás indításához írjon instance.functionName.call(param1,param2). Ha azonban egy funkciónak van kulcsszava view, akkor a Szarvasgomba szerződések automatikusan létrehozzák a hívást, és így nem kell hozzáadnia a .call.

Ezért van a getter funkcióink viewkulcsszava. Tranzakciótól eltérően a hívás visszaadott ígéretének értéke megtérül, bármit is ad vissza az intelligens szerződés funkció.

Most röviden elmagyarázom a 3 funkciót, de ennek nagyon ismerősnek kell lennie, ha olyan alkalmazásokat épített fel, amelyek adatokat keresnek / módosítanak egy adattárból, és ennek megfelelően manipulálják a DOM-ot. Gondoljon a Blockchainra, mint adatbázisra, és a Szarvasgomba szerződésekre, mint az API-ra, hogy adatokat kapjon az adatbázisából.

App.start ()

Ezt a függvényt azonnal meghívjuk, miután létrehoztunk egy web3 példányt. A szarvasgomba-szerződések működéséhez be kell állítanunk a szolgáltatót a létrehozott web3-példányba, és be kell állítanunk az alapértelmezéseket (például melyik fiókot használjuk, és mennyi gázmennyiséget kíván fizetni a tranzakcióhoz).

Mivel fejlesztési módban vagyunk, bármilyen mennyiségű benzint és számlát felhasználhatunk. A gyártás során átvettük a MetaMask által biztosított számlát, és megpróbáltuk kitalálni a lehető legkevesebb gázmennyiséget, mivel valóban valódi pénz.

Miután mindent beállítottunk, mostantól minden felhasználó jelöltjének jelölőnégyzetét megjelenítjük, hogy a felhasználó szavazhasson. Ehhez létre kell hoznunk a szerződés egy példányát, és meg kell szereznünk a Jelölt adatait. Ha nincs jelölt, létrehozzuk őket. Ahhoz, hogy a felhasználó egy jelöltre szavazzon, meg kell adnunk az adott jelölt azonosítóját. Így minden jelölőnégyzet elemnek tartalmaznia kell egy id(HTML elem attribútumot) a jelölt azonosítóját. Ezenkívül hozzáadjuk a jelöltek számát egy globális változóhoz numOfCandidates, amelyet felhasználni fogunk App.findNumOfVotes(). A JQuery segítségével minden jelölőnégyzetet és annak jelölt nevét hozzáfűzik .candidate-box.

App.vote ()

Ez a függvény egy adott jelöltre fog szavazni, amelyre a jelölőnégyzetre kattintanak, és annak idattribútuma alapján.

Először ellenőrizni fogjuk, hogy a felhasználó megadta-e a felhasználói azonosítóját, amely az azonosítójuk. Ha nem tették meg, megjelenítünk egy üzenetet, amelyben felszólítjuk őket.

Másodszor: ellenőrizzük, hogy a felhasználó egy jelöltre szavaz-e, és ellenőrizzük, hogy van-e legalább egy jelölőnégyzet, amelyre kattintottak. Ha egyik jelölőnégyzetre sem kattintottak, akkor egy üzenetet is megjelenítünk, amelyben felszólítjuk őket, hogy szavazzanak egy jelöltre. Ha az egyik jelölőnégyzetre kattint, akkor megragadjuk a idjelölőnégyzet attribútumát, amely egyben a kapcsolt jelölt azonosítója is, és ezt használjuk arra, hogy a jelöltre szavazzunk.

A tranzakció befejezése után megoldjuk a visszaküldött ígéretet és megjelenítünk egy „Szavazott” üzenetet.

App.findNumOfVotes ()

Ez az utolsó funkció megtalálja az egyes jelöltek számára a Szavazatok számát, és megjeleníti azokat. Átmegyünk a jelölteken, és két intelligens szerződéses függvényt hívunk meg, getCandidateés totalVotes. Megoldjuk ezeket az ígéreteket, és létrehozunk egy HTML elemet az adott jelölt számára.

Indítsa el az alkalmazást, és látni fogja //localhost:8080/!

npm run dev

Erőforrások

Tudom, ez sok ... Lehet, hogy egy ideig nyitva áll ez a cikk, miközben lassan fejleszti ezt az alkalmazást, és valóban megérti, mi folyik itt. De ez a tanulás! Kérjük, egészítse ki ezt az útmutatót az Ethereum, a Szarvasgomba és az alábbiakban bemutatott összes dokumentummal. Megpróbáltam megütni a cikk számos kulcsfontosságú pontját, de ez csak egy rövid áttekintés, és ezek a források sokat segítenek.

  • Minden a szilárdságról és az intelligens szerződésekről - mindenre gondolok
  • Minden a szarvasgombával kapcsolatban
  • Szarvasgomba szerződések
  • Web3 Javascript API- ezt nagyszerű lesz tudni és hivatkozni, de a szarvasgomba-szerződések ennek sok részét kivonják
  • Hasznos DApp minták
  • Ethereum Docs - nézzen az oldalsó sávba, és rengeteg dolog van
  • CryptoKitties kód magyarázat - Az író átlátja a CryptoKitties intelligens szerződésének fontos részeit
  • Intelligens szerződéses legjobb gyakorlatok- kötelező olvasmány

Következtetés

Az alkalmazások építése az Ethereumon meglehetősen hasonlít egy háttérprogramot hívó rendszeres alkalmazáshoz. A legnehezebb egy robusztus és teljes okos szerződés megírása. Remélem, hogy ez az útmutató segített megérteni a decentralizált alkalmazások és az Ethereum alapvető ismereteit, és elindítja érdeklődését azok fejlesztése iránt.

Ha ki akar építeni abból, amit építettünk, íme néhány ötlet. Az okos szerződést valóban úgy írtam meg, hogy könnyen megvalósítható legyen mindazzal, amit ebben az útmutatóban adtam neked.

  • Mutassa meg az egyes jelöltek pártját. Már indulva megkapjuk a jelölt pártját getCandidate(id).
  • Ellenőrizze, hogy a Felhasználó által megadott azonosító egyedi-e.
  • Kérjen és tároljon további információkat a Felhasználóról, például születési dátumát és otthoni címét.
  • Adjon hozzá egy lehetőséget, hogy lássa, hogy egy adott azonosítóval rendelkező személy szavazott-e vagy sem. Létrehozna egy új űrlapot egy azonosító megadásához, amelyet aztán a blokkláncban megkeresi az adott felhasználóra.
  • Írjon egy új okos szerződéses funkciót, amely egyszerre számít MINDEN jelölt szavazatára. Jelenleg két külön pályázót kell indítanunk két jelölt számára, megkövetelve, hogy a szerződés kétszer lépjen végig az összes Felhasználón.
  • Új jelöltek felvételének engedélyezése. Ez azt jelenti, hogy új űrlappal kell kiegészíteni a Jelölteket, de egy kicsit változtatni kell azon is, hogy miként jelenítjük meg és szavazzuk meg a jelölteket a frontenden.
  • A felhasználóktól Ethereum-címet kell megadni a szavazáshoz. Az a logikám, hogy nem veszem figyelembe a felhasználói címeket, mert a választóktól nem várható el, hogy az Ethereum részt vegyen ebben a szavazási folyamatban. Azonban sok DApps megköveteli a felhasználóktól, hogy legyenek Ethereum címek.

Itt van néhány tipp, amelyek megakadályozhatják egyes útzárak bekövetkezését:

  • Kétszer és háromszor ellenőrizze az intelligens szerződés funkcióit, ha valami furcsa történik. Pár órát töltöttem egy hibán, hogy rájöjjek, hogy az egyik funkciómban rossz értéket adtam vissza.
  • Ellenőrizze, hogy URL-je és portja helyes-e, amikor csatlakozik a fejlesztői blokklánchoz. Ne feledd: 7545az a truffle developés 9545az a ganache. Ezek alapértelmezettek, ezért ha nem tud csatlakozni a blokkláncához, akkor valószínűleg megváltoztatta őket.
  • Nem mentem át ezen, mert ez az útmutató túl hosszú lett volna, és valószínűleg teszek még egy bejegyzést erről - de tesztelje a szerződéseit! Sokat fog segíteni.
  • Ha nem ismeri az ígéreteket, akkor nézze át, hogyan működnek és hogyan használják fel őket. A szarvasgomba szerződések ígéreteket használnak, és a web3 béta verziója is támogatja az ígéreteket. Ha rosszul cselekszenek, elronthatják a beolvasott adatok nagy részét.

Üdvözlet a decentralizált és biztonságos internet eléréséért - Web 3.0!

Remélem, hogy annyira élvezte ezt az útmutatót, mint én, amikor én írtam! Ha bármilyen gondolata és észrevétele van, nyugodtan hagyjon megjegyzést alább, vagy írjon nekem e-mailt a [email protected] címre, vagy tweeteljen (nemrégiben hoztam létre)! Használd nyugodtan a kódomat, és oszd meg barátaiddal!