错误无法从 web3-providers.umd.js 解析模块“http”

Question

我安装了 web3 以将 Solidity 链接到 React-native。如下代码，我是从 Remix 部署的，输入地址和 ABI。

import Web3 from "web3";



const web3 = new Web3(
  new Web3.providers.HttpProvider("https://127.0.0.1:8545")
);

const address = "0x6cc33e32853a7fb0ac9ac2fb0d54cb56e4fb0f30";

const abi = [
  {
    constant: false,
    inputs: [
      {
        name: "_MASTER",
        type: "address"
      },
      {
        name: "_sitter",
        type: "address"
      },
      {
        name: "_sitterprice",
        type: "uint256"
      }
    ],
    name: "CompleteSharePet",
    outputs: [],
    payable: true,
    stateMutability: "payable",
    type: "function"
  },
  {
    constant: false,
    inputs: [
      {
        name: "_OWNER",
        type: "address"
      },
      {
        name: "_ownersharetext",
        type: "string"
      },
      {
        name: "_ownerprice",
        type: "uint256"
      }
    ],
    name: "OwnerShareText",
    outputs: [
      {
        name: "",
        type: "string"
      }
    ],
    payable: false,
    stateMutability: "nonpayable",
    type: "function"
  },
  {
    constant: false,
    inputs: [
      {
        name: "_ownerseller",
        type: "address"
      },
      {
        name: "_petsitter",
        type: "address"
      },
      {
        name: "_MASTER",
        type: "address"
      },
      {
        name: "_ownerprice",
        type: "uint256"
      }
    ],
    name: "PetChange",
    outputs: [],
    payable: true,
    stateMutability: "payable",
    type: "function"
  },
  {
    constant: false,
    inputs: [
      {
        name: "_PETSITTER",
        type: "address"
      },
      {
        name: "_master",
        type: "address"
      },
      {
        name: "_ownerprice",
        type: "uint256"
      }
    ],
    name: "PetChangeTransaction",
    outputs: [],
    payable: true,
    stateMutability: "payable",
    type: "function"
  },
  {
    constant: false,
    inputs: [
      {
        name: "_petsittertext",
        type: "string"
      },
      {
        name: "_sitterprice",
        type: "uint256"
      }
    ],
    name: "PetSitterShareText",
    outputs: [
      {
        name: "",
        type: "string"
      }
    ],
    payable: false,
    stateMutability: "nonpayable",
    type: "function"
  },
  {
    constant: false,
    inputs: [
      {
        name: "_sitter",
        type: "address"
      }
    ],
    name: "testsitter",
    outputs: [],
    payable: true,
    stateMutability: "payable",
    type: "function"
  },
  {
    constant: false,
    inputs: [
      {
        name: "_master",
        type: "address"
      },
      {
        name: "_OWNER",
        type: "address"
      },
      {
        name: "_sitterprice",
        type: "uint256"
      }
    ],
    name: "TransactionSharePet",
    outputs: [],
    payable: true,
    stateMutability: "payable",
    type: "function"
  },
  {
    constant: false,
    inputs: [
      {
        name: "hash",
        type: "string"
      },
      {
        name: "ipfs",
        type: "string"
      }
    ],
    name: "uploadImage",
    outputs: [],
    payable: false,
    stateMutability: "nonpayable",
    type: "function"
  },
  {
    constant: true,
    inputs: [],
    name: "AllOwnerCount",
    outputs: [
      {
        name: "",
        type: "uint256"
      }
    ],
    payable: false,
    stateMutability: "view",
    type: "function"
  },
  {
    constant: true,
    inputs: [],
    name: "AllPetSitter",
    outputs: [
      {
        name: "",
        type: "uint256"
      }
    ],
    payable: false,
    stateMutability: "view",
    type: "function"
  },
  {
    constant: true,
    inputs: [],
    name: "getOwnerAddresses",
    outputs: [
      {
        name: "",
        type: "address[]"
      }
    ],
    payable: false,
    stateMutability: "view",
    type: "function"
  },
  {
    constant: true,
    inputs: [
      {
        name: "_owner",
        type: "address"
      }
    ],
    name: "getOwnerInfo",
    outputs: [
      {
        name: "",
        type: "string"
      },
      {
        name: "",
        type: "string"
      },
      {
        name: "",
        type: "string"
      }
    ],
    payable: false,
    stateMutability: "view",
    type: "function"
  },
  {
    constant: true,
    inputs: [],
    name: "getPetSitterAddresses",
    outputs: [
      {
        name: "",
        type: "address[]"
      }
    ],
    payable: false,
    stateMutability: "view",
    type: "function"
  },
  {
    constant: true,
    inputs: [
      {
        name: "_petsitter",
        type: "address"
      }
    ],
    name: "getPetSitterInfo",
    outputs: [
      {
        name: "",
        type: "string"
      },
      {
        name: "",
        type: "string"
      },
      {
        name: "",
        type: "string"
      }
    ],
    payable: false,
    stateMutability: "view",
    type: "function"
  },
  {
    constant: true,
    inputs: [
      {
        name: "",
        type: "uint256"
      }
    ],
    name: "OwnerAddresses",
    outputs: [
      {
        name: "",
        type: "address"
      }
    ],
    payable: false,
    stateMutability: "view",
    type: "function"
  },
  {
    constant: true,
    inputs: [
      {
        name: "",
        type: "uint256"
      }
    ],
    name: "PetSitterAddresses",
    outputs: [
      {
        name: "",
        type: "address"
      }
    ],
    payable: false,
    stateMutability: "view",
    type: "function"
  },
  {
    constant: true,
    inputs: [
      {
        name: "_OWNER",
        type: "address"
      }
    ],
    name: "test",
    outputs: [
      {
        name: "",
        type: "uint256"
      }
    ],
    payable: false,
    stateMutability: "view",
    type: "function"
  },
  {
    constant: true,
    inputs: [
      {
        name: "_MASTER",
        type: "address"
      }
    ],
    name: "test2",
    outputs: [
      {
        name: "",
        type: "uint256"
      }
    ],
    payable: false,
    stateMutability: "view",
    type: "function"
  }
];
export class WalletSetting extends Component {
  test() {
    web3.eth.getAccounts().then(console.log);
  }
  render() {
    return this.test;
  }
}

