marshallswain / feathers-pinia

Connect your Feathers API to the elegant data store for Vue
52 stars 22 forks source link

"Error: Failed to execute 'fetch' on 'Window': Illegal Invocation. When authenticate-ing #123

Closed danielenriquez59 closed 1 year ago

danielenriquez59 commented 1 year ago

When I hit this line in my code,
await authStore.authenticate({strategy: 'local', ...state})

I get the error below image

any thoughts?

danielenriquez59 commented 1 year ago

Heres my feathers.js file:

import { feathers } from "@feathersjs/feathers";
import authenticationClient from "@feathersjs/authentication-client";
import rest from "@feathersjs/rest-client";
import { pinia } from "@/store/index";
import { createPiniaClient } from "feathers-pinia";

const host = import.meta.env.VITE_API_URL || "http://localhost:3030";
window.fetch.bind(window);

export const feathersClient = feathers()
  .configure(rest(host).fetch(fetch))
  .configure(authenticationClient({ storage: window.localStorage }));

// src/feathers.ts
export const api = createPiniaClient(feathersClient, {
    pinia,
    idField: "_id",
    // optional
    ssr: false,
    whitelist: [],
    paramsForServer: [],
    skipGetIfExists: true,
    customSiftOperators: {},
    services: {},
  });
danielenriquez59 commented 1 year ago

using ofetch fixed this issue for me. https://v3.feathers-pinia.pages.dev/setup/nuxt3.html#_1-feathers-client

marshallswain commented 1 year ago

I found the fix for the original configuration. Change this line:

window.fetch.bind(window);

to this:

const fetch = window.fetch.bind(window);

You have to pass the bound fetch to the fetch client.