MetaMask Mobile +Chrome DevTools 调试Web3应用教程

这篇具有很好参考价值的文章主要介绍了MetaMask Mobile +Chrome DevTools 调试Web3应用教程。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

注:本教程来源网络,有兴趣的可以直接到这里查看。

写好了WEB3应用,在本地调试用得好好的,但是用钱包软件访问就报莫名的错,但是又不知道是什么原因,排查的过程非常浪费时间 。
因此在本地同一局域网进行调试就非常有必要,本教程有下面几个重点,包含MetaMask Mobile Android  调试Web3的DAPP 干货。

1.重点内容和亮点

1.如何设置访问 HTTPS DApps 不验证证书,方便开发者在本地网络中调试 DApps。

2.设置WebView 开启 DEBUG 使用 "Chrome 开发者工具" 源代码调试 DApps。

下载最新应用程序版本以进行安装。由于文件稍大,请使用下载管理器(如迅雷或 BitTorrent)协助下载。亲测无后门,如果不放心请使用不用的测试机安装,注意要科学上网,下载链接如下: Releases · bitkanda/MetaMaskDebug · GitHub

如果下载不了,可以使用网盘
链接:https://pan.baidu.com/s/1pOLlICcbYERdKzXEhNJ5bQ?pwd=1234 
提取码:1234
2.手机安装DEBUG版本的metamask-mobile

使用上面链接下载

MetaMask Mobile +Chrome DevTools 调试Web3应用教程,nodejs,node.js,vue.js,solidity,web3

3.手机配置

打开开发人员选项,各品牌手机打开不一样,自行网上查阅。

MetaMask Mobile +Chrome DevTools 调试Web3应用教程,nodejs,node.js,vue.js,solidity,web3

通过 USB 将手机连接到计算机,注意手机提示选择传输文件允许访问手机数据和打开了开发者模式,在提示框允许调试。

MetaMask Mobile +Chrome DevTools 调试Web3应用教程,nodejs,node.js,vue.js,solidity,web3

 MetaMask Mobile +Chrome DevTools 调试Web3应用教程,nodejs,node.js,vue.js,solidity,web3

4.在Chrome 调试Web3 智能合约应用

请打开 Chrome 浏览器,输入“chrome://inspect/#devices”以访问调试入口和可调试的 DAPP。

如下图:

MetaMask Mobile +Chrome DevTools 调试Web3应用教程,nodejs,node.js,vue.js,solidity,web3

5.调试工具控制台,输入DAPP网址,可参看日志输出

网站打开是否有错,和日志 输出一目了然。

注意:这里的https://localhost:8080 可以 替换为你测试的vue项目中的局域网地址,如你的vue 项目绑定的地址是https://192.168.1.200:8080

MetaMask Mobile +Chrome DevTools 调试Web3应用教程,nodejs,node.js,vue.js,solidity,web3

6.直接调试,单步执行,在监视查看web3的各个变量 值MetaMask Mobile +Chrome DevTools 调试Web3应用教程,nodejs,node.js,vue.js,solidity,web3

 7.查看网络访问的接口和资源文件情况MetaMask Mobile +Chrome DevTools 调试Web3应用教程,nodejs,node.js,vue.js,solidity,web3文章来源地址https://www.toymoban.com/news/detail-663029.html

