利用IPFS构建短视频区块链应用开发经历（九）

本系列文章是针对 https://blog.csdn.net/weixin_43668031/article/details/83962959 内容的实现所编写的。开发经历包括思考过程、重构和推翻重来。

写到这里我们有了全局变量this.$store.state.videoShare是我们的合约实例，如果连接到了eth网络中，并解锁了账号全局变量this.$store.state.userAccount是我们的账号，https://blog.csdn.net/weixin_43668031/article/details/85256071 文中提到的用户相关的操作就可以做了

操作分类	方法	作用	备注	参数	返回
用户操作	setMyInfo	设置我的信息		setMyInfo(昵称,简介,头像)	无返回
用户操作	setMyNickname	设置我的昵称		setMyNickname(昵称)	无返回
用户操作	setMyProfile	设置我的简介		setMyProfile(简介)	无返回
用户操作	setMyAvatar	设置我的头像		setMyAvatar(头像)	无返回
用户操作	getUserInfo	获取用户信息	无需消耗	getUserInfo(用户地址)	nickname=昵称, profile=简介, avatar=头像, videoNums=用户发布的数量

本文仅用到setMyNickname，setMyProfile，getUserInfo

仅保存昵称：

      saveNickname(){
        //获取合约实例
        const videoShare = this.$store.state.videoShare;
        //setMyNickname的调用方式需要传入设置的值，还有send中传入用户自己的地址，价格是程序自己计算完成的，不需要输入。
        videoShare.methods.setMyNickname(this.userAccount.nickname)
                .send({ from: this.userAccount.address })
                .on("receipt", function(receipt) {
                  //返回成功上链的信息
                  alert("上链成功，区块高度："+receipt.blockNumber);
                  console.log(receipt);
                }).on("error", function(error) {
                  console.log(error);
                })
      },

代码暂时没有做一个漂亮的提示信息告诉用户区块链写入成功，等等过程中暂时没有做出现loading的样式，之后会对界面进行优化。

仅保存简介：

      saveProfile(){
        //获取合约实例
        const videoShare = this.$store.state.videoShare;
        //setMyProfile的调用方式需要传入设置的值，还有send中传入用户自己的地址，价格是程序自己计算完成的，不需要输入。
        videoShare.methods.setMyProfile(this.userAccount.profile)
                .send({ from: this.userAccount.address })
                .on("receipt", function(receipt) {
                  //返回成功上链的信息
                  alert("上链成功，区块高度："+receipt.blockNumber);
                  console.log(receipt);
                }).on("error", function(error) {
                  console.log(error);
                })
      }

页面载入时的初始化操作：

      init() {
        //获取登陆的账号地址和合约实例
        this.userAccount.address = this.$store.state.userAccount;
        const videoShare = this.$store.state.videoShare;
        //查询用户是否设置过自己的属性，如果设置过就显示出来
        videoShare.methods.getUserInfo(this.$store.state.userAccount).call().then((res)=>{
          if(res.avatar!=="")this.userAccount.avatar = res.avatar;
          if(res.nickname!=="")this.userAccount.nickname = res.nickname;
          if(res.profile!=="")this.userAccount.profile = res.profile;
        });
      },

再次刷新，获取最新数据正确。

这里已经做到了对eth区块链的改写，对区块链就行改写就要付出相应的手续费给矿工，他们才有动力给你挖矿。区块链改写？不存在的，这里指的是添加日志，改写旧值的意思，这对于区块链的宣传有一定的偷换概念。

已经完成了对eth数据库的调用，之后会把经历着重放在ipfs的调用、业务逻辑和前端美化工作的代码上来，毕竟前端足够人性化才能缩小人们的学习成本，去多使用内容。