手把手教你如何在 Oasis Second State 社区黑客马拉松获得 50 ROSE

关注
发布于: 2020 年 10 月 11 日
手把手教你如何在Oasis Second State 社区黑客马拉松获得 50 ROSE
Oasis Second State 社区黑客马拉松即将开始，在 Oasis network 上运行以太坊智能合约、发布DApp，就可以获得 ROSE Token 奖励！奖励最高可达 25000 ROSE。点击此处了解详情。
﻿
本文将手把手教你完成第一项挑战，就可以获得 Oasis 基金会奖励的50个 ROSE Token！
﻿
视频版教程请戳这里。
﻿
以下为教程正文，enjoy！
﻿
当今，大型高科技社交媒体平台都受到了审查制度和仇恨言论双重弊端的困扰。有没有一种方法可以使每个人都容易表达自己的想法，但又大大减少垃圾邮件和欺凌者？
﻿
区块链技术横空出世。像 Oasis 网络这样的公链具有抗审查性，同时还具备有内在的经济激励措施来惩罚不良行为。
﻿
在本教程中，我们将向你展示如何在 Oasis Ethereum ParaTime 区块链上发布你的观点和想法。尽管任何人都可以对你发布的消息发表评论，但他们必须向你支付你规定的费用才能评论。
﻿
完成本教程并在社交媒体上分享你发布的DApp，你将赢得 Oasis Foundation 的50个 ROSE Token！
﻿
感兴趣吗？让我们开始吧。
﻿
打开IDE你可以通过以下链接加载基于Web的 IDE 。无需下载任何软件！
﻿
http://oasiseth.org/dev/hack
﻿
现在你可以看到两个示例项目。第一个是简单的“ hello world”，向你展示以太坊智能合约和 Dapp 的基本知识。就本教程及活动而言，请选择名为 OasisTweet 的第二个示例应用程序。
﻿
图1：选择 OasisTweet 项目
从水龙头获取一些测试 OETH由于这是第一次启动此 IDE，BUIDL 将自动创建几个新的以太坊帐户地址供你使用。你需要在这些帐户中存入一些 OETH Token，以便你可以支付 gas费来部署和使用智能合约。单击 BUIDL IDE上的“Account”选项卡，然后复制所选的默认地址。
﻿
图2：自动生成的地址
﻿
接下来，跳转到下面的 OETH 开发者水龙头，粘贴你的地址，自动获取1 个 OETH Token。 OETH 大约需要10秒钟才能存入你的帐户。
﻿
http://faucet.oasiseth.org/ 面向开发者的Oasis ETH（OETH）水龙头
﻿
﻿
图3.为你的帐户地址获取一个测试OETH
﻿
Solidity 智能合约现在，让我们回到 IDE 中，并查看智能合约。如你所见，BUIDL IDE 具有用于文本消息和图像 URL 的数据字段。图像和消息将记录在区块链上，并显示在你稍后创建的 Dapp 网页上。
﻿
在这里有一个称为 comments的数组。它允许任何用户在你的 Dapp 网页上发表评论。但是，要注意价格字段和 addComment() 函数，这很重要。用户必须向你支付 price 规定的 OETH 数量，才能在你的页面上留下评论！
contract OasisTweet {
    address owner;
    string public message;
    string public image;
    uint256 public price;
    struct Comment {
        string name;
        string comment;
        bool isValue;
    }
    mapping (address => Comment) comments;
    
    ... ...
﻿
    function OasisTweet (string _message, string _image, uint256 _price) public {
        owner = msg.sender;
        message = _message;
        image = _image;
        price = _price;
    }
﻿
    function addComment (string _name, string _comment) public payable {
        require(msg.value >= price);
        if (!comments[msg.sender].isValue) {
            addrs.push(msg.sender);
        }
        comments[msg.sender] = Comment(_name, _comment, true);
    }
}
﻿
部署智能合约单击“Compile”按钮，BUIDL IDE 将智能合约编译为以太坊字节码。
﻿
图4. 部署智能合约
﻿
在将合约部署到区块链之前，请填写你要发的消息，图像URL，并规定每个评论所需的价格。这些将与合约一起存储在区块链上。
﻿
图5：填写所需信息
﻿
然后单击“Deploy on the chain”按钮将智能合约部署到 Oasis Ethereum ParaTime 区块链。
﻿
Oasis 区块链验证者确认合约大约需要10秒钟。你将在 log 面板中看到一条部署成功的消息。如果此时遇到错误，请查看你的默认帐户是否有 OETH 余额！
﻿
图6. 合约成功部署。 你的默认地址中必须包含 OETH。
Web 应用接下来，让我们构建一个能与刚部署的链上智能合约交互的 Web UI。切换到“ Dapp”选项卡。HTML 部分是网页。所有数据字段（例如图像 URL 、消息和 comments）都是 HTML 占位符，并将由 JavaScript 在 JS 中填写。
﻿
图7. 该 Web 应用具有 HTML 和 JS 部分
﻿
JavaScript 中的 reload() 函数从区块链合约中加载数据并将其填充到 HTML 页面上。
﻿
注意 instance.addComment() 函数。它从 Web 表单中获取用户评论，然后通过交易将其发送到合约。在交易中，用户除了向网络支付 gas 费外，还向合约支付 OETH 来添加自己的评论。
﻿
var contract = web3.ss.contract(abi);
instance = contract.at(cAddr);
﻿
instance.message(function (e, r) {
    $("#message").html(r);
});
instance.image(function (e, r) {
    $("#image").prop("src", r);
});
instance.price(function (e, r) {
    price = r;
    $("#pricealert").html("Requires " + price + " wei to comment");
});
﻿
instance.addComment ($("#name").val(), $("#comment").val(), {
    value: price,
    gas: 499000,
    gasPrice: 1
}
﻿
试用 Web 应用单击 IDE 上的“Run”按钮以运行 Web 应用程序。你将在右边看到该网页。你现在可以通过“Pay & Comment ”来与之互动。
﻿
图8. 在 IDE 里运行 该 Web 应用
发布应用最后，可以准备发布 Dapp 啦！你可以获取 HTML 和 JS 内容，并将它们放在任何静态网页 host 上。或者，你可以单击 IDE 上的“Publish”按钮。
﻿
图9. 发布该 Web 应用
﻿
发布成功的网页链接可以在任何地方分享。想要发表评论的用户需要连接到 Oasis Ethereum 的 MetaMask 钱包以支付 OETH，或通过发布成功的网页提供的的默认地址支付 OETH。  
﻿
﻿
快来发表你的 Dapp，领取 50 ROSE 吧！
﻿