到了这里,关于MetaMask Mobile +Chrome DevTools 调试Web3应用教程的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • chrome插件开发实例07- Vue调试插件vue-devtools

    目录 一、为什么使用vue-devtools插件 二、如何安装 三、使用源码方式,安装Vue-devtools插件

    2024年02月13日
    浏览(49)
  • Web3简述MetaMask并演示谷歌安装MetaMask扩展程序方式

    我们会基本使用显然不够啊 我们要去了解mustache的原理 乃至自己去写一个mustache 首先 mustache 不是不能用简单的正则表达式来实现 但是 这里为了让大家理解 为什么不能 我们还是用简单正则写一下 我们创建一个 html文件 然后 编写代码如下 这里 我们定义了一个模板字符串 t

    2024年02月09日
    浏览(65)
  • 前端vue调试工具:chrome浏览器vue-devtools安装方式详述

    vue-devtools官方文档,也可按照官方文档操作 下面将介绍chrome集成vue-devtools的两种方式 通过扩展-扩展程序-访问chrome应用商店输入vue-devtools搜索插件即可 下载源码选择对应的版本tag官方源码 我们这里选择最新版本v6.5.1 下载压缩包,或clone都可以*( 克隆命令: 安装依赖以及打

    2024年03月15日
    浏览(67)
  • 使用 React、Web3.js 和 Metamask 构建 Web3 dApp 身份验证

    我相信您和我一样对 Web3 充满热情。本文介绍了一种新的区块链开发登录方法:使用 MetaMask 扩展的一键式加密安全登录流程,所有数据都存储在我们自己的后端。它还可以保护我们的数据和加密货币的安全。 在这里,我们将构建一个允许用户使用 MetaMask 登录的身份验证解决

    2024年02月04日
    浏览(63)
  • MetaMask与Web3中智能合约调用(2)

    智能合约交易区别于点对点交易,智能合约交易只需付费给矿工费用,也就是gas fee,是支付给矿工的手续费,当我们在以太坊区块链上进行转账时,矿工要把我们的交易打包并放上区块链,才能使交易完成,在这过程中会消耗区块链的运算资源,所以要支付费用 这个过程为

    2024年01月16日
    浏览(48)
  • 用 RemoteDebug iOS Webkit 在 Chrome DevTools 中调试iOS/iPadOS设备的前端页面

      相信很多小伙伴在开发移动端网页时,都会遇到兼容性问题的修改,尤其是当项目运行在真机上时,一些奇奇怪怪的bug接踵而至,很是头疼。在Android设备上,我们可以轻松的在Chrome DevTools上进行调试,但面对iOS设备,在我们没有Mac电脑的情况下,调试iOS的页面就是困难重

    2024年02月03日
    浏览(41)
  • 使用web3.js连接Metamask钱包并完成合约交互

    Web3.js是一个用于与以太坊网络进行交互的JavaScript库。Metamask是一个以太坊钱包插件,可以在浏览器中创建和管理以太坊账户。本文将介绍如何使用web3.js库连接Metamask钱包,并完成与智能合约的交互。 Web3.js是一个用于与以太坊网络进行交互的JavaScript库。它提供了一些方法和功

    2024年03月16日
    浏览(52)
  • Web3在HTML中获取 MetaMask 启用的用户列表

    当然 我们还是要先启动ganache环境 然后 通过MetaMask 导入一些用户 然后 我们需要在页面中引入 web3.min.js 如果您还没有这个文件 可以查看我的文章web3.js获取导入 然后我访问官网 https://learnblockchain.cn/docs/web3.js/web3-eth.html#getchainid 打开后 先来到 web3.eth 下面 下面有一个 getAccount

    2024年02月11日
    浏览(55)
  • Web3 将 MetaMask添加入谷歌浏览器 扩展程序中

    Web3到现在理论这段是说的有点太多了 那么 我们先来看个东西 叫 MetaMask 这个在我们项目开发过程中需要使用 MetaMask是一个开源的以太坊的一个钱包 那么 钱包肯定就是用来管理数据资产的 MetaMask 是以一个浏览器插件形式存在的 它可以直接连接到以太坊的网络中来管理我们以

    2024年02月11日
    浏览(44)
  • Web3通过 MetaMask简单演示对ganache虚拟环境账号进行管理操作

    上文 Web3通过ganache运行起一个本地虚拟区块链 我们通过ganache在本地运行起了一个虚拟的区块链环境 那么 接下来 我们就要用 MetaMask 来管理这个东西了 如果您还没有安装 可以访问文章Web3 将 MetaMask添加入谷歌浏览器 扩展程序中和Web3开发准备工作 手把手带你创建自己的 Meta

    2024年02月10日
    浏览(63)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包