JSONP 原理

HTML 中 script 标签可以加载其他域下的js,比如我们经常引入一个其他域下线上cdn的jQuery。那如何利用这个特性实现从其他域下获取数据呢?

可以先这样试试:

<script src="http://api.jirengu.com/weather.php"></script>

这时候会向天气接口发送请求获取数据,获取数据后做为 js 来执行。 但这里有个问题, 数据是 JSON 格式的数据,直接作为 JS 运行的话我如何去得到这个数据来操作呢?

这样试试:

<script src="http://api.jirengu.com/weather.php?callback=showData"></script>

这个请求到达后端后,后端会去解析callback这个参数获取到字符串showData,在发送数据做如下处理:

之前后端返回数据: {"city": "hangzhou", "weather": "晴天"}

现在后端返回数据: showData({"city": "hangzhou", "weather": "晴天"})

前端script标签在加载数据后会把 「showData({“city”: “hangzhou”, “weather”: “晴天”})」做为 js 来执行,这实际上就是调用showData这个函数,同时参数是 {“city”: “hangzhou”, “weather”: “晴天”}。

用户只需要在加载提前在页面定义好showData这个全局函数,在函数内部处理参数即可


更多专业前端知识,请上 【猿2048】www.mk2048.com

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

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

相关文章

最长公共前缀(lca+trie树)

问题描述 给出一些串&#xff0c;多组询问求两个串的最长公共前缀。字符串总长 < 10^6。 输入格式 第一行一个整数n&#xff0c;表示字符串的个数。 接下来n行&#xff0c;每行一个字符串&#xff08;字符串不含空格&#xff09;。 第n2行一个整数m&#xff0c;表示询问总数…

vue笔记(三)生命周期、组件(嵌套)、数据传递

生命周期文档 一、生命周期 1、参考一 2、参考二 二、自定义组件 1. 使用&#xff1a;<组件名></组件名> 2. 定义组件&#xff1a; &#xff08;1&#xff09;方法一&#xff1a;官网 let 组件变量名 Vue.extend({template:<div class"header"&…

实用程序类的OOP替代

实用程序类&#xff08;也称为帮助程序类&#xff09;是仅具有静态方法且不封装任何状态的“结构”。 StringUtils &#xff0c; IOUtils &#xff0c; FileUtils从Apache的共享 ; Guava的 Iterables和Iterators以及JDK7的Files是实用程序类的完美示例。 这种设计思想在Java世…

神州泰岳2050万元收买并增资奇点国际

网易科技讯 3月7日消息&#xff0c;神州泰岳来日诰日颁布发表关照公告&#xff0c;将经由股权让渡体例共付出1450万元股权让渡款获得奇点国际100%股权&#xff0c;同时神州泰岳与邵起明分别出资600万元、200万元对奇点国际举行增资。本次增资后&#xff0c;奇点国际注册资金增进…

Vue 状态管理 Vuex

1、概述 Vuex作为插件&#xff0c;管理和维护整个项目的组件状态。 2、安装vuex cnpm i --save vuex 3、vuex使用 github地址&#xff1a;https://github.com/MengFangui/Vuex new Vue({el: #app,router: router,//使用vuexstore: store,render: h > {return h(App)}}); …

拯救你丢失的精度——BigInteger和BigDecimal类(入门)

第三阶段 JAVA常见对象的学习 BigInteger和BigDecimal类 BigInteger类 (一) 构造方法&#xff1a; //针对超过整数范围的运算(整数最大值&#xff1a;2147483647) BigInteger(String val) (二) 常用方法&#xff1a; //加 public BigInteger add(BigInteger val) //减 public…

vue笔记(四)注册组件,路由,vuex

官网 一、项目中的组件注册 二、路由 三、vuex 一、项目中的组件注册 1. 全局 import Loading from /components/loading;//封装的loading组件 Vue.component(Loading,Loading);2. 局部 <loading/>important loading from ./components/loadingcomponents:{loading}二…

#102030:在30天内运行20 10K,庆祝Java 20年

1995年5月23日是技术史上的重要时刻。 业界似乎并没有意识到当天发布的语言会在未来几年内完全改变技术的格局。 Java将在今年的同一天庆祝20岁生日。 Java 20年&#xff0c;哇&#xff01; 回顾20年前的存储器时代&#xff0c;思考一下Java的发明时间/方式。 万维网专用于精…

Java第二次实训

