برقراری ارتباط با شبکه csc از طریق web3.js

1

با سلام خدمت جامعه توسعه دهندگان بلاکچین و قرار داد های هوشمند
من 0Xlive هستم و توی این قسمت میخوایم مثل ۲ قسمت قبلی با یک Node RPC ارتباط برقرار کنیم اما اینبار با زبان جاوا اسکریپت

web3.js یک پیاده سازی ( پیاده سازی رسمی )‌از web3 هستش که مجموعه ای از کتابخونه های مختلف نرم افزاری مناسب برای شبکه و رمزنگاری هستش که به ما در توسعه dapp ها کمک میکنه

مزیت جاوا اسکریپت این هست که میشه محیط توسعه اون رو سریع پیکربندی کرد و از اون جالب تر زبانی هست که میشه هم برای backend و هم برای frontend کد بزنید و حتی زبان solidity از لحاظ syntax شبیه به JS هست

پس اگه در حوزه برنامه نویسی قرار داد های هوشمند و اپلیکیشن های غیرمتمرکز کار میکنید زبان js یک زبان خیلی خیلی خوبی هست که میتونید بصورت فول استک همه چیز رو جلو ببرید ( برای نوشتن فرانت اند , بک اند , دسکتاپ , موبایل )

f4b1ed867f903661437779f548a5978e9a817f6b_2_690x192

نصب web3.js

در مرحله اول اقدام به نصب web3.js میکنیم. برای نصب محلی از npm استفاده میکنیم:

npm install web3

برای نصب با پکیج منیجر yarn هم داریم:

yarn add web3

و اما برای اضافه کردن web3.js به شکل یک فایل ارشیو شده به فایل html اینطوری عمل میکنیم :

<script src="https://cdnjs.cloudflare.com/ajax/libs/web3/1.7.3/web3.min.js"></script>

من در اینجا از روش سوم استفاده میکنم

شروع یک پروژه ساده

یک فایل html ساده میسازیم حاوی مقدار زیر:

<!DOCTYPE html>
<head>
<meta charset="utf-8">
<title>Hello World!</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/web3/1.7.3/web3.min.js"></script>
</head>

<body>

</body>
</html>

در اینجا من یک پرونده html تعریف کردم و pure web3.js رو اضافه کردم

قصد دارم مثل ۲ تاپیک قبلی یک کیف پول بسازم , یک تراکنش رو امضا کنم و بالانس کیف پولم رو بررسی کنم

ساخت کیف پول

قبل از همه چیز اول web3 رو وارد پروژه خودم میکنم و به شبکه متصل میشم:

const w3 = new Web3("https://testnet-rpc.coinex.net");

برای ساختن یک کیف پول با این طریق عمل میکنیم:

const account = w3.eth.accounts.create();

در بالا من یک کیف پول ساختم و اطلاعات اون رو توی account ریختم که یک object هست. برای بررسی محتوای متغیر account به این شکل عمل میکنیم :

consol.log(account)

که اگر همه چیز درست باشه چنین خروجی ای رو چاپ میکنه:

{ address: "0xCdC5E17e4C7046aB91522DD68d4e52184C5db12B", privateKey: "0x27d649fe9ba4b980b93c6a7f80912300b4f4535e8bd3f6dbafe982722eb44223", signTransaction: signTransaction(r, n), sign: sign(r), encrypt: encrypt(r, n) }

حالا میریم برای ذخیره کردن این دو در local storage ( در واقع قصد داریم یک web wallet بسازیم ) چرا که با هر بار رفرش کردن یک جفت کلید خصوصی و ادرس جدید برامون میسازه

localStorage.setItem("address", account.address);
localStorage.setItem("privateKey", account.privateKey);

خیلی خب حالا میریم که ادرس کیف پولمون رو توی صفحه html چاپ کنیم. ابتدا یک تگ میسازیم و با استفاده از js و dom ادرس کیف پول رو روی صفحه نمایش میدم:

//html

<p>Your Address  is:</p>
<p id="address"></p>

//js 
document.getElementById("address").innerHTML = localStorage.getItem("address");

در کد بالا من دارم مقداری که در local storage مرورگر ذخیره کردم رو میخونم و اون رو در تگ html با نام address چاپ میکنم

حالا بریم یک تراکنش بسازیم

ساخت و امضا کردن یک تراکنش

درباره خصیصه های یک تراکنش اتریومی در تاپیک های قبلی صحبت کردیم حالا بیاید یک تراکنش با همون مشخصات بسازیم:

const transaction = {
     'to': 'recipient address', // recipient's address
     'value': 1,
     'gas': 30000,
     'maxPriorityFeePerGas': 1000000108,
     'nonce': nonce,
     // optional data field to send message or execute smart contract
    };

برای گرفتن nounce اینطور عمل میکنیم:

    const nonce = await w3.eth.getTransactionCount(localStorage.getItem("address"), 'latest');

حالا تراکنش رو امضا میکنیم:

    const signedTx = await w3.eth.accounts.signTransaction(transaction, localStorage.setItem("privateKey", account.privateKey));
    
    w3.eth.sendSignedTransaction(signedTx.rawTransaction, function(error, hash) {
    if (!error) {
      console.log("TX Hash is ", hash);
    } else {
      console.log("a mistake was made", error)
    }
   });

تبریک میگم ما موفق شدیم یک تراکنش رو امضا کنیم و به شبکه از طریق نود broad cast کنیم

حالا بریم بررسی کنیم ببینیم موجودی کیف پول ما بعد از این تراکنش چقدر هست؟

بررسی balance

گرفتن بالانس کیف پول رو با استفاده از getBalance انجام میدیم:

w3.eth.getBalance(localStorage.getItem("address"), function(err, result) {
  if (err) {
    console.log(err)
  } else {
    console.log(web3.utils.fromWei(result, "ether") + " CSC")
  }
})

در اینجا ما ادرس کیف پولمون رو خوندیم و به getBalance دادیم و مقدار موجودی اون رو گرفتیم. از اونجایی که مقداری که برمیگردونه wei هست به ether تبدیل میکنیم . نتیجه رو چاپ میکنیم

حالا فکر میکنید میشه با این ایده چه کار هایی انجام داد؟افرین یک کیف پول غیر حضانتی وب اما دیگه چی؟ میتونیم اطلاعات رو با AES256 رمزکنیم و اون رو در یک فایل json روی سیستم بنویسیم و بخونیم و یک افزونه مثل متامسک بنویسیم

خودتون میتونید به این ایده شاخ و برگ بدید و ابزار خودتون رو بنویسید :grin: