vue请求node：前后端分离(解决跨域问题)

1)修改vue项目的config/index.js里的dev/proxyTable内容

proxyTable: {
      // proxy all requests starting with /api to jsonplaceholder
      '/api': {//虚拟目录
        target: 'http://localhost:3000',//后台Node项目的请求网址
        changeOrigin: true,
        pathRewrite: {
          '^/api': ''//由于上面的虚拟目录实际上是不存在的，不去掉的话访问的时候显示的url会变成'http://localhost:3000/api'，所以得去掉
        }
      }
    },

 

2)vue前端项目中响应事件(此处为一进入页面就执行ajax，使用mounted属性)

export default {
    data() {
      return data
    },
    mounted:function(){
      this.selectAll();
    },
    methods: {
      selectAll: function () {
        var self = this;
        $.ajax({
          type:'POST',
          url:'http://localhost:3000/selectAll',
          data:{
               aa : AA
          },
          success:function (backDate) {
            // body...
            console.log(backDate);
            // 把从数据库中获取到的数据赋值给vue里的data
            self .data = backDate;
            // 把backDate数组的内容拼接给data.rows
            Array.prototype.push.apply(data.rows,backDate);
          }
        })

      },

 

3)node后台项目响应ajax，建议新手在routes/index.js下编写，在其他地方需要另外配置路由

// 如果项目没有install express要自行install，我其他博客有
var express = require('express');
var router = express.Router();

//引入数据库包：连接数据库的
var db = require("./dbnode.js");

router.post('/add', function (req, res) {
    // 获得传过来的值
    var aa= req.body.aa;
    // 执行sql
    db.query("insert into user(name,age,school,remark) values('" + name + "','" + age + "','" + school + "','" + remark + "')", function (err, rows) {
        if (err) {
            res.end('新增失败：' + err);
        } else {
            // 返回内容
            res.json({name:name,pwd:school});
        }
    })
});


module.exports = router;

 

4)另附dbnode.js，连接mysql数据库的代码

// MySQL数据库联接配置
var mysql      = require('mysql');
var pool = mysql.createPool({
    host: 'localhost',
    user: 'root',
    password: '123456',
    database: 'testnode'
});

function query(sql, callback) {
    pool.getConnection(function (err, connection) {
        // Use the connection
        connection.query(sql, function (err, rows) {
            callback(err, rows);
            connection.release();//释放链接
        });
    });
}



// var mysql      = require('mysql');
// var connection = mysql.createConnection({
//   host     : 'localhost',
//   user     : 'root',
//   password : '123456',
//   database : 'testdb'
// });

// connection.connect();

// connection.query(sql, function (error, results, fields) {
//   if (error) throw error;
//   console.log('The solution is: ', results[0].solution);
// });

// connection.end();

exports.query = query;