登陆加密功能

package-lock.json

@@ -3687,6 +3687,11 @@
         "randomfill": "^1.0.3"
       }
     },
+    "crypto-js": {
+      "version": "3.1.9-1",
+      "resolved": "https://registry.npmjs.org/crypto-js/-/crypto-js-3.1.9-1.tgz",
+      "integrity": "sha1-/aGedh/Ad+Af+/3G6f38WeiAbNg="
+    },
     "css-animation": {
       "version": "1.5.0",
       "resolved": "https://registry.npmjs.org/css-animation/-/css-animation-1.5.0.tgz",
@@ -11288,6 +11293,14 @@
       "resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz",
       "integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA=="
     },
+    "react-mobile-swiper": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/react-mobile-swiper/-/react-mobile-swiper-1.1.4.tgz",
+      "integrity": "sha512-I4CZIh5muXaKInhsS/CcGYLZt9AZIb4CSgvIVnDUDrfzJSsZBh6AMPf3hQmHQFcAjDNxReCmOcrXzvwAlRDrVA==",
+      "requires": {
+        "prop-types": "^15.7.2"
+      }
+    },
     "react-native-swipeout": {
       "version": "2.3.6",
       "resolved": "https://registry.npmjs.org/react-native-swipeout/-/react-native-swipeout-2.3.6.tgz",

package.json

@@ -15,6 +15,7 @@
     "babel-preset-react-app": "^7.0.2",
     "bfj": "6.1.1",
     "case-sensitive-paths-webpack-plugin": "2.2.0",
+    "crypto-js": "^3.1.9-1",
     "css-loader": "1.0.0",
     "dotenv": "6.0.0",
     "dotenv-expand": "4.2.0",

src/components/passport/encryption/index.js

+import aes from 'crypto-js/aes'
+import Crypto from 'crypto-js'
+
+const PASSPHRASE = '7BFF85920AA7D7FB6664E0EAEB45494E589CDE45589340DAEB2F837CFB7B843B066ECCA888D883BA6F0A08DFDC9BCAD5ACBFFFE03CF8A797025EA7FE54A07473A305BFFB7FDFEA1AED1070BB753C65EF6379711BE2BC1742CFC88C487BDDBEE4CEF34117C23DB8E9CBC6854A150756935302EDE68D224956994F5046DA623ECC'
+
+function encrypt(message) {
+    return aes.encrypt(message, PASSPHRASE).toString()
+}
+
+function decrypt(encrypted) {
+    return Crypto.enc.Utf8.stringify(aes.decrypt(encrypted, PASSPHRASE))
+}
+
+export { encrypt, decrypt }
\ No newline at end of file

src/components/passport/index.js

@@ -40,10 +40,6 @@ class Passport extends Component {
         }
     }
 
-    componentDidMount() {
-        document.getElementsByClassName('tabbar')[0].style.display = 'none'
-    }
-
     render() {
         let {match} = this.props
         return (

src/components/passport/wechatLogin/index.js

@@ -5,6 +5,8 @@ import LoginButton from '../common/LoginButton';
 import LoginWays from '../common/LoginWays'
 import Header from '../common/Header'
 import VeriCodeInput from '../common/veriCodeInput'
+import { encrypt, decrypt } from '../encryption'
+import Crypto from 'crypto-js'
 
 class WechatLogin extends Component {
     constructor(props) {
@@ -14,6 +16,12 @@ class WechatLogin extends Component {
         }
     }
 
+    componentDidMount() {
+        const encrypted = encrypt('hello world')
+        console.log(encrypted)
+        console.log(decrypt(encrypted))
+    }
+
     selectLoginWays = (i) => {
         console.log(i)
     }

src/router.js

@@ -17,6 +17,7 @@ import UseCoupon from './components/coupons/use-coupons'
 import OrderInfo from './components/order/orderinfo';
 import ShopCard from './components/shopCard/index';
 import BargainMiddlePage from './components/bargainMiddlePage';
+import Passport from './components/passport'
 
 
 const router = (props) => (
@@ -38,6 +39,7 @@ const router = (props) => (
             <Route path='/orderinfo' component={OrderInfo}></Route>
             <Route path='/shopcard' component={ShopCard}></Route>
             <Route path='/bargain-middle-page' component={BargainMiddlePage}></Route>
+            <Route path='/passport' component={Passport}></Route>
         </Switch>
         {/*<Menu/>*/}
     </Router>