Vue+web3.js+solidity+truffle开发以太坊区块链合约部署全过程!(注意:这里没有使用truffle-contract库调用智能合约)

运行代码的时候有一个注意事项:

就是在调用deploy()方法部署合约的时候,会弹出Metamask付款,可能出现2个问题:

第一:你的gas不够,可以参考send方法的gas设置(我是设置默认,付款的时候,修改大点)http://cw.hubwiz.com/card/c/web3.js-1.0/1/4/6/ 

第二个问题:错误提示:Error: the tx doesn't have the correct nonce. account has nonce of: 0 tx has nonce of: 5"}"

意思就是你的发送账号操作太频繁了,你可以把此账号移除,换一个新账号付款即可!可以参考这篇文章:https://yq.aliyun.com/articles/617053  

案例输出结果为:

Vue+web3.js+solidity+truffle开发以太坊区块链合约部署全过程!(注意:这里没有使用truffle-contract库调用智能合约)_第1张图片


 * 说明:Vue+truffle+web3.js(1.0版本)开发的以太坊区块链案例!
 * 注意:本案例中没有使用truffle-contract库调用智能合约!
 * 关于使用truffle-contract库与solidity智能合约交互的案例后续分享新版本!


import Web3 from 'web3';
// 导入FirstContract.sol智能合约的ABI编码数据!
import first_contract_json from '@/truffle/build/contracts/FirstContract.json';


class FirstContractWeb3 {
    constructor () {
        this.init_web3_1_0_version();
        this.initContract();
        // this.initContract_deploy();
    }

    
// web3对象初始化(仅兼容web3.js 1.0版本)
    init_web3_1_0_version() {
        // 如果浏览器安装了Metamask钱包(如:谷歌、火狐),那么Web3.givenProvider等于Metamask
        // 如果浏览器没有安装或不支持Metamask,那么Web3.givenProvider等于null
        console.log("判断浏览器是否启用Metamask插件的对象Web3.givenProvider结果为:",Web3.givenProvider);
        this.web3 = new Web3(Web3.givenProvider || new Web3.providers.HttpProvider('http://127.0.0.1:8545'));

    }

    /**
     * 1、初始化web3.eth.Contract合约
     * 2、直接调用truffle手动部署成功的合约实例(合约地址)
     * 注意:from发送账户务必注意两点:1、必须存在于区块链上; 2、浏览器访问Metamask的账户必须是发送地址账户!
     */
    initContract () {
        // 基于原生的web3.eth.Contract对象来创建合约(调用合约的方法)
        let fist_contract = new this.web3.eth.Contract( first_contract_json.abi,
            '0xC5DF1c7cbd988293313e63826009c76dA3D362d1' );

        // 调用合约的只读方法,并在EVM中直接执行方法,不需要发送任何交易。因此不会改变合约的状态。
        fist_contract.methods.getInfo().call().then( ( result ) => {
            console.log( 'get已经执行了' );
            console.log( result );
        } );
        // 向合约发送交易来执行指定方法,将改变合约的状态(必须输入发送交易的账户地址,需要消耗gas)
        fist_contract.methods.setInfo( 'kirin2019', 18 ).send( { from: '0x88D9C6F37E10A4B8801a06979ad6f60D91bA0a52' } ).then( ( result ) => {
            console.log( 'set已经执行了' );
            console.log( result );
        } );
    }

    /**
     * 1、初始化web3.eth.Contract合约
     * 2、调用合约的deploy()方法将其自动部署到区块链上!
     * 注意:from发送账户务必注意两点:1、必须存在于区块链上; 2、浏览器访问Metamask的账户必须是发送地址账户!
     */
    initContract_deploy () {
        // 基于原生的web3.eth.Contract对象来创建合约(调用合约的方法)
        let fist_contract = new this.web3.eth.Contract( first_contract_json.abi );

        // 这里是程序部署合约,一旦合约部署成功,其返回的Promise对象,将在成功部署后解析为新的合约实例。
        fist_contract.deploy( {
            data: first_contract_json.bytecode,
        } ).send( {
            from: '0x88D9C6F37E10A4B8801a06979ad6f60D91bA0a52',
        } ).then( ( instance ) => {
            // 返回一个已经部署成功的合约实例!
            console.log( 'instance', instance );
            instance.methods.getInfo().call().then( ( result ) => {
                console.log( 'get已经执行了' );
                console.log( result );
            } ).catch( ( error ) => {
                throw error;
            } );
            // 调用合约实例set方法
            instance.methods.setInfo( 'kirin2019', 18 ).send( { from: '0x88D9C6F37E10A4B8801a06979ad6f60D91bA0a52' } ).then( ( result ) => {
                console.log( 'set已经执行了' );
                console.log( result );
            } ).catch( ( error ) => {
                throw error;
            } );
        });
    }
}

// 测试执行!
let first_contract = new FirstContractWeb3();


 

你可能感兴趣的:(以太坊solidity,Dapper开发)