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>
目录
相关文章
|
NoSQL Linux 开发工具
Linux终端革命:掌握这些命令,让工作速度飞跃提升!
本文介绍了Linux命令行操作效率提升的关键技巧,包括光标移动快捷键、Vim编辑器的高效使用、快速切换目录、跨服务器文件拷贝等。通过掌握`Ctrl + a`、`Ctrl + e`等快捷键可加快命令编辑;Vim的`:set nu`、`:20`等命令能提升文本编辑速度;`cd -`命令可在最近访问过的目录间快速切换;利用`nc`或`python -m SimpleHTTPServer`可实现在无密码权限时的文件传输。这些技巧帮助用户提高工作效率,简化日常工作流程。
435 1
|
12月前
|
开发工具 Python
赛博宝剑铭文铸造技术_批量替换_vim
赛博宝剑铭文铸造技术_批量替换_vim
|
边缘计算 物联网 5G
4G 网络跟 5G 的区别
4G 网络跟 5G 的区别
905 0
|
机器学习/深度学习 算法 搜索推荐
【机器学习】十大算法之一 “KNN”
KNN(k-nearest neighbors)算法是一种监督学习算法,也是机器学习中比较基础的算法之一。它主要应用于分类和回归。KNN算法的基本思想是在训练集中搜索k个距离测试样本最近的样本,并对这些邻居样本中的大多数进行分类或回归。KNN算法是一种非参数算法,不需要对数据分布进行任何假设,具有很强的鲁棒性和普适性。KNN算法可以用于图像识别、语音识别、推荐系统等常见的机器学习应用领域。KNN算法在实际应用中具有很高的可扩展性,几乎可以应用于任何领域。
1310 0
【机器学习】十大算法之一 “KNN”
|
安全 网络安全 API
网络安全的守护者:漏洞、加密与意识的三重奏
【8月更文挑战第27天】在数字世界的交响乐中,网络安全扮演着至关重要的角色。本文将带您深入探索网络安全的三大支柱:漏洞、加密技术和安全意识。我们将从基础概念出发,逐步揭示这些元素如何共同构建起一道坚固的防线,以保护个人和组织的信息安全。通过深入浅出的分析,您将了解如何识别和应对网络威胁,以及如何通过提高安全意识来加强防御。
终于学完阿里架构师推荐413页微服务分布式架构基础与实战笔记
目前,Spring Boot+Spring Cloud架构已经成为Java程序员的必备技能之一,刚开始学习时看到琳琅满目的Spring全家桶,可能会感到无从下手。如果只了解微服务中的各知识点,而忽略了以微服务分布式架构的方式学习系统的架构顺序,初学者可能就不知道如何使用微服务构建分布式系统。为了使读者更快掌握Spring Boot+SpringCloud的基础知识与架构方法,本文的章节顺序即应用系统的架构顺序。
|
移动开发 运维 前端开发
HTML5 + CSS3 列表 表格 媒体元素学习笔记(四)
HTML5 + CSS3 列表 表格 媒体元素学习笔记(四)
166 0
HTML5 + CSS3 列表 表格 媒体元素学习笔记(四)
|
JavaScript 前端开发
重学Vue【getter_依赖收集】
重学Vue源码,根据黄轶大佬的vue技术揭秘,逐个过一遍,巩固一下vue源码知识点,毕竟嚼碎了才是自己的,所有文章都同步在 公众号(道道里的前端栈) 和 github 上。
270 0
|
Shell 开发工具
mac添加bash_profile环境变量
mac添加bash_profile环境变量
111 0