当前位置:首页 > 网络技术 > express跨域设置(express解决跨域问题)(express允许跨域)

express跨域设置(express解决跨域问题)(express允许跨域)

longge@20222022-03-24 01:47:54网络技术174

一、安装express库和生成器

打开cmd输入命令: yarn global add express express-generator

解释: 上面里两个模块分别表示库和生成器,在express3时,安装express会自动的给你安装生成器express-generator ,但是在express4时,他们就被分开了,所以需要分别安装。

安装好后可以通过命令:express –version 检查是否安装成功。

出现版本号即为安装成功(如下图所示)。

二、express生成器自动创建express项目

输入命令:express nodejs(如下图所示即为成功)

成功之后的目录:

三、跳转到package.json目录下安装相关的包

输入命令: yarn 或者 cnpm i 或者 npm i

四、启动项目

输入命令:npm run start

打开浏览器,访问127.0.0.1:3000就能获取访问我们的项目了

五、项目目录解释

bin:存放可执行文件

public:存放js、css、img等文件

router:存放路由文件

views:存放视图文件或者说模版文件

app.js:启动文件(入口文件)

package.json:存储着工程的信息及模块依赖,当在 dependencies 中添加依赖的模块时,运行 npm install,npm 会检查当前目录下的 package.json,并自动安装所有指定的模块

node_modules:存放 package.json 中安装的模块,当你在 package.json 添加依赖的模块并安装后,存放在这个文件夹下

参考链接:
www.cnblogs.com/shimily/art…

六、在此项目中如何开发

首先在routes中新建一个test.js文件

var express = require('express');
var router = express.Router();

router.get('/', function (req, res, next) {
	res.send('我是接口返回值');
});

module.exports = router;
复制代码

然后在app.js中加入下面代码

var testRouter = require(‘./routes/test’);

app.use(‘/test’, testRouter);

然后打开浏览器控制台用fetch请求我们刚才写的接口

fetch('http:localhost:3000/test')
.then(res=>{
  return res.text()
}).then(res=>{
  console.log(res)
})
复制代码

我们发现出现了跨域问题,这是因为我们在nodejs中没有添加跨域所导致的。

将下面的跨域的代码添加到app.js中

//设置跨域访问(设置在所有的请求前面即可)
app.all("*", function (req, res, next) {
	//设置允许跨域的域名,*代表允许任意域名跨域
	res.header("Access-Control-Allow-Origin", "*");
	//允许的header类型
	res.header("Access-Control-Allow-Headers", "content-type");
	//跨域允许的请求方式 
	res.header("Access-Control-Allow-Methods", "DELETE,PUT,POST,GET,OPTIONS");
	if (req.method == 'OPTIONS')
		res.sendStatus(200); //让options尝试请求快速结束
	else
		next();
});
复制代码

然后重启一下项目,这样就可以正常访问了

在项目中修改了内容就需要我们手动重启项目,有点麻烦,我们再安装一个插件即可解决这个烦恼。

七、使用nodemon自动重启服务

  1. 安装nodemon模块

输入命令:npm i nodemon -S

  1. 创建nodemon.json文件

在项目的根目录下创建:nodemon.json文件

{
	"restartable": "rs",
	"ignore": [".git", ".svn", "node_modules/**/node_modules"],
	"verbose": true,
	"execMap": {
		"js": "node --harmony"
	},
	"watch": [],
	"env": {
		"NODE_ENV": "development"
	},
	"ext": "js json njk css js "
}

复制代码
  1. 使用nodemon模块

在你的package.json文件中,添加一行脚本代码

“dev”: “nodemon ./bin/www”

免责声明
本站部分资源来源于互联网 如有侵权 请联系站长删除
龙哥网是优质的互联网科技创业资源_行业项目分享_网络知识引流变现方法的平台为广大网友提供学习互联网相关知识_内容变现的方法。

“express跨域设置(express解决跨域问题)(express允许跨域)” 的相关文章

CSS3实现歌词进度文字颜色填充变化动态效果

CSS3实现歌词进度文字颜色填充变化动态效果

播放音乐时,歌词会随歌曲的进度逐渐填充颜色,不是逐字改变颜色,而是从左向右横向逐个像素改变的,也就是说会出现一个字的左右两边是不同颜色的效果。 这个效果通过CSS3可以实现。 实...

老域名质量好坏判断维度(99%零基础的你也能学会)

老域名质量好坏判断维度(99%零基础的你也能学会)

  最近有客户问这个问题:买二手域名这么判断域名好坏?新域名注册有哪些需要注意的事?  今天我们就来谈谈如何判断一个域名的好坏?  一、域名后缀  千万别贪好记而选择一些非主流域名,那些域名实际上除了...

芜小娴第八期绘本插画创作基础班(龙哥网)

芜小娴第八期绘本插画创作基础班(龙哥网)

课程介绍“插画在中国被人们俗称为插图。今天通行于国外市场的商业插画包括出版物配图、卡通吉祥物、影视海报、游戏人物设定及游戏内置的美术场景设计、广告、漫画、绘本、贺卡、挂历、装饰画、包装等多种形式。延伸...

Java如何通过反射获取私有构造、私有对象、私有字段、私有方法_java(java反射可以获取私有方法吗)

Java如何通过反射获取私有构造、私有对象、私有字段、私有方法_java(java反射可以获取私有方法吗)

Java反射获取私有构造、私有对象、私有字段、私有方法 1. 创建测试的私有对象 /** * @author lirong * @desc 测试对象 * @date 2019...

详解Jmeter线程组的设置方法_java(jmeter线程组设置技巧)

详解Jmeter线程组的设置方法_java(jmeter线程组设置技巧)

目录 一、事件背景 二、关于线程组的相关设置 一、事件背景 个人感觉自己做性能测试,可以说是轻车熟路了,而且工作多年一直都是这一套测试思路及体系,从未质疑过自己,也许是...

Kotlin与Java相互调用的完整实例_Android(java调用kotlin方法)

Kotlin与Java相互调用的完整实例_Android(java调用kotlin方法)

目录 一、Kotlin 调用 Java 二、Java 调用 Kotlin 附 Github 源码: 总结 一、Kotlin 调用 Java 1. kotlin...