lirui123321123的博客

你可以从 Node.js 官网 下载并安装 Node.js，npm 会随 Node.js 一起安装。你可以使用 npm 全局安装 Create React App，但这不是必需的，因为 CRA 提供了一个不需要全局安装的命令来创建新项目。在 src 目录下，你会找到 App.js 文件，这是你的主要 React 组件。这将启动一个开发服务器，并在浏览器中打开一个新的标签页来显示你的 React 应用。这里，my-react-app 是你的项目名称，你可以根据需要更改它。3. 创建新的 React 项目。

配置 MetaMask 连接到 Ganache 网络：在 MetaMask 扩展中，添加一个新的网络，使用 Ganache 提供的 RPC URL（通常在 Ganache 界面的底部可以找到），并设置网络名称（如“Ganache”）以及其他相关信息，如链 ID 和货币符号35。重启和数据持久性：注意，Ganache 的交易数据是在内存中操作的，并没有持久化到本地硬盘中。导入 Ganache 账户到 MetaMask：在 Ganache 中选择一个账户，点击账户旁边的钥匙图标，复制私钥。

在这个例子中，我们首先检查用户是否安装了 MetaMask，然后请求他们连接他们的账户。一旦连接，我们使用用户的账户地址获取余额，并将其显示在 React 组件中。// 打印用户账户地址。const contractAddress = '你的智能合约地址';在用户浏览器中使用 MetaMask 扩展时，需要请求用户允许你的网页访问他们的账户。// 智能合约 ABI。在你的 React 项目中，首先需要安装 Web3.js。一旦你获得了用户的账户地址，就可以连接到智能合约。// React 组件。

admin和user的权限分离：再第一个页面中，选择admin,然后右边admin page permission下面就是管理员所有的权限页面的名字，你可以进行选择，控制管理员可以有多少个权限页面，只需要点击权限页面文字前面的框即可，点击user也是一样。再该页面中，最左边user roles 就为当前已有的角色名称，假如你自己先重新创建一个角色，点击user roles左边的加号即可，然后出现以下页面，再该页面中输入你要创建的角色名称即可，最后点击确定按钮即可。

完成上述步骤以后，再出面的页面中填写好有关信息（项目名字：project name，项目位置:project location，数据库的名字:database，端口号:prot，用户名:user，密码:password）,完成后点击创建项目。然后点击authentication按钮，再出现的页面中填写登录的有关信息：选择好自己登录设置的表名字，然后选择好自己登录设置好的字段，最后选择以什么字段进行登录，然后点击okay按钮，最后点击publish按钮即可。