控制台显示的IP地址有点问题

[liaowentuan]

Version

3.2.0

Environment info

 System:
    OS: Windows 10
    CPU: (4) x64 Intel(R) Core(TM) i3-4160 CPU @ 3.60GHz
  Binaries:
    Node: Not Found
    Yarn: Not Found
    npm: 6.2.0 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: 41.16299.785.0
  npmPackages:
    @vue/babel-preset-app:  3.2.0
    @vue/cli-overlay:  3.2.0
    @vue/cli-plugin-babel: ^3.2.0 => 3.2.0
    @vue/cli-plugin-typescript: ^3.2.0 => 3.2.0
    @vue/cli-service: ^3.2.0 => 3.2.0
    @vue/cli-shared-utils:  3.2.0
    @vue/component-compiler-utils:  2.3.1
    @vue/preload-webpack-plugin:  1.1.0
    @vue/web-component-wrapper:  1.2.0
    babel-helper-vue-jsx-merge-props:  2.0.3
    babel-plugin-transform-vue-jsx:  4.0.1
    vue: ^2.5.17 => 2.5.21
    vue-class-component: ^6.0.0 => 6.3.2
    vue-hot-reload-api:  2.3.1
    vue-lazyload:  1.2.3
    vue-loader:  15.4.2
    vue-property-decorator: ^7.0.0 => 7.2.0
    vue-router: ^3.0.1 => 3.0.2
    vue-style-loader:  4.1.2
    vue-template-compiler: ^2.5.17 => 2.5.21
    vue-template-es2015-compiler:  1.6.0
    vuex: ^3.0.1 => 3.0.1
  npmGlobalPackages:
    @vue/cli: Not Found

Steps to reproduce

vue.config.js
devServer: {
// host: 'localhost',
host: "0.0.0.0",
port: 8000,
npm run serve 后，别的小伙伴使用 Network地址 无法打开

What is expected?

npm run serve 后上面的Network地址显示的是别人都能访问的地址

What is actually happening?

我的电脑有3个IPv4的地址，使用的是最下面的那个无线局域网适配器的IP地址；而控制台显示的是最上面那个地址，故无法使用别的电脑通过命令行上显示的 ‘Network‘地址打开

---

npm run serve 后上面的Network地址要么不显示；要么就全显示吧

[liaowentuan]

[shenliangv]

I had the same problem (#2534).
It seems that when there are multiple network adapters, the program did not get the correct ip address.
When I disable all network adapters until the one I'm using is left, the expected results were achieved.

[shenliangv]

This problem seems to be solved by modifying the file packages/@vue/cli-service/lib/util/prepareURLs.js.
Need to install default-gateway dependencies first

line ~ 12

const defaultGateway = require('default-gateway')

line ~ 36

// lanUrlForConfig = address.ip()
const result = defaultGateway.v4.sync()
lanUrlForConfig = address.ip(result && result.interface)

@sodatea

[WONDERlust91]

This problem seems to be solved by modifying the file packages/@vue/cli-service/lib/util/prepareURLs.js.
Need to install default-gateway dependencies first

line ~ 12

const defaultGateway = require('default-gateway')

line ~ 36

// lanUrlForConfig = address.ip()
const result = defaultGateway.v4.sync()
lanUrlForConfig = address.ip(result && result.interface)

@sodatea

My vue-cli version is 3.8.3

There is also something wrong when the Interface name is in Chinese words.

I changed the Interface name to English. The problem solved.

@sodatea

[haoqunjiang]

@WONDERlust91 Thanks for the hint. I don't have a Windows computer at the moment so I can't debug it until later. Could you raise an issue to https://github.com/silverwind/default-gateway? Seems they failed to parse Unicode interface names.

[WONDERlust91]

@WONDERlust91 Thanks for the hint. I don't have a Windows computer at the moment so I can't debug it until later. Could you raise an issue to https://github.com/silverwind/default-gateway? Seems they failed to parse Unicode interface names.

I've already raised an issue to default-gateway.