前后端交互的路径怎么来的?后端解决cors问题的一种方法

背景:后端使用node.js搭建,用的是express

前端请求的路径baseURL怎么来的 ?

  • 前后端都在同一台电脑上运行,后端的域名就是localhost,如果使用的是http协议,后端监听的端口号为3000,那么前端请求的基础路径是 'http://localhost:3000' 。
  • 前后端不在同一台电脑上运行,那么localhost应该会变成后端电脑的IP地址,那前端请求的路径就变成了:http://xx.xx.xx.xx:3000 ( xx 都是0-255之间的数字)。

另外,监听的端口号(本文这里是3000)可以由后端自定义。

// index.js
const express = require('express')
const app = express()// 当前端请求的路径为http://localhost:3000/login,后端就会返回 ‘后端接收到了’
app.use('/login', (req,res) => {res.send('后端接收到了')
})// 监听3000端口
app.listen(3000, () => {console.log('start');  
})

  在浏览器中访问‘http://localhost:3000/login’,页面显示如下:

 

关于端口号的设置,需要注意的是,本地的react或vue项目可能默认运行在localhost的某个端口(对于react,可能是3000;对于vue,可能是8080,但这也取决于项目的具体配置和所使用的工具),如果后端也运行在本地时,后端监听的端口号不能和前端的为同一个端口。

后端解决cors跨越问题

前端经常遇到的跨域问题cors,用express搭建的后端只需要添加如下设置即可:

安装cors包

npm install cors
// index.js
...
// 解决跨越
const cors = require('cors')
app.use(cors())
...

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/413080.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Qt 调用MFC dll,动态库中有界面

一、创建MFC 动态库工程 下一步 创建 点击确定 二、创建接口 这个是系统创建的,改成自己的接口。 头文件: #ifndef __WEB_ENGINE__ #define __WEB_ENGINE__#ifdef __cplusplus extern "C" { #endif__declspec(dllexport) bool __stdcall Loa…

10款必备的电脑监控软件推荐,实用又方便!顶尖产品一网打尽!2024纯干货

电脑监控软件目前是企业管理不可或缺的一部分,它们不仅能够帮助企业提升工作效率,还能有效保障信息安全。本文将为您推荐10款2024年必备的电脑监控软件,这些顶尖产品以其强大的功能和便捷的操作,赢得了市场的广泛认可。 接下来&am…

【Python实战因果推断】73_图因果模型8

目录 Adjusting for Selection Bias Conditioning on a Mediator Adjusting for Selection Bias 不幸的是,纠正选择偏倚绝非易事。在我们一直在讨论的例子中,即使有随机对照试验,ATE也无法识别,仅仅是因为你无法在对那些回应了…

前端性能优化--元素类型和dom层级

展示相同布局,使用控制变量法,对比性能差距 1. 结论:用块级元素模拟行内元素时,会有性能浪费,所以能用行内元素的,就不要使用块元素(能用span就不用div) 2. 结论:行内元素模拟块级元素时&…

Feign的原理及概念

1.什么是Feign Feign是Netflix开发的声明式、模板化的HTTP客户端,Feign可帮助我们更加便捷、优雅地调用HTTP API。Feign可以做到使用HTTP请求远程服务时就像调用本地方法一样的体验,开发者完全感知不到这是远程方法,更感知不到这是个HTTP请求…

3.美食推荐系统(Java项目springboot和vue)

目录 0.系统的受众说明 1 绪论 1.1研究背景 1.2研究现状 1.3研究内容 2 系统关键技术 2.1 Springboot框架 2.2 JAVA技术 2.3 MYSQL数据库 2.4 B/S结构 3 系统分析 3.1 可行性分析 3.1.1 技术可行性 3.1.2经济可行性 3.1.3操作可行性 3.2 系统性能分析 3.3 系统功能分析 3.4系统…

c#笔记5 详解事件的内置类型EventHandler、windows事件在winform中的运用

为什么要研究这一问题? 事件和委托可以说是息息相关。 前面先解释了什么是委托,怎么定义一个委托以及怎么使用匿名方法来内联地新建委托。 事实上事件这一机制在c#的程序开发中展很重要的地位,尤其是接触了winform软件开发的同学们应该都知…

基于django的在线音乐网站设计/基于python的音乐播放系统

