请教各位前辈，vue-cli可以跨域拿到豆瓣的数据，为什么不能跨域拿到本地数据库的数据呢？

Question

尝试用vue-cli来获取本地服务器数据库的数据但返回以下错误提示，用同样的写法却可以获取豆瓣的数据。折腾来一个晚上无法解决，希望前辈们能抽空指点！不胜感激！

[HPM] Error occurred while trying to proxy request  from localhost:8080 to http://localhost:3000 (ECONNREFUSED) (https://nodejs.org/api/errors.html#errors_common_system_errors)

我的代码部分
config -> index.js

proxyTable: {
    '/api':{
        target: 'http://localhost:3000',
        changeOrigin: true,
        pathRewrite: {
        '^/api': ''
        }
     }

src -> main.js

import Vue from 'vue'
import App from './App'
import VueRouter from 'vue-router'
import routerConfig from './router.config.js' //引入路由
import Axios from 'axios'


Vue.config.productionTip = false;
Vue.prototype.$axios = Axios;
Vue.prototype.HOST = '/api';

Vue.use(VueRouter);

const router = new VueRouter(routerConfig) //启动路由

/* eslint-disable no-new */
new Vue({
  el: '#app',
  router,  //挂载路由
  components: { App }, // 组件名
  template: '<App/>',
})

src -> App.vue

export default{

  created(){
    var url = this.HOST
    this.$axios.get(url,{

    }).then((res)=>{

     console.log(res.data)

    },(res)=>{

    alert(res.status)
  })
  }
}

后台server

const express = require('express');
const mysql = require('mysql');

const db = mysql.createPool({
  localhost:'localhost',
  user:'root',
  password:'123456',
  database:'blog'
})

const server = express();

server.use('/api',(req,res)=>{

    db.query(`SELECT * FROM articles_table`,(err,data)=>{
       if(err){
         console.error(err);
         res.status(500).send('database error').end();
       }else{
         res.send(data)
       }
    })

})

server.listen(3000)

Answer 1

感谢各位前辈关注和解答，最后我用了以下办法来解决

1、安装

npm install --save-dev concurrently

2、将package.json的script加上

"server": "node server.js",
"go": "concurrently --kill-others \"npm run dev\" \"npm run server\""

3、输入命令

npm run go

然后就可以了

Answer 2

既然可以拿到豆瓣的数据，证明你前端部分写的肯定是没错的。我看了一下你的后端代码，发现你用了exoress，但是貌似没有监听3000端口，要监听了端口才是开启server。

Answer 3

豆瓣API默认开启跨域的，因为是开放API，不跨域一般需要服务端中专，挺麻烦的

Answer 4

参考:https://blog.csdn.net/dreamer...
在服务器端设置返回的头部数据试试

Answer 5

因为现在有些网站默认开启了跨域设置，使得接口即使跨域也可以访问

Answer 6

你这样将/api代理到了本地3000端口，请求端口上的/api接口，就要用/api/api吧。。你试试看

Answer 7

应该是你本地的api没开启跨域吧，现在推荐使用cors解决跨域问题