现金凯发·k8国际app平台handleData 函数被调用-凯发k8首页(中国)官方网站登录入口

在前端建设中，常常会遭受一个问题：跨域央求。

比如，你的网页在 https://example.com，思央求 https://api.other.com/data 的数据，径直用 XMLHttpRequest 或 fetch 会报错：“跨域央求被间隔”。

这时刻，有一个陈旧但经典的处理决议——JSONP（JSON with Padding），天然当代更多东说念主用 CORS，但分解 JSONP 的旨趣对入门者掌抓跨域知知趣配有匡助。

一、为什么会有跨域问题？

浏览器的同源政策（Same-Origin Policy）法度：

条约、域名、端口必须皆同样，网页才能目田探员接口数据

不恰当要求就算跨域。

页面 URL：https://example.com央求接口：https://api.other.com/data → 不同域名 → 跨域

跨域为止是浏览器为了安全，驻守坏心网站窃取数据。

二、JSONP的中枢旨趣

JSONP的旨趣很好意思妙：愚弄 <script> 标签不受跨域为止的特色。

<script src="..."></script> 不错加载自便域名的剧本。后端复返一段 函数调用代码，把数据手脚参数传入。浏览器实行这段代码，就能得到数据。

流露图：

三、JSONP央求的门径

1. 前端：动态创建 <script> 标签

2. 后端：复返 JavaScript 函数调用

假定接口复返的数据是：

浏览器实行时，handleData 函数被调用，数据就得手了。

四、JSONP的优污点

优点

跨域才调强：接济悉数域，不受浏览器为止。简短完了：前端只需动态创建 <script>，后端包装数据即可。

污点

只接济 GET 央求：弗成用 POST。安全性低：复返的是可实行代码，容易被注入坏心剧本。回调函数管束复杂：多个 JSONP 央求可能打破，需要动态生成回调名。

五、当代替代决议

CORS（Cross-Origin Resource Sharing）：后端通过反馈头允许跨域探员，接济 GET、POST 等央求。代理奇迹器：通过同源奇迹器转发央求，前端仍然是同源。

天然 JSONP 是“老技巧”，但学习它能帮你分解 浏览器同源政策、跨域为止以及动态剧本加载旨趣。

六、归来

JSONP 愚弄 <script> 标签跨域才调完了数据央求。前端提供回调函数，后端复返调用该函数的数据。当代建设中，JSONP 迟缓被 CORS 或代理替代，但分解旨趣仍很有价值。

💡一句话归来：JSONP = 愚弄剧本跨域加载 + 回调函数获得数据的“陈旧好意思妙决议”现金凯发·k8国际app平台