Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Image Tool: uploading failed because of incorrect response - Nuxt

See original GitHub issue

Have implemented vue-editor-js is nuxt as per instructions and set up config as per and added a backend as per Problem is the configuration of editor image tools doesn’t seem to be working. The endpoint doesnt seem to have any effect and selecting a file initiates a POST request to my current nuxt path Request URL: http://localhost:6969/admin/post/new which responds with

Image Tool: uploading failed because of incorrect response: "<!doctype html>\n<html data-n-head-ssr>\n  <head >\n    <title>future-wars-nuxt</title><meta data-n-head=\"ssr\" charset=\"utf-8\"><meta data-n-head=\"ssr\" name=\"viewport\" content=\"width=device-width, initial-scale=1\"><meta data-n-head=\"ssr\" data-hid=\"description\" name=\"description\" content=\"Nuxt frontend for Future Wars\"><link data-n-head=\"ssr\" rel=\"stylesheet\" 
etc etc .......

Inspecting the editor vis this.$refs I can see the is empty. Should this be displaying the config settings?? Screen Shot 2020-01-12 at 4 20 46 pm

Here is my component for reference

  <div class="page">
    <m-form title="New Post">
      <m-input name="title" label="title" v-model="title" />
      <m-input name="slug" label="slug" v-model="slug" />
      <m-input name="tags" label="tags" v-model="tags" />
        <datepicker placeholder="Select Date" v-model="date"></datepicker>
      <h1 style="text-align: center;">Editor.js on Nuxt.js</h1>
      <m-button variant="primary" @click="save">Save</m-button>
      <m-button variant="primary" @click="clear">Clear</m-button>
      <m-button variant="secondary" @click="log">Log</m-button>
      <select @change="handleTypeChange">
        <option v-for="type in types" :key="type" :value="type">
      <hr />

import Slugify from 'slugify';
import { postTypes } from '~/constants';
import { mapGetters, mapActions } from 'vuex';
import { editorBlocksInit } from '~/constants'; 

export default {
  name: 'NewBlogPost',
  middleware: ['check-auth', 'auth', 'is-admin'], 
  data() {
    return {
      title: 'Meh Blog',
      tags: 'Stenk',
      postType: postTypes[0],
      date: new Date(),
      initData: {
        blocks: editorBlocksInit
      author: null,
      config: {
        image: {
          // Like in
          endpoints: {
            byFile: 'http://localhost:2020/api/image',
            // byUrl: 'http://localhost:8090/image-by-url',
          field: 'image',
          types: 'image/*',
          // Cant get this to work either
          // uploader: {
          //   uploadByFile: this.uploadByFile
          // }
  computed: {
    ...mapGetters('auth', ['getUser']),
    slug() {
      return Slugify(this.title).toLowerCase();
    types() {
      return postTypes;
  methods: {
    ...mapActions('posts', ['create']),
    editorReady() {
      console.log('We is ready!!!!!!');
    updateEditor() {
      console.log('change', this.$refs);
      this.$ => {
        this.initData.blocks = outputData.blocks;
        this.initData.timeStamp = outputData.time;
        this.initData.version = !this.initData.version
          ? outputData.version
          : this.initData.version;
    save() {
      const createdPost = {
        title: this.title,
        slug: this.slug,
        tags: this.tags,
        isLive: false,
        postType: this.postType,
        author: this.getUser._id,
        content: JSON.stringify(this.initData)

      this.create({ createdPost }).then(res => {
    clear() {
    log() {
    handleTypeChange(e) {
      this.postType =;
    uploadByFile(file) {
      console.log('we wil upload ' + process.env.cloudinaryName)
      return this.$store.dispatch('posts/uploadImage', file)


I’d ultimately like to use the uploader config prop to call a vuex action in uploadByFile but nothing in config seems to be having effect at the moment??

Issue Analytics

  • State:open
  • Created 4 years ago
  • Comments:7 (1 by maintainers)

github_iconTop GitHub Comments

Loskircommented, Jan 14, 2020

The problem is that editor sends request to the current url instead of localhost:2020 as specified in the config. Can’t figure out why.

hkmsadekcommented, Jun 1, 2020

I am having this exact same issues. It seems this plugin never use the config for image tool.

Read more comments on GitHub >

github_iconTop Results From Across the Web

codex-team/editor.js - Gitter
I have a question about images on editor.js ... when response is wrong, the console message displayed is : "uploading failed because of...
Read more >
editorjs image plugin return image url is not picked up
I configured editorjs into my application. I installed image plugin on it so that I can upload an image to the server.
Read more >
Converts src to provider optimized URLs; Automatically resizes images based on width and height; Generates responsive sizes when providing sizes option ...
Read more >
How To Make A Drag-and-Drop File Uploader With Vue.js 3
You'll then click on the “Upload” button to send the image data to the ... Nuxt, and Quasar all have their own project...
Read more >
Simple upload adapter - CKEditor 5 Documentation
If something went wrong, the server must return an object that contains the error property. This will terminate the upload in the editor,...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Post

No results found

github_iconTop Related Hashnode Post

No results found