jsonp
以前學過，當時就挺懵的，還全忘了，這次就當復習了一遍jsonp，??
這里是解決客戶端的跨域問題，服務端去解決跨域問題比這個簡單只要加一個請求頭就可以了
const express = require('express')
const app = express()
app.get('/', (req, res, next) => {
console.log(`收到客戶端請求了：${req.url}`)
var data = https://www.cnblogs.com/ygjzs/p/JSON.stringify({
foo:'bar',
list: [1, 2, 3]
})
setTimeout(function () {
res.end(`${req.query.callback}(${data})`)
}, 1000)
})
app.listen(3000, () => {
console.log('running...')
})
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>jsonp - 示例</title>
</head>
<body>
<script>
// 異步請求跨域限制（ajax）
// 不同域名、不同協議、不同埠號
jsonp({
url: 'http://127.0.0.1:3000/',
data: '',
success: function (data) {
console.log(111)
}
})
jsonp({
url: 'http://127.0.0.1:3000/',
data: '',
success: function (data) {
console.log(222)
}
})
jsonp({
url: 'http://127.0.0.1:3000/',
data: '',
success: function (data) {
console.log(333)
}
})
function jsonp(option) {
// 將用戶通過物件命名空間傳遞進來的函式掛載到全域
var callbackName = 'itcast_' + Math.random().toString().substr(2) + Math.random().toString().substr(2)
!window.callbacks && (window.callbacks = {})
window.callbacks[callbackName] = function (data) {
option.success(data)
// 這里才意味著可以洗掉 script 標簽了
// 這里可以直接使用 script ，原因是下面的變數提升，而且等這里使用 script 的時候，下面的代碼早就執行結束了
document.body.removeChild(script)
}
// 1. 解決 url 問題
// 2. 解決回呼處理函式問題
option.url = option.url + '?callback=callbacks.' + callbackName
var script = document.createElement('script')
script.src = https://www.cnblogs.com/ygjzs/p/option.url
// 將 script 上到 DOM 中
document.body.appendChild(script)
}
</script>