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是互联网各个后台与 ...
随机推荐
- elasticSearch的部署和使用
部署服务 docker run启动elastic服务 docker pull elasticsearch:6.7.2 docker run -d -p 9200:9200 -p 9300:9300 - ...
- 白话 MVC、MVP、MVVP
白话 MVC.MVP.MVVP 注意这里单纯的通过例子来讲解 MVC MVP MVVP 这三种架构模式的起源和作用,不牵扯某种特定的语言.具体到各种语言各种软件系统上体现有所不同,但是原理都是这样的. ...
- iOS---------金额转大写
-(NSString *)digitUppercase:(NSString *)numstr{ double numberals=[numstr doubleValue]; NSArray *numb ...
- linux下通过命令连接wifi
故事背景:我司是做新零售的,机器支持4G.wifi.网线,可能会涉及到网络的切换和连接 项目需求:用户在web端输入wifi名称和密码,客户端可以通过服务端下发的信息进行连接 技术调研:之前提到过nm ...
- Linux系统学习 十九、VSFTP服务—虚拟用户访问—为每个虚拟用户建立自己的配置文件,单独定义权限
为每个虚拟用户建立自己的配置文件,单独定义权限 可以给每个虚拟用户单独建立目录,并建立自己的配置文件.这样方便单独配置权限,并可以单独指定上传目录 1.修改配置文件 vi /etc/vsftpd/vs ...
- day97_11_29
一.数据存储到mongodb 爬取的数据如果需要存储到mongodb中,要通过item,定义一个存储类.再yield一个类. 数据存储的时候需要进过pipelines,再到setting中配置. fr ...
- 【安富莱】RTX嵌入式操作系统教程发布,支持F103,F407和F429,含81个配套例程(2017-10-17)
前言说明:1. 首先感谢大家对我们安富莱电子一年来的支持,2016年我们会再接再厉推出更好的教程. 2. 估计也有网友会问RTX的优势在那里,针对这个问题,教程中第一章分为6条专门回答了这个问题,有兴 ...
- 易优CMS:arclist 文档列表
arclist 文档列表(配合arcpagelist标签可实现ajax瀑布流分页) [基础用法] 名称:arclist 功能:获取系统主从表模型(如:文章.软件.图集.产品等)的一列文档,也称自由列 ...
- Mysql - 开发技巧(二)
本文中的涉及到的表在https://github.com/YangBaohust/my_sql中 本文衔接Mysql - 巧用join来优化sql(https://www.cnblogs.com/dd ...
- Linux介绍以及VMware和Centos的安装
一. Linux介绍 1 Linux诞生的故事 Unix篇: 为了进一步强化大型主机的功能,让主机的资源可以提供更多的使用者来利用,所以在1964年, 由AT&A公司的贝尔实验室(Bell). ...