{"id":582,"date":"2022-12-18T15:32:21","date_gmt":"2022-12-18T05:32:21","guid":{"rendered":"https:\/\/test.secrypt.tech\/?page_id=582"},"modified":"2023-01-05T17:47:28","modified_gmt":"2023-01-05T07:47:28","slug":"overview","status":"publish","type":"page","link":"https:\/\/test.secrypt.tech\/index.php\/overview\/","title":{"rendered":"Overview"},"content":{"rendered":"<style>\/*! elementor - v3.9.2 - 21-12-2022 *\/\n.elementor-widget-image{text-align:center}.elementor-widget-image a{display:inline-block}.elementor-widget-image a img[src$=\".svg\"]{width:48px}.elementor-widget-image img{vertical-align:middle;display:inline-block}<\/style>\n<p>\t\t\t\t\t\t\t\t\t\t\t\t\t<a href=\"https:\/\/test.secrypt.tech\/\"><br \/>\n\t\t\t\t\t\t\t<img decoding=\"async\" src=\"https:\/\/test.secrypt.tech\/wp-content\/uploads\/elementor\/thumbs\/image-removebg-preview-pusb43b4fkgjv12hawycptkh3fmhfjngdaesxsjilk.png\" title=\"image-removebg-preview\" alt=\"image-removebg-preview\" \/>\t\t\t\t\t\t\t\t<\/a><\/p>\n<style>\/*! elementor - v3.9.2 - 21-12-2022 *\/\n.elementor-column .elementor-spacer-inner{height:var(--spacer-size)}.e-con{--container-widget-width:100%}.e-con-inner>.elementor-widget-spacer,.e-con>.elementor-widget-spacer{width:var(--container-widget-width,var(--spacer-size));--align-self:var(--container-widget-align-self,initial);--flex-shrink:0}.e-con-inner>.elementor-widget-spacer>.elementor-widget-container,.e-con-inner>.elementor-widget-spacer>.elementor-widget-container>.elementor-spacer,.e-con>.elementor-widget-spacer>.elementor-widget-container,.e-con>.elementor-widget-spacer>.elementor-widget-container>.elementor-spacer{height:100%}.e-con-inner>.elementor-widget-spacer>.elementor-widget-container>.elementor-spacer>.elementor-spacer-inner,.e-con>.elementor-widget-spacer>.elementor-widget-container>.elementor-spacer>.elementor-spacer-inner{height:var(--container-widget-height,var(--spacer-size))}<\/style>\n<style>\/*! elementor - v3.9.2 - 21-12-2022 *\/\n.elementor-heading-title{padding:0;margin:0;line-height:1}.elementor-widget-heading .elementor-heading-title[class*=elementor-size-]>a{color:inherit;font-size:inherit;line-height:inherit}.elementor-widget-heading .elementor-heading-title.elementor-size-small{font-size:15px}.elementor-widget-heading .elementor-heading-title.elementor-size-medium{font-size:19px}.elementor-widget-heading .elementor-heading-title.elementor-size-large{font-size:29px}.elementor-widget-heading .elementor-heading-title.elementor-size-xl{font-size:39px}.elementor-widget-heading .elementor-heading-title.elementor-size-xxl{font-size:59px}<\/style>\n<h2>Overview of MetaMask<\/h2>\n<p>MetaMask\u00a0is a crypto wallet that can be used in a web browser and on mobile devices to interact with the Ethereum blockchain. It allows you to run Ethereum Dapps (Decentralized Apps) right in your browser without running a full Ethereum node.<\/p>\n<p><strong>Type<\/strong>: Non-custodial\/HD<br \/><strong>Private Key Storage<\/strong>: User\u2019s local browser storage<br \/><strong>Communication to Ethereum Ledger<\/strong>: Infura<br \/><strong>Private key encoding<\/strong>: Mnemonic<\/p>\n<p>DANGER<\/p>\n<p>Please Backup your\u00a0<strong>Secret Recovery Phrase<\/strong>. If your device breaks, is lost, stolen, or has data corruption, there is no other way to recover it. The Secret Recovery Phrase is the only way to recover your MetaMask accounts. Check more\u00a0<strong>Basic Safety and Security Tips for MetaMask<\/strong>.<\/p>\n<h2>Guide to set up Metamask for SECRYPT<\/h2>\n<ul>\n<li>Download &amp; Install MetaMask<\/li>\n<li>Configure SECRYPT on MetaMask<\/li>\n<li>Config Custom Tokens<\/li>\n<li>Create &amp; Import Accounts<\/li>\n<\/ul>\n<h3><b>1. Set up Web3<\/b><\/h3>\n<h4><b>Step 1<\/b><\/h4>\n<p>Install the following in your DApp:<\/p>\n<h4>npm install &#8211;save web3<\/h4>\n<p>\u00a0<\/p>\n<p>Create a new file, name it\u00a0web3.js\u00a0and insert the following code in it:<\/p>\n<p style=\"text-align: center;\">import Web3 from &#8216;web3&#8217;;<\/p>\n<p>const getWeb3 = () =&gt; new Promise((resolve) =&gt; {<br \/>\u00a0 window.addEventListener(&#8216;load&#8217;, () =&gt; {<br \/>\u00a0\u00a0\u00a0 let currentWeb3;<\/p>\n<p>\u00a0\u00a0\u00a0 if (window.ethereum) {<br \/>\u00a0\u00a0\u00a0\u00a0\u00a0 currentWeb3 = new Web3(window.ethereum);<br \/>\u00a0\u00a0\u00a0\u00a0\u00a0 try {<br \/>\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 <em>\/\/ Request account access if needed<\/em><br \/>\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 window.ethereum.enable();<br \/>\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 <em>\/\/ Acccounts now exposed<\/em><br \/>\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 resolve(currentWeb3);<br \/>\u00a0\u00a0\u00a0\u00a0\u00a0 } catch (error) {<br \/>\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 <em>\/\/ User denied account access&#8230;<\/em><br \/>\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 alert(&#8216;Please allow access for the app to work&#8217;);<br \/>\u00a0\u00a0\u00a0\u00a0\u00a0 }<br \/>\u00a0\u00a0\u00a0 } else if (window.web3) {<br \/>\u00a0\u00a0\u00a0\u00a0\u00a0 window.web3 = new Web3(web3.currentProvider);<br \/>\u00a0\u00a0\u00a0\u00a0\u00a0 <em>\/\/ Acccounts always exposed<\/em><br \/>\u00a0\u00a0\u00a0\u00a0\u00a0 resolve(currentWeb3);<br \/>\u00a0\u00a0\u00a0 } else {<br \/>\u00a0\u00a0\u00a0\u00a0\u00a0 console.log(&#8216;Non-Ethereum browser detected. You should consider trying MetaMask!&#8217;);<br \/>\u00a0\u00a0\u00a0 }<br \/>\u00a0 });<br \/>});<\/p>\n<p>export default getWeb3;<\/p>\n<p>The above file exports a function called\u00a0getWeb3()\u00a0&#8211; the purpose of which is to request Metamask account\u2019s access via detecting a global object (ethereum\u00a0or\u00a0web3) injected by Metamask.<\/p>\n<p>According to\u00a0Metamask\u2019s API documentation:<\/p>\n<p>MetaMask injects a global API into websites visited by its users at window.ethereum. This API allows websites to request users&#8217; Ethereum accounts, read data from blockchains the user is connected to, and suggest that the user sign messages and transactions. The presence of the provider object indicates an Ethereum user.<\/p>\n<p>In simpler terms, it basically means that having Metamask\u2019s extension\/add-on installed in your browser, you\u2019d have a global variable defined, called\u00a0ethereum\u00a0(web3\u00a0for older versions), and using this variable we instantiate our web3 object.<\/p>\n<h4><b>Step 2<\/b><\/h4>\n<p>Now, in your client code, import the above file:<\/p>\n<p style=\"text-align: center;\">\u00a0 import getWeb3 from &#8216;\/path\/to\/web3&#8217;;<\/p>\n<p>\u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0and call the function:<\/p>\n<p style=\"text-align: center;\">\u00a0 getWeb3()<br \/>\u00a0\u00a0\u00a0 .then((result) =&gt; {<br \/>\u00a0\u00a0\u00a0\u00a0\u00a0 this.web3 = result;<em>\/\/ we instantiate our contract next<\/em><br \/>\u00a0\u00a0\u00a0 });<\/p>\n<p><\/p>\n<h3><b>2. Set up account<\/b><\/h3>\n<p>Now to send transactions (specifically those that alter the state of the blockchain) we\u2019ll need an account to sign those transactions. We instantiate our contract instance from the web3 object we created above:<\/p>\n<p style=\"text-align: center;\">\u00a0 this.web3.eth.getAccounts()<br \/>\u00a0 .then((accounts) =&gt; {<br \/>\u00a0\u00a0\u00a0 this.account = accounts[0];<br \/>\u00a0 })<\/p>\n<p>The\u00a0getAccounts()\u00a0function returns an array of all the accounts on user\u2019s metamask, and\u00a0accounts[0]\u00a0is the one currently selected by the user.<\/p>\n<h3><b>3. Instantiate your contracts<\/b><\/h3>\n<p>Once we have our\u00a0web3\u00a0object in place, we\u2019ll next instantiate our contracts, assuming you have your contract ABI and address already in place:<\/p>\n<p style=\"text-align: center;\">const myContractInstance = new this.web3.eth.Contract(myContractAbi, myContractAddress)<\/p>\n<h3>4. Call functions<\/h3>\n<p>Now for any function you\u2019d want to call from your contract, we directly interact with our instantiated contract object (which is\u00a0myContractInstance\u00a0declared in Step 2).<\/p>\n<p><b>A QUICK REVIEW<\/b><\/p>\n<p>Functions that alter the state of the contract are called\u00a0send()\u00a0functions. Functions that do not alter the state of the contract are called\u00a0call()\u00a0functions.<\/p>\n<h4>Calling\u00a0call()\u00a0Functions<\/h4>\n<p style=\"text-align: center;\">\u00a0 this.myContractInstance.methods.myMethod(myParams)<br \/>\u00a0 .call()<br \/>\u00a0 .then (<br \/>\u00a0\u00a0\u00a0 <em>\/\/ do stuff with returned values<\/em><br \/>\u00a0 )<\/p>\n<h4>Calling\u00a0send()\u00a0Functions<\/h4>\n<p style=\"text-align: center;\">\u00a0 this.myContractInstance.methods.myMethod(myParams)<br \/>\u00a0 .send({<br \/>\u00a0\u00a0\u00a0 from: this.account,gasPrice: 0<br \/>\u00a0 })<br \/>\u00a0 .then (<br \/>\u00a0\u00a0\u00a0 (receipt) =&gt; {<br \/>\u00a0\u00a0\u00a0\u00a0\u00a0 <em>\/\/ returns a transaction receipt}<\/em><br \/>\u00a0\u00a0\u00a0 )\u00a0\u00a0<\/p>\n<p>\u00a0<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Overview of MetaMask MetaMask\u00a0is a crypto wallet that can be used in a web browser and on mobile devices to interact with the Ethereum blockchain. It allows you to run Ethereum Dapps (Decentralized Apps) right in your browser without running a full Ethereum node. Type: Non-custodial\/HDPrivate Key Storage: User\u2019s local browser storageCommunication to Ethereum Ledger: [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"page-builder","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-582","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/test.secrypt.tech\/index.php\/wp-json\/wp\/v2\/pages\/582","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/test.secrypt.tech\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/test.secrypt.tech\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/test.secrypt.tech\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/test.secrypt.tech\/index.php\/wp-json\/wp\/v2\/comments?post=582"}],"version-history":[{"count":13,"href":"https:\/\/test.secrypt.tech\/index.php\/wp-json\/wp\/v2\/pages\/582\/revisions"}],"predecessor-version":[{"id":1372,"href":"https:\/\/test.secrypt.tech\/index.php\/wp-json\/wp\/v2\/pages\/582\/revisions\/1372"}],"wp:attachment":[{"href":"https:\/\/test.secrypt.tech\/index.php\/wp-json\/wp\/v2\/media?parent=582"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}