express使用cros开启跨域访问

简介: express使用cros开启跨域访问

如果跨域,前端直接请求后端数据会报错

Access to XMLHttpRequest at 'http://127.0.0.1:8080/' 
from origin 'null' has been blocked by CORS policy: 
No 'Access-Control-Allow-Origin' header is present on the requested resource.

项目结构

├── index.html

├── index.js
└── package.json

package.json

{
"dependencies": {
"cors": "^2.8.5",
"express": "^4.17.1"
}
}

index.js

var express = require('express')
var cors = require('cors')
var app = express()

app.use(cors())

app.get('/', function (req, res) {
res.send("hello")
})

app.listen(8080, function () {
console.log('listening: http://127.0.0.1:8080/')
})

index.html

<script>
var request = new XMLHttpRequest();
request.open('GET', 'http://127.0.0.1:8080', true)
request.send(null)
request.onreadystatechange = function () {
if (request.readyState == 4 && request.status == 200) {
console.log(request.responseText);
}
}
</script>

通过以上代码就可以正常请求获取后台数据了

            </div>
目录
相关文章
|
运维 搜索推荐 数据安全/隐私保护
什么是C端 什么是B端 这里告诉你
C端产品早已将运营专业化,并细化到各维度的运营了,比如运营的工种可以细分为“活动运营岗、用户运营岗、增长裂变岗、内容运营岗”等等。
18247 0
什么是C端 什么是B端 这里告诉你
利用python淘宝/天猫获得淘宝app商品详情原数据 API
要使用Python获取淘宝/天猫商品详情原数据,需先注册开放平台账号并实名认证,创建应用获取API权限。随后,根据API文档构建请求URL和参数,使用requests库发送请求,处理返回的商品详情数据。注意遵守平台使用规则。
|
JavaScript 前端开发 UED
JS 防抖与节流
防抖和节流是优化高频事件处理的技术。针对如`scroll`、`resize`等频繁触发的事件,它们能有效减少不必要的回调执行,节省资源。防抖确保在一段时间内仅执行最后一次操作,适用于输入框自动补全等场景;而节流则按固定间隔执行函数,适合拖拽、滚动事件。通过简单的JavaScript实现,可以显著提升应用性能和用户体验。
334 1
JS 防抖与节流
|
SQL 数据管理 Java
C#宿舍管理系统(C#课程设计含源码)
C#宿舍管理系统(C#课程设计含源码)
405 0
C#宿舍管理系统(C#课程设计含源码)
|
SQL 索引
ElasticSearch分页
es有多种方式实现分页查询:from+size,scroll,searchAfter,本文讨论各种方式的利弊和适用场景。
911 0
|
网络协议 安全 Linux
在Linux中,如何使用Netcat进行网络调试和端口扫描?
在Linux中,如何使用Netcat进行网络调试和端口扫描?
|
存储 Linux
在Linux中,如何在Linux中设置磁盘配额?
在Linux中,如何在Linux中设置磁盘配额?
|
编译器 API C语言
在x86架构汇编语言中函数参数传递的三种约定
在x86架构汇编语言中函数参数传递的三种约定
682 2
|
SQL 数据库管理
|
弹性计算 网络虚拟化 Perl
全景剖析阿里云容器网络数据链路(五)—— Terway ENI-Trunking
本文是[全景剖析容器网络数据链路]第五部分部分,主要介绍Kubernetes Terway ENI-Trunking模式下,数据面链路的转转发链路。
1216 7
全景剖析阿里云容器网络数据链路(五)—— Terway ENI-Trunking