は、ネイティブリアクト持続し、暗号化ユーザートークン - Reduxの-存続・変換・暗号化エラー

Question

反応するネイティブで-持続再来の暗号化オプションを使用して問題があるようだ。

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

誰でも助けることができますredux 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 persistenceを使用しているときにトークンを暗号化するための変換およびその他のパッケージ

Answer 1

私の代わりにReduxの-存続・変換・暗号化のcustomTransformを使用して解決策を見つけた：再水和が終了する前にReduxの、持続初期状態がトリガされた使用している場合

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