express搭建后端请求路由,前端进行访问对应的接口 后端解决跨域
代码在 ==》E:\nodes实战\myserve\testserve
1 express搭建后端请求路由,前端进行访问对应的接口
1) 创建项目目录
express 项目名 -e
然后按照提示就可以了
cd 项目名
2) 进入项目 下载依赖
cnpm i
在下载过程中出现
New minor version of npm available! 6.11.2 -> 6.13.1
Changelog: https://github.com/npm/cli/releases/tag/v6.13.1
Run npm install -g npm to update! (运行npm install-g npm进行更新!)
跟新就可以了
3) 在app.js 中 在(module.exports = app;前添加)就是在第40行 添加如下,监听端口
app.listen(666, () => {
console.log('后端服务器启动成功,地址是: http://127.0.0.1:666')
})
4) 启动项目
nodemon app
然后输入 http://127.0.0.1:666 就会出现界面
介绍一下后端的项目目录
bin
public
routes 路由接口
views
app.js文件
package.json 包描述文件 复制一份routes下的users.js文件,用来做account的请求 然后命名为account.js文件如下
{
var express = require('express');
var router = express.Router(); // 统一设置响应头 解决跨域问题
router.all("*", (req, res, next) => {
// 设置响应头 解决跨域(目前最主流的方式)
res.header("Access-Control-Allow-Origin", "*");
res.header("Access-Control-Allow-Headers", "authorization");
next();
}); /* GET users listing. */
router.get('/', function(req, res, next) {
res.send('解决了跨域哈');
}); module.exports = router; } 然后再app.js中去 给/test分配一个路由
vvar accountRouter = require('./routes/account'); //分配路由 在地10行
app.use('/account',accountRouter ); //使用路由 在第28行 然后在页面输入http://127.0.0.1:666/account
就会出现 解决了跨域哈 说明路由配置成功
前端
created() {
axios
.get("http://127.0.0.1:666/account")
.then(res => {
this.mesg = res.data;
window.console.log(res.data);//解决了跨域哈
})
.catch(err => {
window.console.log(err);
});
}
express搭建后端请求路由,前端进行访问对应的接口 后端解决跨域的更多相关文章
- 前端页面调用Spring boot接口发生的跨域问题
最近要重构一个基于spring boot的后端API服务,需要再本地测试.在本地测试时,运行在本地的前端页面发送一个ajax请求访问后端API,然后浏览器报错blocked CORS policy. ...
- vue访问外部接口设置代理,解决跨域(vue-cli3.0)
vue-cli3.0搭建的项目,平时访问内部接口配置了拦截器,今天需要调用天气预报的外部接口,发现跨域问题,通过配置代理解决. 1.在vue.config.js中配置代理 module.exports ...
- 前台主页搭建、后台主页轮播图接口设计、跨域问题详解、前后端互通、后端自定义配置、git软件的初步介绍
今日内容概要 前台主页 后台主页轮播图接口 跨域问题详解 前后端打通 后端自定义配置 git介绍和安装 内容详细 1.前台主页 Homeviwe.vue <template> <di ...
- Vue使用Axios实现http请求以及解决跨域问题
Axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中.Axios的中文文档以及github地址如下: 中文:https://www.kancloud.cn/y ...
- 无需CORS,用nginx解决跨域问题,轻松实现低代码开发的前后端分离
近年来,前后端分离已经成为中大型软件项目开发的最佳实践. 在技术层面,前后端分离指在同一个Web系统中,前端服务器和后端服务器采用不同的技术栈,利用标准的WebAPI完成协同工作.这种前后端分离的&q ...
- nginx 前后端分离 代理转发,解决跨域问题
场景 适用于公司有前端,项目采用前后端分离.类似于我们 后端 springboot 提供接口,前端专门写html调用相应的接口,解决跨域问题 配置说明 worker_processes 1; even ...
- Ajax 调用webservice 解决跨域请求和发布到服务器后本地调用成功外网失败的问题
webservice 代码 /// <summary> /// MESService 的摘要说明 /// </summary> [WebService(Namespac ...
- 【手摸手,带你搭建前后端分离商城系统】02 VUE-CLI 脚手架生成基本项目,axios配置请求、解决跨域问题
[手摸手,带你搭建前后端分离商城系统]02 VUE-CLI 脚手架生成基本项目,axios配置请求.解决跨域问题. 回顾一下上一节我们学习到的内容.已经将一个 usm_admin 后台用户 表的基本增 ...
- 前端笔记之服务器&Ajax(下)数据请求&解决跨域&三级联动&session&堆栈
一.请求后端的JSON数据 JSON是前后端通信的交互格式,JSON(JavaScript Object Notation, JS 对象标记) 是一种轻量级的数据交换格式. JSON是互联网各个后台与 ...
随机推荐
- spinand之data buffer
data buffer简介 spinand一般会有一个内置的data buffer. 以W25N01GV为例,一个page是2048bytes外加64bytes的spare数据,其data buffe ...
- Spring Boot 2.X(十三):邮件服务
前言 邮件服务在开发中非常常见,比如用邮件注册账号.邮件作为找回密码的途径.用于订阅内容定期邮件推送等等,下面就简单的介绍下邮件实现方式. 准备 一个用于发送的邮箱,本文是用腾讯的域名邮箱,可以自己搞 ...
- markdown简单使用
Markdown介绍: Markdown是一种轻量级标记语言,它允许人们使用易读易写的纯文本格式编写文档.使用Markdown编写的文档可以导出为HTML.Word.图像.PDF等多种格式的文档. ...
- 龙芯(mips64)电脑安装NodeJS
背景 龙芯是国产的cpu,采用是mips架构,就类似大家熟知的x86.arm. 最近在一台龙芯电脑(系统是中兴新支点,Linux)上调试前端应用(electron),于是就需要安装NodeJS. 但是 ...
- iOS中UICollectionView添加头视图
参考链接:https://www.jianshu.com/p/ef57199bf34a 找了一堆的博客,写的都少了很重要的一步. //引入头部视图 -(UICollectionReusableView ...
- Android 无源码smail进行debug
待调试项目在AndroidManifest.xml中debugable=true 参照此处:https://blog.csdn.net/ausboyue/article/details/8018918 ...
- SpringCloud之Feign:REST客户端
在Spring Cloud集群中,各个角色的通信基于REST服务,在调用服务时,需要使用REST客户端,常用,除了使用Spring自带的RestTemplate,也可使用另一个REST客户端:Feig ...
- VS2017无法打开Razor视图文件提示:引发类型"System.Exception"异常
背景介绍 由于电脑装了R#(吃内存大户),导致VS2017打开项目慢以及卡顿,因此在扩展和更新这个功能里面将没用的插件关闭了,导致.NET CORE的Razor视图文件打不开(真心是一脸懵逼,关个插件 ...
- python 基础学习笔记(5)--文件操作
**python 的文件操作** - [ ] 使用python来读写文件是非常简单的操作,我们使用open()来打开一个文件,获取到文件的语柄,然后通过文件语柄就可以进行各种各样的操作了. - [ ] ...
- 正确设置越狱版ios的终端编码--命令行中文的处理
本文是针对越狱版iPhone手机的,手机没有越狱就别看了,看了也没办法用. 越狱版的iPhone当然是为了跟电脑一样做各种有趣的事情的. 但通常越狱的iPhone在命令行都无法处理中文,比如你的播放器 ...