vue+node全栈移动商城【3】-安装express,实现第一个nodeJs接口

作一个全栈项目少不了nodeJs,总有些同窗不太理解nodeJs能作什么。 其实很简单,前端

一、js自己不安全,因此有些操做之前是后端来作的,例如登陆、注册什么的。但如今有了nodeJs,这些以前由后端作的工做,我们前端也能够作了。vue

二、为何是node?由于nodeJs的开发语言默认就是js。node


express是一个工做在nodeJs里的框架,它和koa2什么的都是一路货色。就是操做一些http、router、template方面的更方便的操做。只要你会了express,那么其它的都差很少。ios


安装expressvue-cli

另外新建一个目录,打开cmd,执行:npm install express -save 在目录中新建文件: api_dev.js,在里面写:express

var express = require('express');
var app = express();

// 解决跨域问题,网上成熟的解决方案,我是直接拷贝的
app.all('*', function(req, res, next) {
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Method", "*");
    res.header("Access-Control-Allow-Headers","Content-Type");
    res.header("Access-Control-Max-Age", "3600");
    next();
});

// 第一个nodeJs接口,接收
app.get('/test_api', function(req, res){
	res.send({a:123});
});

app.listen( 5679,function(){
	console.log( '5679,中间件已经启动!' )
});
复制代码

而后打开cmd,运行 node api_dev.jsnpm


回到你的vue-cli项目里,进入src目录,新建proMain.vue,在script部分写上:axios

created(){
        axios.get('http://localhost:5679/test_api')
            .then( _d=>{
                console.log( _d.data );
            });
    }
复制代码

运行项目,若是在控制台可以输出,{a:123},你的第一个接口,就ok了。后端

注意,此时你要分别打开二个cmd窗口api

相关文章
相关标签/搜索