Node.js返回JSONP詳解
在使用JQuery的Ajax從服務(wù)器請(qǐng)求數(shù)據(jù)或者向服務(wù)器發(fā)送數(shù)據(jù)時(shí)常常會(huì)遇到跨域無(wú)法請(qǐng)求的錯(cuò)誤，常用的解決辦法就是在Ajax中使用JSONP。基于安全性考慮，瀏覽器會(huì)存在同源策略，然而<script/>標(biāo)簽卻具有跨域訪問(wèn)數(shù)據(jù)的能力，這就是JSONP工作的基本原理。有關(guān)同源策略以及什么是JSONP。
在Node.js中實(shí)現(xiàn)JSONP非常簡(jiǎn)單，通過(guò)下面的代碼我們從服務(wù)器返回并運(yùn)行一個(gè)JavaScript函數(shù)，這個(gè)JavaScript函數(shù)已經(jīng)在調(diào)用方提前被定義好了，于是當(dāng)它被返回的時(shí)候就自動(dòng)執(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ī)定從服務(wù)器返回?cái)?shù)據(jù)的類(lèi)型，代碼res.type('text/javascript')被加在返回的數(shù)據(jù)之前用于告訴瀏覽器這是一段JavaScript代碼。
前端頁(yè)面通過(guò)JQuery調(diào)用：
<!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>
運(yùn)行代碼，點(diǎn)擊按鈕，在瀏覽器的console面板總我們可以看到從遠(yuǎn)程服務(wù)器返回的json對(duì)象。
以上這篇Node.js返回JSONP詳解就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
Node.js的Web模板引擎ejs的入門(mén)使用教程
ejs是Node世界的開(kāi)源模板引擎中比較有人氣的一個(gè),而且并不只是在Express框架中才可以使用,今天為大家?guī)?lái)Node.js的Web模板引擎ejs的入門(mén)學(xué)習(xí)教程,其中側(cè)重于ejs的layout頁(yè)面布局放面2016-06-06
利用node.js實(shí)現(xiàn)反向代理的方法詳解
在實(shí)際工程開(kāi)發(fā)中，會(huì)有前后端分離的需求。為了平滑的完成前端請(qǐng)求到后端各個(gè)獨(dú)立服務(wù)，需要一個(gè)中間件實(shí)現(xiàn)請(qǐng)求轉(zhuǎn)發(fā)的功能，利用Nginx可以實(shí)現(xiàn)，在這里使用nodejs實(shí)現(xiàn)一個(gè)反向代理服務(wù)器。本文主要介紹了關(guān)于利用node.js實(shí)現(xiàn)反向代理的相關(guān)資料，需要的朋友可以參考下。2017-07-07
將node安裝到其他盤(pán)的超詳細(xì)步驟與說(shuō)明
基本現(xiàn)在很多主流的前端框架都用了node.js 但是node裝起來(lái)確實(shí)頭疼,下面這篇文章主要給大家介紹了關(guān)于如何將node安裝到其他盤(pán)的超詳細(xì)步驟與說(shuō)明,需要的朋友可以參考下2023-06-06
這篇文章主要介紹了node.js入門(mén)教程,講解了node.js在linux和windows下的安裝,模塊的概念,NPM的使用等等,是一篇不錯(cuò)的nodejs入門(mén)文章,需要的朋友可以參考下2014-06-06
nodejs簡(jiǎn)單實(shí)現(xiàn)操作arduino
本文給大家分享的是使用nodejs來(lái)驅(qū)動(dòng)arduino,主要是基于cylonjs 和 gort，有需要的小伙伴可以參考下2016-09-09
解決淘寶cnpm 安裝后cnpm不是內(nèi)部或外部命令的問(wèn)題
今天小編就為大家分享一篇解決淘寶cnpm 安裝后cnpm不是內(nèi)部或外部命令的問(wèn)題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2018-05-05
這篇文章主要為大家介紹了Elasticsearch插件及nodejs的安裝配置，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-04-04
node.js開(kāi)機(jī)自啟動(dòng)腳本文件
這篇文章主要介紹了node.js開(kāi)機(jī)自啟動(dòng)腳本文件的方法和代碼，這里分享給大家，有需要的小伙伴參考下吧2014-12-12
這篇文章主要介紹了node.js中的fs.write方法使用說(shuō)明,本文介紹了fs.write的方法說(shuō)明、語(yǔ)法、接收參數(shù)、使用實(shí)例和實(shí)現(xiàn)源碼,需要的朋友可以參考下2014-12-12
Node.js利用Express實(shí)現(xiàn)用戶(hù)注冊(cè)登陸功能(推薦)
這篇文章主要介紹了Node.js利用Express實(shí)現(xiàn)用戶(hù)注冊(cè)登陸功能,本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2020-10-10