/*3、按要求编写一个Java应用程序&#xff1a; &#xff08;1&#xff09;定义一个类&#xff0c;描述一个矩形&#xff0c;包含有长、宽两种属性&#xff0c;和计算面积方法。 &#xff08;2&#xff09;编写一个类&#xff0c;继承自矩形类&#xff0c;同时该类描述长方体&am…

vue笔记(一)基本使用、数据检测

vue 官网 Vue (读音 /vjuː/&#xff0c;类似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是&#xff0c;Vue 被设计为可以自底向上逐层应用。 一、基本使用 二、数据检测 一、Vue的思想 MVC【参考 nd的博客园】&#xff1a; 名称描述M&#xff08;…

Hazelcast入门指南第2部分

本文是我开始以Hazelcast &#xff08;分布式内存数据库&#xff09;为特色的系列文章的继续。 如果尚未阅读第一篇文章&#xff0c;请单击此处 。 分布式馆藏 Hazelcast具有许多可用于存储数据的分布式集合。 以下是它们的列表&#xff1a; 清单 我设置 队列 清单 IList是…

防止DISCUZ根域名跳转到forum.php的方法

症状&#xff1a;输入http://www.sn03.com/跳转到www.cn03.com/forum.php&#xff0c;这样有两个不好&#xff0c;1、用户复制时不利于传播&#xff0c;2、两个页面内容的重复对搜索引擎排名不利&#xff0c;如何取消这个呢&#xff1f; 全局-域名设置-应用域名-默认&#xff1…

Hazelcast入门指南第1部分

介绍 我将在Hazelcast上做一个系列。 我从Twitter了解了该产品。 他们决定跟随我&#xff0c;经过对他们所做工作的研究后&#xff0c;我决定跟随他们。 我在推特上说&#xff0c;Hazelcast将是分布式密码破解者的重要Struts。 这引起了一些兴趣&#xff0c;我决定加入一个。 H…

Vue 组件与复用

&#xff08;1&#xff09;全局注册 <!DOCTYPE html><html lang"zh"><head><meta charset"UTF-8" /><title>Vue</title></head><body><div id"app"><my-component></my-compone…

js笔记(二)数组、对象、this

大标题小节一、数组1. 数组的创建、赋值、分类&#xff1b;2. 数组的简单操作&#xff08;根据索引增、查、改&#xff09;&#xff1b;3. 声明式和构造函数创建的数组的区别&#xff1b;4.数组的方法&#xff1a;push()、unshift()、splice()、pop()、shift()、slice()、sort(…

Oracle SYSAUX 表空间 说明

一. SYSAUX 说明 在Oracle 10g 版本中&#xff0c;引入了SYSTEM表空间的一个辅助表空间&#xff1a; SYSAUX表空间。 SYSAUX 表空间存放一些其他的metadata组件&#xff0c;如OEM,Streams 等会默认存放在SYSAUX表空间里。这样也能降低SYSTEM表空间的负载。 因此SYSAUX 表空间也…

JAXB –新手的观点,第2部分

在本系列的第1部分中&#xff0c;我讨论了使用JAXB和JPA将数据从XML文件加载到数据库中的基础知识。 &#xff08;如果需要使用JSON而不是XML&#xff0c;则相同的想法应转化为类似Jackson的工具。&#xff09;该方法是使用共享域对象-即&#xff0c;一组带有描述XML映射和关系…

[C++Primer] 第二章 变量和基本类型

第二章 变量和基本类型 引用 引用定义的时候必须初始化。引用初始化之后无法重新绑定到其它对象上。引用本身并不是对象&#xff0c;所以没有指向引用的引用&#xff08;不管如何多层引用&#xff0c;引用的还是源对象&#xff09;下面用一个简单的例子说明&#xff1a; int a1…

VUE v-bind绑定class和style

1、绑定class &#xff08;1&#xff09;对象语法 <!DOCTYPE html><html lang"zh"><head><meta charset"UTF-8" /><title>vue示例</title></head><body><div id"app"><div class&quo…

js笔记(四)内置对象Math和Date()、浏览器对象模型BOM

大标题小标题备注一、内置对象Math、Date()1. Math 数学对象;2. Date() 日期对象;常用的数学对象&#xff1a;Math.PI、abs(n)、round(n)、random()、floor(n)、ceil(n)、pow(x,y)、sqrt(n)、min(3,4,5,6)、max()、sin(弧度)、cos()、tan()&#xff1b;获取日期&#xff1a;get…