export default (myContract = new web3.eth.Contract(abi, address));

设置没有错误，但是导入使用mycontact时出错

import WalletSetting from "../web3";
.
.
.
  </TouchableOpacity>
        <WalletSetting />
      </LinearGradient>

Error Image

我删除了所有的node_modules和所有的缓存，就像图片中的方式一样。然而，同样的错误发生了，虽然我们用谷歌搜索努力搜索，但我们还没有解决它。

我正在等待一个好的答案。请帮我解决。

---

我将web3版本下载为“^1.0.0-beta.34”以解决现有错误，但又出现了一个错误。

错误是

无法从 /Users/lucky/pettest/node_modules/web3-eth-accounts/src/index.js 解析模块 crypto：模块 crypto 不存在于 Haste 模块映射中

于是我去谷歌参考https://gist.github.com/dougbacelar/29e60920d8fa1982535247563eb63766 并安装“node-libs-browser”：“^2.2.0”，“babelpresetes2015”：“^6.24.1”， 并创建一个名为 rn-cli.config.js、global.js 的文件并将 globaljs 文件导入您的 web3.js 文件，但错误是相同的。

我该如何解决这个问题？

https://gist.github.com/dougbacelar/29e60920d8fa1982535247563eb63766

此链接解决方案无法解决我的问题。

Answer 1

web3 可以在浏览器环境中工作。原生android环境与浏览器不同，例如它没有web3使用的crypto类。使用 web3 和 react native 需要一些额外的配置。您可以按照以下指南操作：https://gist.github.com/dougbacelar/29e60920d8fa1982535247563eb63766。

您还可以在此处找到样板：https://github.com/dougbacelar/react-native-web3

Answer 2

我有一个解决方案来解决你的部分问题，关于加密。安装 react-native-crypto 并将其保存为依赖项，然后将 babel-plugin-module-resolver 作为开发依赖项，并在项目根目录中放置一个 .babelrc 文件，其中包含以下内容：

{
  "plugins": [
    ["module-resolver", {
      "root": ["."],
      "alias": {
        "crypto": "react-native-crypto"
      }
    }]
  ]
}

这会将您安装的软件包中的任何require('crypto') 替换为require('react-native-crypto')，它对我有用。然而，在我的情况下，我缺少加密的同一个包也缺少http，所以我来到这个线程希望也能找到一个 polyfill。我在 RN v0.60.3、npm v6.9.0 和 node v10.16.0 上供任何感兴趣的人使用。此外，我需要这个“垫片”的包是request 包，它似乎是开玩笑的子子子子依赖项。 (npm list request)。

我希望这对某人有帮助！

我在这里找到了这个解决方案：https://stackoverflow.com/a/46605706/12375465 在这里：https://medium.com/studioarmix/the-joy-of-joi-hacking-node-deps-1337fd5e586f