溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

Node.js中怎么使用JSONP進行交互

發(fā)布時間:2022-01-21 10:40:02 來源:億速云 閱讀:170 作者:iii 欄目:web開發(fā)

本篇內容主要講解“Node.js中怎么使用JSONP進行交互”,感興趣的朋友不妨來看看。本文介紹的方法操作簡單快捷,實用性強。下面就讓小編來帶大家學習“Node.js中怎么使用JSONP進行交互”吧!

在Node.js中實現(xiàn)JSONP非常簡單,通過下面的代碼我們從服務器返回并運行一個JavaScript函數(shù),這個JavaScript函數(shù)已經在調用方提前被定義好了,于是當它被返回的時候就自動執(zhí)行了。

var express = require('express');

var router = express.Router();

router.get('/getinfo', function(req, res, next) {

  var _callback = req.query.callback;

  var _data = { email: 'example@163.com', name: 'jaxu' };

  if (_callback){

      res.type('text/javascript');

      res.send(_callback + '(' + JSON.stringify(_data) + ')');

  }

  else{

      res.json(_data);

  }

});

module.exports = router;

代碼中必須規(guī)定從服務器返回數(shù)據的類型,代碼res.type('text/javascript')被加在返回的數(shù)據之前用于告訴瀏覽器這是一段JavaScript代碼。

前端頁面通過JQuery調用:

復制代碼

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>jsonp test</title>

    <script src="/bower_components/jquery/dist/jquery.js"></script>

</head>

<body>

    <input type="button" value="click" id="btn">

    <script type="text/javascript">

        $(function(){

            $('#btn')。on('click', function(){

                $.get('http://anothersite/api/getinfo', function(d){

                    console.log(d);

                }, 'jsonp');

            });

        });

    </script>

</body>

</html>

到此,相信大家對“Node.js中怎么使用JSONP進行交互”有了更深的了解,不妨來實際操作一番吧!這里是億速云網站,更多相關內容可以進入相關頻道進行查詢,關注我們,繼續(xù)學習!

向AI問一下細節(jié)

免責聲明:本站發(fā)布的內容(圖片、視頻和文字)以原創(chuàng)、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯(lián)系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。

AI