sockjs-node (Not Found)

[mavajee]

Version

3.0.0-beta.15

Reproduction link

https://jsfiddle.net/w0jg8bdr/

Steps to reproduce

Use with nginx

What is expected?

HMR working with nginx

What is actually happening?

I use 3 version of vue cli and nginx. And each vue app have different sockjs-node path.

vue cli 10 have path 0.0.0.0:8082/sockjs-node/*** and it's work

vue cli 12 have path http://localhost.com:8082/sockjs-node/*** and it's work to

vue cli 15 have path http://localhost.com/sockjs-node/*** and it's not work. How you can see port is missing

UPD. If i run app on 0.0.0.0:8082 without nginx all work fine

---

maybe this commit is the reason or this

It's bug or just I not correct config my app?

[mavajee]

I found the trouble, in this commit line 70, if remove '?/sockjs-node', all work

[mavajee]

versions 10 has the best correct sockjs path to dev serve from any host name.

[jkzing]

Umm, it should not work like that. What is baseUrl in your vue.config.js?

[mavajee]

@jkzing I try use baseUrl but it not work. in ver 10 I used absolute path to work with nginx

config.output.publicPath = http://${host}:${port}/

because need all request send to webpack dev server

UPD: I try '/' baseUrl
UPD: All files on dev server located in '/'.

[yyx990803]

@mavajee you should not be mutating publicPath because this value needs to be used in other places in addition to the wepback config. Use the baseUrl option.

[Akryum]

@yyx990803 Maybe we could check that and display the like of Don't change webpack 'ouput.publicPath' directly, use vue.config.js 'baseUrl' instead.

[yyx990803]

@Akryum that would be nice although it's a bit difficult to precisely detect that

[jkzing]

I guess OP's usage is like having a baseUrl: 'http://localhost:8082/' in vue.config.js.

With a nginx config like:

server {
  listen 8082 default_server;
  location / {
    proxy_pass  http://localhost:8080;
    proxy_set_header Host $host;
  }
}

Then open http://localhost:8082 in browser.

In above case, current strategy to fix the socket url to '/sockjs-node' is not enough, maybe we need to fix it to 'http://localhost:8080/sockjs-node'.

[mavajee]

Thank you for answers. I will check it tomorrow.

What if make '/sockjs-node' url same absolute dev server url. Anyway HMR and sockjs work only with dev server

[mavajee]

@jkzing, hi, now it work for me, but if i put to baseUrl absolute url, I have this (just incorrect display, but all work)

vue.config.js

const path = require('path')

const host = '0.0.0.0'
const port = 8085

module.exports = {
  lintOnSave: false,
  baseUrl: `http://${host}:${port}/`,

  devServer: {
    port,
    host,
    hotOnly: true,
    disableHostCheck: true,
    clientLogLevel: 'warning',
    inline: true,
    headers: {
      'Access-Control-Allow-Origin': '*',
      'Access-Control-Allow-Methods': 'GET, POST, PUT, DELETE, PATCH, OPTIONS',
      'Access-Control-Allow-Headers': 'X-Requested-With, content-type, Authorization'
    },
  }
}

[mavajee]

and about historyApiFallback, just my usage situations. If use absolute url, it's will make some troubles.

[jkzing]

@mavajee Just FYI, if current historyApiFallback not works for you, you can still overwrite it in vue.config.js.

[mavajee]

@jkzing, yes I did it, i think it comment will be helpful for you