Parse-sdk-js: How can use Parse things in middieware on Nuxt.JS

Created on 17 Feb 2020  路  8Comments  路  Source: parse-community/Parse-SDK-JS

I plugged on parse.js to nuxt.config.js

** plugins/parse.js


import Vue from 'vue';
import Parse from 'parse';

Parse.initialize(
  'APP_ID',
  'JS_KEY'
);
Parse.serverURL = 'https://SERVER_URL/';

Vue.use(Parse);
** nuxt.config.js
...
plugins: ['~/plugins/parse.js', ...],
...



md5-f46d29ff755fe6f33722c7c83943c181



import _ from 'lodash';
import Parse from 'parse';
import { TITLE_GET } from '~/store/mutation-types';

const state = {
  success: false,
  message: null,
  items: [],
};

const mutations = {
  [TITLE_GET](state, { success, message, items }) {
    state.success = success;
    state.message = message;
    state.items = items || [];
  },
};

const actions = {
  async getItems({ commit }) {
    try {
      const results = await new Parse.Query('Title').find();
      // const results = await Parse.Cloud.run('getTitle'); // cause by localStorage issue
      commit(TITLE_GET, { success: true, message: null, items: results });
    } catch (e) {
      commit(TITLE_GET, { success: false, message: e });
    }
  },
};

export default {
  namespaced: true,
  state,
  mutations,
  actions,
};



md5-38da703de65c9dc0d0b9e5f95f77d943



ReferenceError : localStorage is not defined.

This message just showed trying in middleware. Calling from pages is fine.

It seems to checking localStroage before requesting.

Is best way use REST API? or Any suggestion?

  • I could'nt access community.parseplatform.org. cause gateway issue.
question

Most helpful comment

@davimacedo

I correctly solved ; add these codes to nuxt.config.js

that error caused from __XMLHttpRequest__ dependency from parse/node.

...
build: {
    /*
     ** You can extend webpack config here
     */
    ...
    extend(config, ctx) {
      config.node = {
        fs: 'empty',
        child_process: 'empty',
      };
    },
    ...
  },
...

All 8 comments

I think you will have to do something like this:

const Parse = typeof window === 'undefined' ? require('parse/node') : require('parse');

@davimacedo

Thank you I will try it.

I tried this code to plugins and needs stores.

import Parse from 'parse/node';

and return these messages.

These dependencies were not found:                                                                                                                            friendly-errors 12:38:37
                                                                                                                                                              friendly-errors 12:38:37
* child_process in ./node_modules/xmlhttprequest/lib/XMLHttpRequest.js                                                                                        friendly-errors 12:38:37
* fs in ./node_modules/xmlhttprequest/lib/XMLHttpRequest.js                                                                                                   friendly-errors 12:38:37
                                                                                                                                                              friendly-errors 12:38:37
To install them, you can run: npm install --save child_process fs      

I installed child_process and fs, but still do.

Have you tried the way I suggested? Basically Parse needs to be imported from 'parse' in the browser and from 'parse/node' in the server. Since the same code in your nuxt application will turn in both environments you will have to do something like what I suggested to make sure you are importing in the right way for each environment.

I solved prob with this dependency

nuxt-parse : https://github.com/cierrateam/nuxt-parse

Nice. Thanks for sharing!

@davimacedo

I correctly solved ; add these codes to nuxt.config.js

that error caused from __XMLHttpRequest__ dependency from parse/node.

...
build: {
    /*
     ** You can extend webpack config here
     */
    ...
    extend(config, ctx) {
      config.node = {
        fs: 'empty',
        child_process: 'empty',
      };
    },
    ...
  },
...

In case anyone else is using Nuxt for SSR, I've managed to get SSR working with the nuxt-parse module by attaching Parse to the Nuxt context - see here: https://github.com/cierrateam/nuxt-parse/issues/23

I've mentioned there that I've not tested this with Middelware yet, but as soon as I have, I'll add further comments to the ticket referenced here.

Was this page helpful?
0 / 5 - 0 ratings