Django在线音乐网站设计 摘要:计算机网络如果结合使用信息管理系统,能够提高管理员管理的效率,改善服务质量。优秀的在线音乐网站设计能够更有效管理音乐资讯规范,帮助管理者更加有效管理音乐网站,可以帮助提高克服人工…

Linux驱动(一):环境搭建及介绍

目录 前言一、硬件配置及SDK包1.硬件核心芯片2.瑞芯微原厂SDK包 二、环境镜像文件的获取1.镜像文件的组成及启动流程2.获取环境所需的镜像文件2.1 uboot.img2.2 boot.img2.3 rootfs.img2.4 整体编译 三、镜像文件烧录 前言 自用自用自用,晚上睡觉前复盘用。当然&…

8个平面设计必备素材网站,免费下载。

平面设计师应该去哪里找免费可商用素材网站?我推荐这8个,赶紧收藏好。 1、菜鸟图库 菜鸟图库-免费设计素材下载 菜鸟图库是一个非常大的素材库,站内包含设计、办公、自媒体、图片、电商等各行业素材。网站还为新手设计师提供免费的素材&…

查看显卡cuda版本

1.命令行窗口 打开cmd,输入下列语句 nvidia-smi 如下图红框所示: 2.查看cuda版本,打开英伟达控制面板,桌面右键或者系统右下角,然后点击系统信息,之后点击组件

获取当前计算机的处理器架构platform.machine()

【小白从小学Python、C、Java】 【考研初试复试毕业设计】 【Python基础AI数据分析】 获取当前计算机的处理器架构 platform.machine() 选择题 关于以下代码的输出结果说法正确的是? import platform print("【执行】print(platform.machine())") prin…

成都高温限电:当电动汽车「无电可充」

8月末的成都,因为高温限电了。 近几日,成都市气象台连续发布了高温红色预警信号。据新华社报道,8月21日,四川电网用电负荷两次创下历史新高,最高达6797万千瓦,较去年最大用电负荷增长近13%,电力…

代码随想录day1数组/字符串总结

二分法 按左闭右闭的区间处理 适合已经完成排序的,找target数——减少暴力遍历 元素移动类题目 两种方法: 1、双指针 移动规则不同: 移动条件不同\fast一次跳两步,slow一次一步 适合解决元素移动/排序/查找 链表中找环 f…

打手机检测算法源码样本展示打手机检测算法实际应用场景介绍

打手机检测算法是一种利用计算机视觉技术来监测和识别人们在特定区域如驾驶舱、考场或其他敏感区域非法使用手机的行为。这种算法对于提高安全性和确保规则的遵守具有重要意义。以下是关于打手机检测算法源码及其实际应用的详细阐述: 1. 算法实现 - 深度学习框架&a…

【北森-注册安全分析报告-无验证方式导致安全隐患】

前言 由于网站注册入口容易被黑客攻击,存在如下安全问题: 1. 暴力破解密码,造成用户信息泄露 2. 短信盗刷的安全问题,影响业务及导致用户投诉 3. 带来经济损失,尤其是后付费客户,风险巨大,造…

力扣134-加油站(java题解)

题目链接:134. 加油站 - 力扣(LeetCode) 前情提要: 因为本人最近都来刷贪心类的题目所以该题就默认用贪心方法来做。 贪心方法:局部最优推出全局最优。 如果一个题你觉得可以用局部最优推出全局最优,并…

源代码编译,Apache DolphinScheduler前后端分离部署解决方案

转载自神龙大侠 生产环境部署方案 在企业线上生产环境中,普遍的做法是至少实施两套环境。 测试环境线上环境 测试环境用于验证代码的正确性,当测试环境验证ok后才会部署线上环境。 鉴于CI/CD应用的普遍性,源代码一键部署是必要的。 本文…

【王树森】RNN模型与NLP应用(7/9):机器翻译与Seq2Seq模型(个人向笔记)

Machine Translation Data 做机器学习任务的第一步都是处理数据,我们首先需要准备机器翻译的数据。由于我们是学习用途,因此拿一个小规模数据集即可:http://www.manythings.org/anki/下面的数据集中:一个英语句子对应多个德语句子…

Sinc Function介绍

1、定义 Sinc函数全称:sine cardinal,也称作是sampling function(采样函数)。 2、分类 (1)归一化sinc函数: 这种定义在信号处理中被广泛采用,其中 x 是一个无量纲的变量,…