Mithril jsonp(options)

jsonp(options)

描述

发送 JSON-P 请求。通常,用于与没有开启 CORS,但允许 JSON-P 的服务器进行交互。

m.jsonp({
    url: "/api/v1/users/:id",
    data: {id: 1},
    callbackKey: "callback",
})
.then(function(result) {
    console.log(result)
})

签名

promise = m.jsonp([url,] options)
参数 类型 是否必须 描述
url String 如果存在该参数,相当于设置了 {url: url}。该对象会覆盖 options 中对应的值。
options.url String 请求会发送到该 URL。该 URL 可以是绝对路径,也可以是相对路径,也可以包含URL 参数
options.data any 该数据会被序列化成 querystring,并添加到 URL 中。
options.type any = Function(any) 响应中的每个对象的构造函数,即得到请求结果后,会先使用该函数进行处理。默认为恒等函数
options.callbackName String 回调函数名称。默认为随机字符串(例如,_mithril_6888197422121285_0({a: 1})
options.callbackKey String 指定回调名称的查询字符串参数名。默认为 callback(例如,/someapi?callback=_mithril_6888197422121285_0
返回 Promise 在通过 options.type 方法处理之后,解析为响应数据的 promise。

工作原理

m.jsonp 工具用于可以返回 JSON-P 格式数据的第三方 API。

JSON-P 会创建一个 script 标签,其 src 属性指向第三方服务器中的脚本。通常,你需要定义一个全局函数,并在脚本的 URL 的 querystring 中指定其名称。响应会返回调用全局函数的代码,并将服务器的数据作为第一个参数传入。

JSON-P 有几个限制:它只能使用 GET 请求,它默认信任第三方服务器不会提供恶意代码,并且它会污染 JavaScript 的全局作用域。尽管如此,在服务器不支持 CORS 时,它是从服务器获取数据的唯一方法。

典型用法

一些服务遵守 JSON-P 的响应格式约定,使用 callback 作为查询字符串的 key,此时 m.jsonp 可以自动工作:

m.jsonp({url: "https://api.github.com/users/lhorie"}).then(function(response) {
    console.log(response.data.login) // logs "lhorie"
})

某些服务不遵守约定,因此必须指定回调名称:

m.jsonp({
    url: "https://api.flickr.com/services/feeds/photos_public.gne?tags=kitten&format=json",
    callbackKey: "jsoncallback",
})
.then(function(response) {
    console.log(response.link) // logs "https://www.flickr.com/photos/tags/kitten/"
})

有时,你只是想使用 GET 请求的缓存功能:

// 该请求每次调用时 querystring 都相同,因此它会被缓存
m.jsonp({
    url: "https://api.github.com/users/lhorie",
    callbackName: "__callback",
})
.then(function(response) {
    console.log(response.data.login) // logs "lhorie"
})