Question

我有一个应用程序，该应用程序每次用户登录时都会加载“收藏夹”。使用localforage从IndexedDB加载数据。当应用重新启动时（窗口刷新后），它可以完美运行。当我注销并登录（root saga任务正在运行）时，加载“收藏夹”数据的调用将引发错误：

TypeError：无法读取null的属性“ ready”

在步骤：

export function* handleRecoverFavorites() {
  try {
    const resp = yield call(localforage.getItem, 'favorites')

传奇代码摘录：

export function* handleRecoverFavorites() {
  try {
    const resp = yield call(localforage.getItem, 'favorites')
    if(resp) {
      yield put(recoverFavorites(resp))
      yield all(resp.map(symbol => put(getTickPricesSubscribe(symbol))));
          }
  } catch(err) {
    let response={"errorDescr":"Error whilst recovering favorites: "+err}
    yield put({ type: types.RESPONSE_ERR, response })
    console.log(response.errorDescr)
  }  
}


function* runAtStartupSubscirptions(socket, streamSessionId) {
  yield fork(send, {"command": "getBalance", "streamSessionId": streamSessionId }, socket );
  yield fork(handleRecoverFavorites)
  yield fork(handleRecoverCharts)
  while(true) {
    yield call(delay, STREAMING_PING_TIME)
    yield call(send, {"command": "ping", "streamSessionId": streamSessionId }, socket );
  } 
}

function* handleRequests(socket) {
  let streamSessionId = yield select(state => state.get("auth").get("streamSessionId"))

  while(true) {
    yield take(types.STREAMING_SOCKET_STATUS)
    if(socket.readyState === 1)
      yield fork(runAtStartupSubscirptions, socket, streamSessionId)
  }
}

export function* handleStreamingConnection() {
  let server = yield select(state => state.get("auth").get("server"))
  const socket = yield call(createWebSocketConnection, server+"Stream" )
  const socketChannel = yield call(createSocketChannel, socket, null)
  const task = yield fork(handleRequests, socket)

  let channelMsg;
  do {
    channelMsg = yield take(socketChannel)
    if(channelMsg.socketResponse) {
      const response = channelMsg.socketResponse;
      switch (response.command) {
        case "candle":
          yield put({ type: types.GET_CANDLES_STREAMING, response })
          break;

(...)

        default:
          console.log("unrequested data: "+response)
      }
    }
    if(channelMsg.socketStatus) {
      console.log(channelMsg)
      yield put({ type: types.STREAMING_SOCKET_STATUS, channelMsg })
    }  
  } while (channelMsg.socketStatus!=="Disconnected")
  yield cancel(task)
}

export default function* rootSaga() {
  while(true) {
    // Wait for log-in
    yield take(types.LOGIN_SUCCESS);
    const handleStreamingtask = yield fork(handleStreamingConnection)
    yield take([types.LOGOUT_REQUEST, types.RECONNECTING ])
    yield cancel(handleStreamingtask)
    const channelMsg={"socketStatus" : "Disconnected"}
    yield put({ type: types.STREAMING_SOCKET_STATUS, channelMsg })
  }
}

如有任何建议，我将不胜感激。

我添加了console.log行以查看结果，而无须佐贺电话：

export function* handleRecoverFavorites() {
  try {
    console.log(localforage.getItem('favorites'))
    const resp = yield call(localforage.getItem, 'favorites')

它每次都会以正确的值返回Promise：

Promise {<pending>}
__proto__:Promise
[[PromiseStatus]]:"resolved"
[[PromiseValue]]:Array(1)
0:"CHFPLN"
length:1

Answer 1

这是我解决的方法，而不是直接在“ yield call”中直接调用localforage方法，而是将其包装到单独的类中：

export class LocalDataService {  
  getData = ( param ) => {
    return localforage.getItem(param)
      .then( result => result)
      .catch( reason => reason)
  }
}

export function* handleRecoverFavorites() {
  try {
    const api = new LocalDataService()
    const resp = yield call( api.getData, 'favorites')
(...)

Answer 2

根据 Sylwek 的回复，并进一步调查，该问题依赖于内部 setItem 上下文没有像我们预期的那样绑定。通过以下形式调用localforage，我们可以避免创建一个类：

yield call([localforage, localforage.getItem], 'favorites')

这为我修好了:) 检查 saga 文档中的 this context 部分：https://redux-saga.js.org/docs/basics/DeclarativeEffects/

redux saga yield调用抛出错误TypeError：无法读取null的属性“ ready”

2 个答案: