Linux安装nodejs+express实现简单服务调用

本文详细介绍两种NodeJS安装方法,包括使用yum和手动下载安装,以及如何通过NodeJS创建HTTP服务,涵盖服务目录创建、服务文件编写和启动流程。

1. nodejs的安装

方法一:

sudo yum install epel-release

sudo yum install nodejs

node --v

提示安装了v6.14.3

sudo yum install npm --enablerepo=epel

npm -v

提示安装了3.10.10

全局安装express

sudo npm install -g express

sudo npm install -g express-generator

express --version

提示安装了4.16.0

方法二:

1、下载

wget --no-check-certificate https://nodejs.org/dist/v6.11.1/node-v6.11.1-linux-x64.tar.xz

2、解压

tar xvf node-v6.11.1-linux-x64.tar.xz

把bin文件夹中node以及npm设置为全局:

 sudo ln -s /home/node-v6.11.1-linux-x64/bin/node /usr/local/bin/node

 sudo ln -s /home/node-v6.11.1-linux-x64/bin/npm /usr/local/bin/npm

3、安装 express

npm install express -gd 
npm install -g express-generator

将express设置为全局: 

sudo ln -s /home/node-v6.11.1-linux-x64/bin/express/usr/local/bin/express

2. nodejs服务

 #创建web服务目录
 mkdir www
 #进入www目录创建server.js作为nodejs的http服务器文件
 touch server.js
 #启动服务
 node server.js

 server.js

var http = require('http');
var querystring = require('querystring');
const hostname = '11.22.212.5';
const port = 3030;

console.log(`Server running at http://${hostname}:${port}/`);
http.createServer(function (req, res) {
    
    //暂存请求体信息
    var body = "";
 
    //请求链接
    console.log(req.url);
 
    //每当接收到请求体数据,累加到post中
    req.on('data', function (chunk) {
        body += chunk;  //一定要使用+=,如果body=chunk,因为请求favicon.ico,body会等于{}
        console.log("chunk:",chunk);
    });
 
    //在end事件触发后,通过querystring.parse将post解析为真正的POST请求格式,然后向客户端返回。
    req.on('end', function () {
        // 解析参数
        body = querystring.parse(body);  //将一个字符串反序列化为一个对象
        console.log("body:",body);
        // 设置响应头部信息及编码\

      res.writeHead(200, {'Content-Type': 'text/html; charset=utf8'});  
        res.write("ok");
        res.end();
    });
}).listen(port, hostname);

listen事件去掉hostname就是本地请求

浏览器请求,返回ok

 

参考

https://segmentfault.com/a/1190000011819291

https://www.cnblogs.com/jj-notes/p/6670310.html

<think>好的,用户想在Linux环境下搭建Vue和Express的开发环境。首先,我需要回忆一下Vue和Express的基本安装步骤。根据用户提供的引用,Vue可以使用vue-cli来创建项目,比如引用[2]里提到用vue create命令。而Express可能需要Node.js环境,所以首先要确保系统里安装Node.js和npm。 接下来,用户是Linux系统,可能需要检查Node.js的安装情况。通常可以用nvm来管理Node版本,或者直接通过包管理器安装。比如用apt-get安装Node.js和npm。然后,安装Vue CLI,可能需要全局安装,这样就能使用vue命令了。 然后是创建Vue项目,比如vue create frontend,这里要确认用户是否需要Vue2或者Vue3。引用[2]中用的是Vue2,所以可能需要指定版本。之后是进入项目目录并运行npm run serve启动前端服务。 接下来是Express后端部分。需要新建一个目录,初始化npm项目,安装Express和其他可能需要的中间件,比如body-parser或者cors。然后创建入口文件,比如app.js,设置基本的路由和监听端口。引用[5]中提到了路由配置,可能用户之后需要配置路由,但当前主要是搭建环境,所以基础示例即可。 然后,用户可能需要同时运行前端和后端,这时候需要两个终端窗口或者使用并发工具,比如npm-run-all或者concurrently。不过用户可能知道怎么处理,所以步骤里可以提到如何分别启动。 另外,用户可能需要配置跨域请求,因为前端和后端可能运行在不同端口。这时候可以用Express的CORS中间件,引用[5]里的路由配置可能相关,但具体需要安装cors包并添加到Express应用中。 最后,用户可能需要测试环境是否搭建成功,访问前端和后端的端口,看看是否正常响应。如果有问题,可能需要检查端口是否被占用,依赖是否正确安装。 还要注意引用里的信息,比如引用[1]提到mpvue是美团开发的,但用户的问题是关于Vue和Express,所以可能不需要涉及mpvue。引用[3]和[4]提到Vue的特点,如易用性和性能,这些可以作为背景信息,但重点在步骤。 可能用户是刚开始学习,所以步骤要详细,包括每个命令和可能遇到的常见问题,比如权限问题需要sudo,或者node版本过低需要升级。此外,确保npm的包安装正确,避免权限错误,建议使用nvm或者正确配置npm的全局安装路径。 总结步骤应该是:安装Node.js和npm -> 安装Vue CLI -> 创建Vue项目 -> 初始化Express项目 -> 分别启动前后端 -> 配置跨域。同时生成相关问题,比如如何连接前后端,如何部署,性能优化等,参考用户之前的示例问题。</think>### 如何在Linux系统上配置Vue与Express开发环境? #### 1. **安装Node.js和npm** - Vue和Express均基于Node.js环境运行。通过以下命令安装: ```bash sudo apt update sudo apt install nodejs npm ``` - 验证安装: ```bash node -v # 检查Node.js版本 npm -v # 检查npm版本 ``` - 若版本过旧,建议使用`nvm`管理Node版本[^4]。 #### 2. **安装Vue CLI并创建前端项目** - 全局安装Vue CLI(Vue脚手架工具): ```bash npm install -g @vue/cli ``` - 创建Vue项目(例如命名为`frontend`): ```bash vue create frontend ``` 选择Vue2或Vue3模板(根据需求选择,引用[2]使用Vue2)[^2]。 - 启动前端开发服务器: ```bash cd frontend npm run serve ``` 访问`http://localhost:8080`验证前端运行状态。 #### 3. **初始化Express后端项目** - 新建后端目录并初始化npm: ```bash mkdir backend && cd backend npm init -y ``` - 安装Express和相关依赖: ```bash npm install express cors body-parser ``` - 创建入口文件`app.js`,编写基础代码: ```javascript const express = require('express'); const cors = require('cors'); const app = express(); app.use(cors()); // 允许跨域请求 app.use(express.json()); app.get('/api/data', (req, res) => { res.json({ message: "Hello from Express!" }); }); const PORT = 3000; app.listen(PORT, () => { console.log(`Express server running on port ${PORT}`); }); ``` - 启动后端服务: ```bash node app.js ``` 访问`http://localhost:3000/api/data`验证接口响应。 #### 4. **前后端联调配置** - 在Vue项目中通过`axios`调用Express接口: ```bash cd frontend && npm install axios ``` - 在Vue组件中发起请求: ```javascript import axios from 'axios'; export default { methods: { fetchData() { axios.get('http://localhost:3000/api/data') .then(response => console.log(response.data)); } } } ``` #### 5. **配置生产环境部署** - 构建Vue生产版本: ```bash npm run build ``` - Express中托管静态文件: ```javascript const path = require('path'); app.use(express.static(path.join(__dirname, '../frontend/dist'))); ``` --- ###
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值