5 分钟解决前后端联调问题，说一说前端代理这件事

原创 于 2020-04-17 15:54:20 发布 · 6.5k 阅读 · 23 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#后端 #前端 #程序人生

CloudTookit是一款简洁高效的前端代理工具，能够解决复杂的跨域、多环境及专有云联调难题，实现快速联调，提升开发效率。

简介： 简洁，又能触达痛点的一站式前端代理解决方案，你值得拥有。

作者：寒斜

image.png

说到前端代理，相信每一个做过前后端联调的同学都有遇到过。当下涉及前后端工程项目的研发，主流模式一定是前后端的分离。它让前后端的角色分工更加明确，对项目的研发质量提供了更好的保障。但同时也带来了诸多调试上的不便。

我们这里以 web 开发为例， 前后端工程分开，并且开启了各自的服务，前端的服务主要是为了方便前端开发实时观测所写代码的呈现结果，这里为了保障更加真实的工程效果，我们希望优先走真实的后台接口拿数据，但因为浏览器自身的跨域限制，前端无法直接让从浏览器发起的请求 到达后端的服务器。

image.png

这个时候就必须加入一层代理的能力，帮助我们解决跨域的问题。

image.png

解决的方法很简单，只需要在 webpack 里面配置一下代理的地址，就可以开始前后端联调之旅了。可是……多数情况下，联调的情况往往比单纯的后端给你提供一个 ip 地址要复杂。

你可能要面对这样的情景

情景 1

后端的工程一般需要对接口增加一些限制，像登录认证多数情况下是必不可少的，这时候你直接配置代理的服务地址并发起请求，往往会收到这样的提示：

