Question

我非常确定JSONP意味着没有跨域限制。我正在尝试使用node和express来创建JSONP服务。这是一个简单的代码：

data-number "5"

当我这样做时：

$(function(){
            $('input').change(function(){
                if($('#count').val() > $('#select').data(number)) {
                    $('#select option').attr('disabled', true);
                }  
                else {
                    $('#select option').attr('disabled', false);
                } 
                if ($('#select').data(number) == Math.min($('#select').data(number) - $('#count').val()){
                   $('#select option').attr('selected', true);  
                }
            }); 
}

我收到此错误。

XMLHttpRequest无法加载http://127.0.0.1:8080/portfolio。该＆＃39;访问控制允许来源＆＃39; header有一个值＆＃39; http://127.0.0.1:8080/portfolio＆＃39;这不等于提供的起源。起源＆＃39; http://api.jquery.com＆＃39;因此是不允许的访问。

有人可以解释这里发生了什么吗？如果这是JSONP，为什么我们需要提供标头值。如何跨域工作？

Answer 1

$.getJSON不会将请求视为JSONP ，除非请求网址包含callback=?之类的字符串。

所以，试着这样做;

$.getJSON('http://127.0.0.1:8080/portfolio?callback=?', function(data){ console.log(data)});

Answer 2

实际上，你只需要添加？callback = ?, jQuery完成其余的工作。

  $(document).ready(function() {
        $.getJSON('http://127.0.0.1:8080/portfolio?callback=?', function(data) {
            console.log(data);
        });
    });

来源：http://api.jquery.com/jQuery.getJSON/

Answer 3

将以下代码放入app.js或server.js

/ *************允许访问跨域请求************* /

   app.all('*', function(req, res, next) {
           res.header('Access-Control-Allow-Origin', '*');
           res.header('Access-Control-Allow-Methods', 'PUT, GET, POST, DELETE, OPTIONS');
           res.header('Access-Control-Allow-Headers', 'Content-Type');
           next();
   });

   /*************To Allow access to cross domain request *************/

Answer 4

将$ .ajax与dataType jsonp

一起使用

$.ajax({
    type: 'GET',
    cache: false,
    url: 'http://portfoliomanager-sran.rhcloud.com/portfolio?callback=?',
    dataType: 'jsonp'  
}).then(function(response){
console.log(response);
});

nodejs jsonp - Access-Control-Allow-Origin错误

4 个答案: