国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

JSONP跨域請(qǐng)求學(xué)習(xí)

LittleLiByte / 3034人閱讀

摘要：對(duì)于一直是知半解，今天利用周末整理了一下維基百科的解釋我的理解是前端編寫自己的函數(shù)，用標(biāo)簽發(fā)送請(qǐng)求把函數(shù)名字帶上服務(wù)器端接送到請(qǐng)求后獲取前端發(fā)送請(qǐng)求時(shí)的，添加上自己的數(shù)據(jù)返回后。

對(duì)于JSONP一直是知半解，今天利用周末整理了一下
維基百科的解釋：

JSONP (JSON with Padding or JSON-P[1]) is a javascript pattern to request data by loading a

后端代碼

//用node編寫一個(gè)簡單的服務(wù)器
const http = require("http");
const urlModule = require("url");
const server = http.createServer();
server.on("request", function (req, res) {
    //urlModule.parse(req.url.url)的請(qǐng)求 就是這個(gè)對(duì)象
    // {
    //   protocol: null,
    //   slashes: null,
    //   auth: null,
    //   host: null,
    //   port: null,
    //   hostname: null,
    //   hash: null,
    //   search: "?callback=getremotedata",
    //   query: "callback=getremotedata",
    //   pathname: "/",
    //   path: "/?callback=getremotedata",
    //   href: "/?callback=getremotedata" }
    // 對(duì)象結(jié)構(gòu)賦值得到query是一個(gè)對(duì)象
    const {pathname: url, query} = urlModule.parse(req.url, true)
    if (url === "/") {
        var data = {
            name: "大毛",
            age: 18,
            gender: "未知"
        };
        // 解析query的請(qǐng)求得到前端發(fā)送的函數(shù)名稱，加上括號(hào)調(diào)用此函數(shù)，函數(shù)里加實(shí)參servedata返回
        var scripteStr = `${query.callback}(${JSON.stringify(data)})`
        console.log(scripteStr)
        res.end(scripteStr)
    } else {
        res.end("404")
    }
});
server.listen("3999", function () {
    console.log("server is running 3999")
})

這樣前端發(fā)送請(qǐng)求，無論回調(diào)是什么，后端都會(huì)返回回調(diào)加data數(shù)據(jù)，就實(shí)現(xiàn)了跨域請(qǐng)求啦。

第一寫感覺有點(diǎn)語言不清，大家把代碼自己敲一遍就懂了

自學(xué)前端3個(gè)月，想找一個(gè)基礎(chǔ)的前端工作

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://specialneedsforspecialkids.com/yun/99344.html

相關(guān)文章

  • AJAX的學(xué)習(xí)筆記

    摘要：的學(xué)習(xí)筆記是異步和的縮寫，它的作用是執(zhí)行異步的網(wǎng)絡(luò)請(qǐng)求。這就是一個(gè)格式的，向這個(gè)地址請(qǐng)求，將得到一個(gè)回調(diào)函數(shù)，執(zhí)行就得到數(shù)據(jù)。 AJAX的學(xué)習(xí)筆記 AJAX是異步JavaScript和XML的縮寫，它的作用是執(zhí)行異步的網(wǎng)絡(luò)請(qǐng)求。因?yàn)镴S是線性同步，如果需要用戶向?yàn)g覽器發(fā)送一個(gè)請(qǐng)求，那么就需要等瀏覽器接收到了結(jié)果才能繼續(xù)運(yùn)行，如果發(fā)送到接受的時(shí)間太長，瀏覽器就會(huì)很長時(shí)間處于假死狀態(tài)，這樣...

    RobinTang 評(píng)論0 收藏0

  • AJAX學(xué)習(xí)筆記2：XHR實(shí)現(xiàn)跨域資源共享（CORS）以及和JSONP的對(duì)比

    摘要：補(bǔ)充同源策略還應(yīng)該對(duì)一些特殊情況做處理，比如限制協(xié)議下腳本的訪問權(quán)限。注意，該請(qǐng)求的查詢字符串有一個(gè)參數(shù)，用來指定回調(diào)函數(shù)的名字，這對(duì)于是必需的。 1 前言： 首先對(duì)參考文章作者表示感謝，你們的經(jīng)驗(yàn)總結(jié)給我們這些新手提供了太多資源。本文致力于解決AJAX的CORS問題，我在邏輯上進(jìn)行了梳理：首先，系統(tǒng)的總結(jié)了CORS問題的起源---同源策略；其次，介紹JSONP這種僅能支持GET請(qǐng)求的...

    QiuyueZhong 評(píng)論0 收藏0

  • AJAX學(xué)習(xí)筆記2：XHR實(shí)現(xiàn)跨域資源共享（CORS）以及和JSONP的對(duì)比

    摘要：補(bǔ)充同源策略還應(yīng)該對(duì)一些特殊情況做處理，比如限制協(xié)議下腳本的訪問權(quán)限。注意，該請(qǐng)求的查詢字符串有一個(gè)參數(shù)，用來指定回調(diào)函數(shù)的名字，這對(duì)于是必需的。 1 前言： 首先對(duì)參考文章作者表示感謝，你們的經(jīng)驗(yàn)總結(jié)給我們這些新手提供了太多資源。本文致力于解決AJAX的CORS問題，我在邏輯上進(jìn)行了梳理：首先，系統(tǒng)的總結(jié)了CORS問題的起源---同源策略；其次，介紹JSONP這種僅能支持GET請(qǐng)求的...

    makeFoxPlay 評(píng)論0 收藏0

  • jsonp跨域獲取數(shù)據(jù)實(shí)現(xiàn)百度搜索

    摘要：同源策略做了很嚴(yán)格的限制，但是在實(shí)際的場景中，又確實(shí)有很多地方需要突破同源策略的限制，也就是我們常說的跨域。使用跨域由于同源策略，一般來說位于的網(wǎng)頁無法與不是的服務(wù)器溝通，而的元素是一個(gè)例外。 本菜雞最近在寫某個(gè)頁面請(qǐng)求數(shù)據(jù)時(shí)，報(bào)了如下的錯(cuò)誤。 Failed to load https://...:No Access-Control-Allow-Origin header is pre...

    Tikitoo 評(píng)論0 收藏0

  • jsonp跨域獲取數(shù)據(jù)實(shí)現(xiàn)百度搜索

    摘要：同源策略做了很嚴(yán)格的限制，但是在實(shí)際的場景中，又確實(shí)有很多地方需要突破同源策略的限制，也就是我們常說的跨域。使用跨域由于同源策略，一般來說位于的網(wǎng)頁無法與不是的服務(wù)器溝通，而的元素是一個(gè)例外。 本菜雞最近在寫某個(gè)頁面請(qǐng)求數(shù)據(jù)時(shí)，報(bào)了如下的錯(cuò)誤。 Failed to load https://...:No Access-Control-Allow-Origin header is pre...

    gggggggbong 評(píng)論0 收藏0

  • jsonp跨域獲取數(shù)據(jù)實(shí)現(xiàn)百度搜索

    摘要：同源策略做了很嚴(yán)格的限制，但是在實(shí)際的場景中，又確實(shí)有很多地方需要突破同源策略的限制，也就是我們常說的跨域。使用跨域由于同源策略，一般來說位于的網(wǎng)頁無法與不是的服務(wù)器溝通，而的元素是一個(gè)例外。 本菜雞最近在寫某個(gè)頁面請(qǐng)求數(shù)據(jù)時(shí)，報(bào)了如下的錯(cuò)誤。 Failed to load https://...:No Access-Control-Allow-Origin header is pre...

    lemanli 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<