Ammar Akkad
Ammar Akkad

Reputation: 41

Cannot stringify a function when using axios get within nuxtServerInit

i am trying Udemy Nuxt.js course connect my app to the backend, when trying the following code i got GET http://localhost:3000/ 500 (Internal Server Error) on the client side,

import Vuex from 'vuex';
import axios from 'axios';
const createStore = () => {
    return new Vuex.Store({
        state: {
            loadedPosts: [],
        },
        mutations: {
            setPosts(state, posts) {
                state.loadedPosts = posts;
            },
        },
        actions: {
          nuxtServerInit(vuexContext, context) {
               return axios
                .get('https://nuxt-blog-7a712.firebaseio.com/posts.json')
                .then((res) => {
                    const postArray = [];
                    for (const key in res.data) {
                        postArray.push({ ...res.data[key], id: key });
                    }
                    vuexContext.commit('setPost', postArray);
                })
                .catch((e) => context.error(e));
        },

WARN Cannot stringify a function transformRequest

WARN Cannot stringify a function transformResponse

WARN Cannot stringify a function httpAdapter

WARN Cannot stringify a function validateStatus

WARN Cannot stringify arbitrary non-POJOs Writable

WARN Cannot stringify a function

i have google it to find some answers but couldn't find a fix, some posts talked about devalue package but do not know about this package usage

Upvotes: 2

Views: 3007

Answers (1)

Rick
Rick

Reputation: 338

maybe late, but I had trouble with this as well. The warnings are not what are breaking your code, they are just warnings.

What is breaking your code has to be something else, but looking at your code I can't find it..

try changing

.catch((e) => context.error(e));

to

.catch((e) => console.log(e); context.error(e));

to get a better idea of what is going wrong!

Upvotes: 3

Related Questions