从 React 组件卸载时卸载纯条带答案

【问题标题】：Unload stripe pure from when react component unmounts从 React 组件卸载时卸载纯条带
【发布时间】：2021-04-26 11:56:27
【问题描述】：

所以，我想摆脱从我的网站发送数据的条带化。

每次点击都是什么废话

curl 'https://m.stripe.com/6' \
  -H 'authority: m.stripe.com' \
  -H 'pragma: no-cache' \
  -H 'cache-control: no-cache' \
  -H 'user-agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 11_1_0) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/87.0.4280.141 Safari/537.36' \
  -H 'dnt: 1' \
  -H 'content-type: text/plain;charset=UTF-8' \
  -H 'accept: */*' \
  -H 'origin: https://m.stripe.network' \
  -H 'sec-fetch-site: cross-site' \
  -H 'sec-fetch-mode: cors' \
  -H 'sec-fetch-dest: empty' \
  -H 'referer: https://m.stripe.network/' \
  -H 'accept-language: en-US,en;q=0.9' \
  -H 'cookie: m=db491b6f-636e-4801-a446-c79c62db7d25cd4297; private_machine_identifier=r3F5QQbHA31m%2FqdyaRYQx54%2B%2BhT9pZTlEAm0bKEx832xHQNO8cKhXCLY%2BpBpQHxr6CM%3D; session=sess_IlGtyX7eySNiON53kjkXvE9zPmVWYvWh' \
  --data-binary 'JTdCJTIydjIlMjIlM0ExJTJDJTIyaWQlMjIlM0ElMjIzZmJmYzc0MzMwYTY1NTEwM2E3ZjY1NzE2YTA5OTA5NCUyMiUyQyUyMnQlMjIlM0E2NC4xMjUlMkMlMjJ0YWclMjIlM0ElMjI0LjUuMzMlMjIlMkMlMjJzcmMlMjIlM0ElMjJqcyUyMiUyQyUyMmElMjIlM0FudWxsJTJDJTIyYiUyMiUzQSU3QiUyMmElMjIlM0ElMjIlMjIlMkMlMjJiJTIyJTNBJTIyaHR0cHMlM0ElMkYlMkZkWjFMRHZvVExpV0NLclJWZ0l3TFFTdThoX25OSFpZSWVQcEFTZVRHUzB3LjB2RUtlM0c1cFNqUl9sbk5nYnVVMmpVQWNSLVlqSmxzTEE5ZUFkRDRNMDAuZzJ1OS1ocVp2R0lxWUpjUGxQZndKQWYtdjNSZ3lLX3gxTnBwekFsQTEyTSUyRmVJVjZEZ3V6WFAzWlhUZ0J3N2F4d3lZWU9GaXpEZGNkUVVWVkRFSjhhX2slMkZFY3dmdzcxOTJSWVVsT2hXdGZXeG1rT25vNnZMVVZLSWRDUVFrNlNJR3RBJTIyJTJDJTIyYyUyMiUzQSUyMlRqNzI0TVpFUS1abDJ0a2EwWG9ZUVcwM3ZjRlVzVzhJSUxHVm5Jc2VQTm8lMjIlMkMlMjJkJTIyJTNBJTIyODhmYWE5MTgtNmY2OS00MDQ5LWFhNmYtOTg3OTk0MDExYmU3NTQ0MTAyJTIyJTJDJTIyZSUyMiUzQSUyMjg1NjUyOWJiLTA1MTYtNDkyNy05NGRlLTQ4YjYzOTgwMmFjZTFhYTM3MyUyMiUyQyUyMmYlMjIlM0FmYWxzZSUyQyUyMmclMjIlM0F0cnVlJTJDJTIyaCUyMiUzQXRydWUlMkMlMjJpJTIyJTNBJTVCJTIybG9jYXRpb24lMjIlNUQlMkMlMjJqJTIyJTNBJTVCJTVEJTJDJTIybiUyMiUzQTQ2Ni40ODk5OTk5OTE2MDg4JTJDJTIydSUyMiUzQSUyMnRlc3RpbmctYXBwLnNwb3RuYW5hLmNvbSUyMiU3RCUyQyUyMmglMjIlM0ElMjJjMGI4YjE3MzQyNGQyNDU3ODczOSUyMiU3RA==' \
  --compressed

所以我从https://mtlynch.io/stripe-recording-its-customers/那里了解到了纯条纹。

一旦安装了支付组件，我就会进行条带安装。

loadStripe.setLoadParameters({advancedFraudSignals: false})
loadStripe(process.env.REACT_APP_STRIPE_PUBLISHABLE_KEY??'').then(setStripe);

而且我不知道强制删除脚本的方法。所以如果它一旦加载，它就会开始做有趣的事情。

如果再次呈现支付组件，我会得到

ERROR: setLoadParameters cannot be called after loadStripe() is called

所以，我想的解决方案很简单，如果我可以在我的支付组件被卸载时卸载条带脚本就可以了。有什么建议吗？

或任何可以在这里完成的更好的事情。

【问题讨论】：

标签： javascript reactjs stripe-payments

【解决方案1】：

您需要在应用的根组件中导入不带 side effects and advanced fraud detection 的 Stripe。然后，您将按照此处的示例将 Stripe 的引用作为道具传递：https://github.com/stripe/react-stripe-js#minimal-example。这样，您的代码就不会在每次卸载/重新安装组件时尝试重新加载 Stripe。

此外，您可能会对来自同一作者的关于缓解措施和更多信息 Stripe 实施的更新博客文章感兴趣：https://mtlynch.io/stripe-update/

【讨论】：