ruby-on-rails - 设计中的 ActionController::UnknownFormat::SessionsController#create

Question

我已经使用 Devise 创建了一个用户模型，但使用了 React 视图。每当我尝试使用我的反应视图登录以设计会话控制器时，我都会得到UnknownFormat.

我的登录页面是

import React, { useState } from 'react'
import authApi from '../apis/auth'
import { Link } from 'react-router-dom'
import { setAuthHeaders } from '../apis/axios'
import LoginForm from "./LoginForm"

export default function Login({changePage}) {
  const [email, setEmail] = useState("");
  const [password, setPassword] = useState("");
  const [loading, setLoading] = useState(false);
  const [currentUser, setCurrentUser] = useState(null)
  const [loggedIn, setLoggedIn] = useState(false)
  const handleLogin = async (event) => {
    event.preventDefault()
    try {
      const res = await authApi.login({
         login: {
           email,
           password
          }
        });
        setAuthHeaders()
        setLoading(false)
        setCurrentUser(res)
        setLoggedIn(true)
        console.log(res.data)
        window.location.href = "/";
    } catch {
      setLoading(false)
    }
  }

  return (
    <LoginForm
      setEmail={setEmail}
      setPassword={setPassword}
      loading={loading}
      handleSubmit={handleLogin}
    />
  )
}

并且是authApi_axios

import axios from 'axios'

const login = (payload) => axios.post("/users/sign_in", payload);

const logout = () => axios.delete("/users/sign_in");

const signup = (payload) => axios.post("/users", payload);

const authApi = {
    login,
    logout,
    signup
}

export default authApi;

会话控制器

class SessionsController < Devise::SessionsController    
  def create
    @user = User.find_by_email(user_params[:email])
    return invalid_login_attempt unless @user
  
    if @user.valid_password?(user_params[:password])
      sign_in :user, @user
      render json: @user
    else
      invalid_login_attempt
    end
  end
  
  def destroy
    sign_out(@user)
    render :json=> {:success=>true}
  end
   
  private
  
  def invalid_login_attempt
    warden.custom_failure!
    render json: {error: 'invalid login attempt'}, status: :unprocessable_entity
  end
  
  def user_params
    params.require(:user).permit(:email, :password)
  end  
end

应用控制器

class ApplicationController < ActionController::Base
  protect_from_forgery with: :null_session
  respond_to :html, :json
end

axios.js

import axios from "axios";
import Toastr from "../Common/Toastr";
 import { setToLocalStorage } from "helpers/storage.js";

axios.defaults.baseURL = "/";

export const setAuthHeaders = (setLoading = () => null) => {
  axios.defaults.headers = {
    Accept: "applicaion/json",
    "Content-Type": "application/json",
    "X-CSRF-TOKEN": document
      .querySelector('[name="csrf-token"]')
      .getAttribute("content"),
  };
   const token = localStorage.getItem("authToken");
  const email = localStorage.getItem("authEmail");
  if (email) {
     axios.defaults.headers["X-Auth-Email"] = email;
    axios.defaults.headers["X-Auth-Token"] = token;
  }
  setLoading(false);
};

标签： ruby-on-railsreactjsdevise