反應原生堅持和加密用戶令牌 - 終極版 - 堅持 - 轉換 - 加密錯誤

Question

似乎有使用的加密選項的問題終極版 - 堅持反應母語：

https://github.com/maxdeviant/redux-persist-transform-encrypt/issues/15

能

任何人的幫助任何解決方案/解決方法使用REDX堅持加密和存儲登錄令牌在react-native？

當我嘗試使用了Redux堅持用了Redux-堅持變換，加密我得到 Redux-persist-transform-encrypt: expected outbound state to be a string error

import { createStore, compose, applyMiddleware } from 'redux'; 
import ReduxThunk from 'redux-thunk'; 
import { persistStore, autoRehydrate } from 'redux-persist'; 
import { AsyncStorage } from 'react-native'; 
import createEncryptor from 'redux-persist-transform-encrypt'; 
import reducers from './reducers'; 


const store = createStore(
    reducers, 
    {}, 
    compose(
    applyMiddleware(ReduxThunk), 
    autoRehydrate(), 
), 
); 

const encryptor = createEncryptor({ 
    secretKey: 'my-super-secret-key-999', 
}); 


persistStore(
    store, 
    { 
    storage: AsyncStorage, 
    whitelist: ['auth'], 
    transforms: [encryptor], 
    }, 
); 
export default store; 

我的身份驗證狀態是這樣的：

const INITIAL_STATE = { 
    user: null, 
    token: '' 
}; 

有什麼解決方案使用redux-persist-transform加密或轉換和其他包使用redux時加密令牌堅持？

Answer 1

我找到了一個解決方案使用customTransform，而不是終極版 - 堅持 - 轉換 - 加密：

import { createStore, compose, applyMiddleware } from 'redux'; 
import ReduxThunk from 'redux-thunk'; 
import { persistStore, createTransform, autoRehydrate } from 'redux-persist'; 
import { AsyncStorage } from 'react-native'; 
import CryptoJS from 'crypto-js'; 
import reducers from './reducers'; 


const store = createStore(
    reducers, 
    {}, 
    compose(
    applyMiddleware(ReduxThunk), 
    autoRehydrate(), 
), 
); 

const encrypt = createTransform(
    (inboundState, key) => { 
    if (!inboundState) return inboundState; 
    const cryptedText = CryptoJS.AES.encrypt(JSON.stringify(inboundState), 'secret key 123'); 

    return cryptedText.toString(); 
    }, 
    (outboundState, key) => { 
    if (!outboundState) return outboundState; 
    const bytes = CryptoJS.AES.decrypt(outboundState, 'secret key 123'); 
    const decrypted = bytes.toString(CryptoJS.enc.Utf8); 

    return JSON.parse(decrypted); 
    }, 
); 

persistStore(
    store, 
    { 
    storage: AsyncStorage, 
    whitelist: ['auth'], // <-- keys from state that should be persisted 
    transforms: [encrypt], 
    }, 
); 
export default store; 

當使用終極版 - 堅持初始狀態的再水合前觸發完成，所以我不得不太應用此：

https://github.com/rt2zz/redux-persist/blob/master/docs/recipes.md#delay-render-until-rehydration-complete