在 nodejs 和 origin ajax 中使用 jsonp

Posted 2023-03-03

【中文标题】在 nodejs 和 origin ajax 中使用 jsonp

【英文标题】：Using jsonp in nodejs and origin ajax

【发布时间】：2016-07-12 11:59:39

【问题描述】：

我想知道 jsonp 是如何工作的，所以我写了一个在 nodejs 上工作的演示，没有 jQuery。但是，它不起作用。 贝娄是我的代码：

---

views/index.jade

doctype html
html
  head
    title Demo of jsonp
  body
    #result
    script.
      var xhr = new XMLHttpRequest();
      var url = '/getjsonp?callback=abc'

      function abc (data) 
        alert('aaa')
        document.getElementById('result').innerHTML = data.name;
      

      xhr.open('GET', url);
      xhr.send();

---

server.js

var express = require('express');
var bodyParser = require('body-parser');
var path = require('path');

var app = express();
var data =  name: 'jacket', company: 'fdd' ;

app.set('views', path.join(__dirname, 'views/'));
app.set('view engine', 'jade');

app.use(bodyParser.urlencoded( extended: false ))

app.get('/', function (req, res, next) 
  res.render('index');
);

app.get('/getjsonp', function (req, res, next) 
  var callback = req.query.callback;
  res.writeHead(200,  'Content-Type': 'application/javascript' );
  res.end(callback + '(' + JSON.stringify(data) + ')');
);

app.listen(3000);

---

这是回复：

abc("name":"jacket","company":"fdd")

正如我所料，我在 index.jade 中定义了一个方法 abc()，然后通过异步 ajax 请求 '/getjsonp?callback=abc'，它会响应一个执行该方法的 javascript：abc()。 但它不是那样工作的，我不知道哪里出了问题，如果你知道，希望你能告诉我。 谢谢！

【问题讨论】：

请在 node.js 中使用 expressjs 或 koajs 来简化你的生活

感谢 Joe，我使用 express 和 Jade 简化了我的代码，但它仍然无法正常工作。@JoeTannoury

【参考方案1】：

我找到了另一种不用 ajax 的方法：

<script>
   function abc (data) 
    alert('aaa')
    document.getElementById('result').innerHTML = data.name;
  
</script>
<script type="text/javascript" src="/getjsonp?callback=abc"></script>

【参考方案2】：

我相信这里一切正常，只是在客户端中，您需要使用以下方法检索从服务器发回的数据：

xhr.onreadystatechange = function() 
    if (xhr.readyState == 4 && xhr.status == 200) 
        eval(xhr.responseText);
    
;

希望这会有所帮助:)

注意：eval 将生成一个类似 "abc(a: 'a')" 的字符串来运行带有 1 个参数的函数 abc（即对象 a: '一个'