最低0.47元/天 解锁文章
博客
10分钟速成！在微信公众号增加AI助手的超简单攻略
09-13 4016
在阿里云上，只需 10 分钟即可在您的微信公众号（订阅号）上部署集成一个 AI 智能客服，以便全天候（7x24）回应客户咨询，提升用户体验、增强业务竞争力！按照本方案即可实现0元体验部署（免费试用额度内）、无技术门槛，人人皆可快速上手玩转AI。
博客
福利来了！计算巢支持在已经购买的 ECS 上搭建幻兽帕鲁服务器，支持图形化管理配置
01-31 1063
现在你可以参考这篇教程，将原来搭建的幻兽帕鲁服务器迁移到计算巢上，享受计算巢上所支持的界面化调整游戏配置（死亡掉落、服务器密码等）。或者也可以用于重新安装，升级到最新版本的计算巢幻兽帕鲁服务。
博客
MQTT Broker 规则引擎入门：快速指南
07-11 2045
本文将向您介绍 EMQX MQTT Broker 的规则引擎功能，并阐述其在 MQTT 消息转换和数据集成方面的重要作用。同时，我们还将提供一份快速入门指南，通过实例帮助您快速上手 MQTT 规则引擎。MQTT 是一种高效可靠的消息传输协议，特别适用于低带宽、高延迟网络（在物联网领域十分常见）。在 MQTT 的发布/订阅模型中，MQTT Broker 扮演着关键角色，负责接收发布者发送的消息并将其可靠高效地分发给订阅者，确保消息的顺利传递。
博客
2023 年最适用于工业物联网领域的三款开源 MQTT Broker
07-11 2090
MQTT 最初作为一种轻量级的发布/订阅消息传递协议而设计，如今已经成为工业物联网（IIoT）和工业 4.0 发展的重要基础。它的意义在于实现了各类工业设备与云端的无缝连接，促进了运营技术（OT）和信息技术（IT）的融合。本文对比分析了 2023 年工业物联网领域最优秀的三款 MQTT Broker，介绍了它们的优点、缺点和应用场景。同时，还展示了如何利用这三款 MQTT Broker，为您的工业物联网解决方案打造统一命名空间（UNS）架构。
博客
使用 Terraform 在 GCP 上一键部署 EMQX MQTT Broker
07-11 1651
MQTT 是一种轻量级的消息传递协议，适用于物联网应用实现设备间通信。作为一款主流的开源 MQTT Broker，EMQX 能够提供高扩展性、可靠性和安全性的 MQTT 消息传递服务。借助广泛应用的基础设施即代码（IaC）工具 Terraform，您可以轻松在 GCP 上自动部署 EMQX MQTT Broker，从而简化和规范 MQTT 基础设施的设置和管理。本文将指导您如何设置 GCP 项目、创建服务账户、编写 Terraform 配置文件，实现轻松部署 EMQX MQTT Broker。
博客
MaxCompute中如何处理异常字符
07-11 1700
在处理数据时，当业务数据同步至MaxCompute后，会产生一些含异常字符的脏数据，比如字段中包含了一个不可见字符，在DataWorks中显示不出来，但在BI界面又会显示成其他字符，影响整体观感。这种情况，通常我们的解法是，将异常的字符洗掉，下面来介绍几种常见的处理异常字符的方法。如下图，可以看到“异常name”和“正常name”的 length值 不同，多了个不可见字符，但是我们并不能看出来啥。后期做数据处理或数据展示可能成为一个难以定位的问题。
博客
构建可靠的物联网系统：了解 MQTT 性能测试
07-10 1748
近十年来，物联网迎来了爆炸式的增长。面对海量的设备及其产生的数据，物联网应用和服务变得越来越复杂。我们不仅要保证这些物联网系统的业务功能正确无误，还要保证系统能够支持大量设备之间持续稳定地通信。性能测试是一种检验系统健壮性的方法，它关注扩展性、可用性、可靠性等指标，可以帮助发现系统在正常使用场景下以及在极限使用场景下的表现。对物联网系统进行集成测试和端到端测试，以保证系统功能的正确性，已经是业界的通用做法。因此，我们需要通过性能测试以确保所构建的物联网系统是稳定可靠的。
博客
数据隐私为先：EMQX Cloud BYOC 架构解析
07-10 1535
EMQ 近期推出了 EMQX Cloud BYOC，采用了以数据隐私为先的架构，为解决这些问题提供了一个理想的方案。用户可以在自己的云环境中部署 MQTT 集群，完全掌控自己的数据隐私和安全。随着物联网的飞速发展，保护数据隐私和安全变得愈发重要。构建一个安全、可靠、可扩展的物联网基础设施成为企业的首要任务。本文将深入剖析 EMQX Cloud BYOC 的架构，并探讨它如何保障您的物联网基础设施安全。
博客
谈一谈文件系统的多租户实践
07-10 1726
多租户是云服务的重要属性。通过集群级别调度云服务实例，亦或是机器级别调度来自不同云服务实例的请求，云服务既要保证整个集群的物理资源都得到高效的利用，同时也要保证每个租户都能达到预期的性能指标。
博客
Sparkplug 规范中涉及 MQTT Broker 的 5 个关键概念
07-10 1633
Sparkplug 是一种为 SCADA 系统量身定制的工业物联网通信协议。它为工业设备和应用提供了一种标准的通信格式，实现了不同厂商设备的互操作性。Sparkplug 规范由 Cirrus Link Solutions 和 Eclipse Foundation 共同制定。它是开放的，不属于某一家公司。
博客
对象存储异地多活容灾架构解析
07-07 1709
作为一个分布式的存储，对象存储底层是采用多副本方式实现的，以便在一个可用区内，保证每个写入的对象都有极高的可靠性，其数据可靠性不低于“12个9”、服务设计可用性（或业务连续性）不低于99.995%。虽然硬盘故障、单机异常等情况不会影响到数据可用性和可靠性，但是在面对机房级别故障（如停电、网络异常）或自然灾难（如地震、海啸）等导致的一个数据中心无法提供服务时，使用该数据中心的客户服务还是会受到影响的，因此异地容灾能力不可或缺，当某集群发生异常时，需要快速切换服务，保障业务的可用性。
博客
浅谈对象存储分布式缓存
07-07 1670
下图是用户读取数据的系统路径图，红线部分是键值存储系统直读飞天盘古优化。随着键值存储系统直读飞天盘古功能的上线开通，块数据的读取可以绕过键值存储系统，直接请求飞天盘古系统读取，这在一定程度缩短了数据读取的路径，减少了整体对象存储系统的响应时间，但是同时也使得键值存储系统路径上对数据读取的缓存优化失效，导致飞天盘古的请求压力上升。针对一次对象数据读取，用户请求会通过负载均衡到业务前端系统，业务前端系统通过计算得到对象的块列表并进行遍历，请求键值存储系统获取块数据，最后将读取的块数据有序地返回给用户。
博客
【达摩院OpenVI—通用检测系列之视频目标检测】(ICASSP 2023) 针对流感知的长短支路网络 LongShortNet
07-07 1665
传统视频目标检测（Video Object Detection, VOD）任务以一段视频作为输入，利用视频的时序信息进行目标检测，并最终输出每一帧视频帧的检测结果。其相比图像目标检测（Image Object Detection, IOD）任务，优势在于能够利用视频的时序信息，对运动模糊、图像失焦、遮挡、物体姿态变化等困难的场景具有更强的鲁棒性。然而，传统的VOD和IOD都是离线（offline）的检测，即仅考虑算法的检测精度，未考虑算法的延时。
博客
如何保证分布式文件系统的数据一致性
07-07 3130
分布式文件系统在设计实现的时候面临的一个首要问题是数据一致性，即需要向用户提供一个合理的数据一致性模型（Consistency Model)，这个数据一致性模型成为用户程序和系统之间的一个合约（Contract）。这个合约里的规则保证程序对数据的读写结果是可预期和可理解的。具体到分布式文件系统的客户端，如果没有缓存，数据一致性和多个进程访问本地文件系统的场景是类似的。如共享模式，当客户端打开一个文件时，可以指定被分配的文件句柄在被关闭以前该文件是否允许被再次打开，如果允许，就可以指定允许的请求读写权限。
博客
【OpenVI—论文解读系列】达摩院高清人像美肤模型ABPN CVPR论文深入解读
07-06 1568
相较于互娱场景的磨皮美颜，广告级、影楼级的精细化美肤给算法带来了更高的要求与挑战。另一方面，在去除瑕疵的过程中，需要尽可能的保留皮肤的纹理、质感，实现高精度的皮肤修饰；最后也是十分重要的一点，随着摄影设备的不断迭代，专业摄影领域目前常用的图像分辨率已经达到了4K甚至8K，这对算法的处理效率提出了极其严苛的要求。为此，我们以实现专业级的智能美肤为出发点，研发了一套高清图像的超精细局部修图算法ABPN，在超清图像中的美肤与服饰去皱任务中都实现了很好的效果与应用。
博客
【达摩院OpenVI-视觉评价系列之MOS评价实战篇】手机存储不够用，清理照片太痛苦？MOS评价帮你挑选“垃圾”照片
07-06 1555
传统的主观评价方法需要大量人力和时间成本，使得其在实际应用中受到一定限制。而深度学习模型可以在大规模数据集上进行训练，从而可以在更广泛的场景下进行应用。相比于传统的主观评价方法需要大量受试者进行评估，使用深度学习模型可以大大减少评估时间和人力成本，从而提高评估效率。使用深度学习模型进行评价可以使得评估结果具有可重复性，不会像传统的主观评价方法一样受到个体差异的影响。深度学习模型可以通过训练来学习人类主观评价的规律和模式，从而使得评估结果更加一致和准确。
博客
Seata Saga 模式快速入门和最佳实践
07-06 1579
本文主要介绍 Seata Saga 模式的使用以及最佳实践，围绕三个部分展开，第一部分是 Seata Saga 的简介、第二部分是带大家快速入门，学习怎么使用 Seata Saga 模式，最后一部分将会给大家分享一些 Seata Saga 实践中的经验，帮助用户更快、更好得使用 Seata Saga 模式。Seata 是一款开源的分布式事务解决方案，致力于在微服务架构下提供高性能和简单易用的分布式事务服务。
博客
达摩院|视觉智能AI场景解决方案——AI智慧运动
07-06 1938
由阿里云|达摩院——视觉智能平台推出的新功能AI智慧运动健身/线上体育由摄像头拍摄人像动作视频，通过AI进行图像和实时检测出，识别出人体关键点，检测不规范肢体动作，同时可实现实时反馈和计数。已支持的健身动作有15种，还可支持定制健身动作。主要涉及：肢体动作计数离线SDK；肢体动作计数反馈离线SDK；动作打分离线SDK。【达摩院|视觉智能AI场景解决方案——AI智慧运动】-阿里云开发者社区本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。
博客
阿里云斩获 4 项年度云原生技术服务优秀案例
07-05 1533
云原生是一种基于容器化、微服务等技术的应用开发和部署模式，它可以帮助企业快速构建和部署应用程序，提高应用的可靠性、弹性和可扩展性，让企业可以更加敏捷地响应市场需求，快速上线新产品和服务，提高数字化转型的效率和速度，利用云原生技术架构和理念构建数字化新底座正在成为各行各业数字创新的实践重点。日前，在 ICT 中国·2023 高层论坛-云原生产业发展论坛上，由阿里云容器服务提供技术支持的。两大产品技术方案，共同获得 2023 年度云原生应用实践先锋——云原生技术服务优秀案例。
博客
阿里云携手开放原子开源基金会倡议发起云原生工作委员会，两大开源项目达成捐赠意向
07-05 1488
6月11日，2023开放原子全球开源峰会正式拉开帷幕。本届峰会以“开源赋能，普惠未来”为主题，设置了开幕式暨高峰论坛、20余场分论坛和开源成果及重点项目展览。在峰会主论坛，开放原子开源基金会理事长孙文龙协各家单位共同倡议发起云原生工作委员会。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值