Estoy configurando una API de Rails y no puedo obtener datos desde la consola, aunque puedo recuperar datos a través de la barra de direcciones. En la consola, sigo recibiendo un error:
TypeError: Failed to fetch at <anonymous>:1:1
Cuando realizo la solicitud HTTP desde la barra de direcciones, puedo recuperar los datos sin problemas. Estoy usando un serializador y funciona correctamente.
Aquí está mi solicitud de búsqueda GET:
fetch('http://localhost:3000/api/v1/users') .then(res => res.json()) .then(data => console.log)Aquí está la respuesta:
Promise {<pending>} [[Prototype]]: Promise [[PromiseState]]: "rejected" [[PromiseResult]]: TypeError: Failed to fetch at <anonymous>:1:1Aquí está mi acción de índice:
def index users = User.all render json: UserSerializer.new(users) endAquí están mis rutas:
namespace :api do namespace :v1 do resources :users, only: [:index, :create] post '/login', to: 'auth#create' get '/profile', to: 'users#profile' end endAquí está mi serializador:
class UserSerializer include FastJsonapi::ObjectSerializer attributes :username, :email, :password, :role endCuando emito la misma solicitud GET desde la barra de direcciones, obtengo la respuesta correcta:
// 20211108121639 // http://localhost:3000/api/v1/users { "data": [ { "id": "1", "type": "user", "attributes": { "username": "mlgvla", "email": "monica@test.com", "password": null, "role": "student" } } ] }He intentado cambiar el puerto a 3001, con exactamente el mismo resultado. Tengo un vago recuerdo de esta rareza que sucedió hace mucho tiempo, pero olvidé la razón por la que esto sucede.
Gracias por cualquier orientación y sabiduría sobre la solución de este problema. ¡Obviamente, no puedo configurar mi front-end hasta que sepa que puedo hacer un GET o POST usando fetch!
Eso puede estar relacionado con la seguridad CORS. Me parece que no puede hacer una llamada directamente al back-end de esta manera. Funciona cuando escribe la URL directamente porque Rails lo maneja
Prueba esta gema, debería ayudarte: RACK CORS GEM
paquete de instalación
Y luego agregue config/initializers/cors.rb :
Rails.application.config.middleware.insert_before 0, Rack::Cors do allow do origins '*' resource '*', headers: :any, methods: [:get, :post, :patch, :put] end endPara mayor seguridad, debe restringir los orígenes :-)