时间戳

首页 > 解决方案 > Redux saga 不获取到 api

reactjs - Redux saga 不获取到 api

问题描述

我正在尝试从服务器获取当前用户，但它似乎无法正常工作。我正在使用 redux saga 来提出请求。这是我的传奇，负责请求一些数据`

    import {
  take, put, call, apply
} from 'redux-saga/effects';

import { getUserInfo, GET_USER_INFO } from '../actions';

export default function* currentUserSaga() {
  let data;
  try {
    yield take(GET_USER_INFO);
    const response = yield call(fetch, '/api/current_user');
    data = yield apply(response, response.json);
    console.log(response, 'responseee from user saga');
    yield put(getUserInfo(data));
  } catch (err) {
    console.log(err);
  }
}

所以现在我使用 webpack dev-server 来代理对localhost:5000的API调用。这是我的 webpack 配置

const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const CleanWebpackPlugin = require('clean-webpack-plugin');
const ExtractCssChunks = require('extract-css-chunks-webpack-plugin');

module.exports = (env) => {
  const isProduction = env === 'production';

  return {
    entry: ['@babel/polyfill', './src/client/index.js'],
    output: {
      path: path.join(__dirname, 'dist'),
      filename: 'bundle.js'
    },
    module: {
      rules: [
        {
          test: /\.js$/,
          exclude: /node_modules/,
          use: {
            loader: 'babel-loader'
          }
        },
        {
          test: /\.s?css$/,
          use: [{
            loader: ExtractCssChunks.loader
          }, {
            loader: 'css-loader',
            options: { sourceMap: true, importLoaders: 1 }
          }, {
            loader: 'postcss-loader',
            options: { sourceMap: true }
          }, {
            loader: 'sass-loader',
            options: { sourceMap: true }
          }]
        },
        {
          test: /\.(png|woff|woff2|eot|ttf|svg)$/,
          use: [
            {
              loader: 'url-loader',
              options: {
                limit: 24576
              }
            }
          ]
        }
      ]
    },
    plugins: [
      new CleanWebpackPlugin(['dist']),
      new HtmlWebpackPlugin({
        filename: 'index.html',
        template: './public/index.html',
        favicon: 'public/images/react.png'
      }),
      new ExtractCssChunks({
        path: path.join(__dirname, 'dist'),
        filename: 'style.css'
      })
    ],
    devServer: {
      contentBase: path.join(__dirname, 'dist'),
      historyApiFallback: true,
      port: 3000,
      proxy: {
        '/auth/eventbrite': 'http://localhost:5000',
        '/api/*': {
          target: 'http://localhost:5000'
        }
      }
    },
    devtool: isProduction ? 'source-map' : 'inline-source-map'
  };
};

我认为问题出在生成器上，因为当我打开浏览器并输入http://localhost:3000/api/current_user它给了我用户数据的 JSON 对象。任何帮助，将不胜感激

标签： reactjswebpackreduxredux-saga

解决方案

您成功获得了必须解析为json格式的数据，请执行此操作。

let data = yield call([response, response.json]);
console.log(data);

或者您甚至可以通过这种方式获取数据。

let data =  yield response.json();
console.log(data)

推荐阅读