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