Vue 页面的代码<label for=my_file class="theme-color"><mu-icon left value="backup"></mu-icon>修改头像 </label> <input type="file" ref="upload" name="avatar" id=my_file style="display:none;" accept="image/jpg" @change="changeAvatar" /> axios接口 let ChangeAvatar = (img) => axios({url: /user/changeavatar,method: post,anync: true,contentType: false,processData: false,data: img }) js部分调用封装的接口m...
一个vue+express 构建的后台管理系统 说明: vue+express 构建的后台管理系统,包括登录、注册、表格的增删改查 github 在线 搭建vue项目: 1.安装vue-cli脚手架 npm install -g vue-cli2.创建基于webpack模版的项目 vue init webpack my-express3.安装包依赖并运行 cd my-express npm install npm run devvue项目基于iview-admin改造的 通过应用生成器工具 express创建一个应用的骨架: 1.连接数据库 在config创建db.js var mysql ...
前端做多了,自然就会想往后端伸手。更何况现在有了Node和Express,让前端做后端开发的学习降低了不少。 最近正好揽下了一个 Vue + Express + mysql 的小项目。项目开始时是前后端分开开发的,但是当后台做好一部分要进行连接测试时问题就来了。前端部分在每次修改过就需要build一次,而后台也每次需要重启一次服务器才能进行调试。可想而知,这样的开发和调试效率是很低的。在这么煎熬着做了一个功能之后,实在受不了。于是便想有...
环境:vue 2.9.3; webpack 目的:接口的调用 跨域方式: 1、express中间的使用 2、nginx代理 3、谷歌浏览器跨域设置 --------------------------------------------分割线--------------------------------------------- express中间件---不推荐 原理:本地代码请求->express中间件(处理,添加headers后转发)->服务器 express中间件 medical本地代码文件目录 pacs#########配置接口在服务器中间件配置 medical/routes/home.js 没...
准备工作1. 为前端选择合适的预处理工具和资源管理工具预处理工具又分为 js 预处理工具和 css 预处理工具。Javascript 一直以来最为人诟病的一点就是缺乏原生的模块机制,所有 js 代码文件在被 html 页面引入后将共用同一个命名空间。所以才出现了各种“标准”尝试解决这个问题,但他们都不是原生的,需要额外的工具对代码进行特殊处理。虽然 ES6 终于引入了模块机制,但以现在的浏览器支持程度,还不足以“毫无顾虑地随拿随用”。...
我的环境 亚马逊(AWS)的一个ubuntu虚拟机.nodeopenssl生成证书输入如下命令会在你的当前文件夹生成localhost.key和localhost.cert. openssl genrsa -out localhost.key 2048 openssl req -new -x509 -key localhost.key -out localhost.cert -days 3650 -subj /CN=localhost其中localhost为域名. 想要换成别的域名就直接把上面的所有localhost替换成你的域名. 以我为例, 我的虚拟机的域名是xxx.compute.amazonaws.com, 就以这个域名...
在我们平时项目刚启动时,由于后台也是刚开始开发,我们前端往往在开发过程中没有数据和接口请求的,都要造一些假数据进去或者使用mock造一些数据进去,但是这样的话往往会偶合一些没用的代码进去。到时候还得删除。 下面来介绍一种 express + mock 让前后台并行开发。 前后需要先商量好数据格式,等等一系列细节问题,先不多说直接上代码 app.js use strict;const express = require(express); const app = express();// port let...
我本地测试时, HTTP使用3000端口, HTTPS使用443. 同时监听HTTP和HTTPS 参考上一篇文章Express本地测试HTTPS 转发所有GET请求httpApp.get("*", (req, res, next) => {let host = req.headers.host;host = host.replace(/\:\d+$/, ); // Remove port numberres.redirect(`https://${host}${req.path}`); }); 相当于自己拼接上https的链接然后redirect. 此时浏览器会收到302 (MOVED_TEMPORARILY)状态码, 并重定向到HTTPS. 转发所有请...
中间件express.static 我们使用express初始化一个目录的时候,会在app.js中看到一大推的app.use。 其中一个主要的中间件是express.static(4.0版本依旧保留的中间件) var express = require(express); var app = express();app.use(/static,express.static(public)); 通过express.static可以帮助我们托管静态文件,js,css,img等。 express.static使用 基本使用 项目目录下的public下面有css,js,img等文件夹。 我这么需要通过express...
最近公司在尝试前后端分离的开发模式,现有应用是java语言,要从中间拆除一个小的模块来做前后端分离,工具上还是jquery,只不过是流程和分工上的分离,不想在前端的机器上搭建一套java环境,就根据教程搭了一下转发,让本地可以接上开发服务器联调。为什么要使用node代理转发? 我们要实现前后端分离,然后前端不在自己的电脑上安装tomcat,这时候,我们通过用node搭建服务器,然后转发我们的请求。例如:自己本地是localhost:300...
在nodejs中使用express来搭建框架可以说是非常的简单方便,但是一般默认创建的都是http服务器,也就是只能通过http协议进行访问。如今https已经是发展趋势,我们应该顺应时代的潮流。在本篇文章中,我们将会来使用自签名的方式创建证书,然后使用express框架来搭建https服务器,最后让浏览器或者客户端使用https协议进行访问。 首先我们要生成证书文件: (1)生成私钥key文件(下面的pathway表示你要保存的文件路径位置) opens...
之前我们在安装完Node.js后直接写了个HelloWorld网站,这次呢,我们使用Node.js的Web框架Express来重写一下HelloWorld,看看有什么不同。同时我们还会重写之前的文件服务器,功能更完善而代码更简洁。 安装 express 为了重写我们的HelloWorld,我们需要安装Express模块。Express基于Node.js的一个Web框架,官方网站在这里:http://expressjs.com/。官网对Express的介绍是:Fast, unopinionated, minimalist web framework for Node...
在微信项目的开发的时候,经常需要对微信jssdk提供的接口进行调试,比如说录音, 分享 ,上传图像等接口,但是微信jssdk要求绑定安全域名才能使用其提供的一系列功能 , 而在开发环境中使用localhost或者本地ip无法完成域名的认证和绑定, 所以无法在本地调试 。当然有一种迫不得已方法 ,就是在本地开发完 ,打包发到公司的测试服务器上 ,利用测试服务器认证后的域名进行调试,每次改动,调试都要发一遍测试,显然这种方法非常麻烦且...
- 首先确定此项目在本地能够运行成功 在本地命令行中输入npm run start,无报错,且打开127.0.0.1:3000 有写的路由为/的页面,如图此为文件层级关系 front为前端文件 xk3为后台express与数据库mysql链接的文件 用命令行进入后台并且运行,启动成功这是路径为/的页面在浏览器中输入路径http://localhost:3000/ 浏览器中显示WelCome to express 至此此项目在本地运行成功,我们现在就要放到服务器上。 - 准备工作 此前服务器的基本设...
最近在学习Vue,今天尝试了使用axios模拟本地网络请求。使用的过程中发现接口请求一直404,后来发现在当期的Vue-cli构建的最新的项目中,接口请求应该这样写。 1、引入相关依赖 var axios = require(axios) const express = require(express); var app = express(); var apiRoutes = express.Router(); app.use(/api, apiRoutes);2、处理网络请求 在之前的项目中,我们是在dev-server.js 这样处理接口访问 apiRoutes.get(/getList, f...