【问题标题】:Uncaught SyntaxError and CORS error using AJAX with JSONP使用带有 JSONP 的 AJAX 未捕获的 SyntaxError 和 CORS 错误
【发布时间】:2016-12-21 14:13:49
【问题描述】:

当我执行 AJAX 调用时,出现以下错误:

Uncaught SyntaxError: Unexpected token :

但是,当我直接在浏览器中访问相同的 URL 时,我得到了预期的 JSON 响应。

我做错了什么,我该如何解决?

下面是我的 jQuery AJAX 请求;

$.ajax({
    type: 'GET',
    url: "http://www.exampleUrl.com",
    crossDomain: true,
    dataType: "jsonp",
    jsonp: "jsonp",
    mimeType: "application/json",
    jsonpCallback: 'callback',
    contentType: "application/json; charset=utf-8",
    beforeSend: function() {
        //
    },
    success: function (data) {
        alert("success");
    },
    error: function (result) {
        //      
    }
});

【问题讨论】:

    标签: jquery ajax cors jsonp


    【解决方案1】:

    您肯定遇到了 CORS 问题。

    这种方法应该很有效:

    $.ajax({
    
      // The 'type' property sets the HTTP method.
      // A value of 'PUT' or 'DELETE' will trigger a preflight request.
      type: 'GET',
    
      // The URL to make the request to.
      url: 'http://html5rocks-cors.s3-website-us-east-1.amazonaws.com/index.html',
    
      // The 'contentType' property sets the 'Content-Type' header.
      // The JQuery default for this property is
      // 'application/x-www-form-urlencoded; charset=UTF-8', which does not trigger
      // a preflight. If you set this value to anything other than
      // application/x-www-form-urlencoded, multipart/form-data, or text/plain,
      // you will trigger a preflight request.
      contentType: 'text/plain',
    
      xhrFields: {
        // The 'xhrFields' property sets additional fields on the XMLHttpRequest.
        // This can be used to set the 'withCredentials' property.
        // Set the value to 'true' if you'd like to pass cookies to the server.
        // If this is enabled, your server must respond with the header
        // 'Access-Control-Allow-Credentials: true'.
        withCredentials: false
      },
    
      headers: {
        // Set any custom headers here.
        // If you set any non-simple headers, your server must include these
        // headers in the 'Access-Control-Allow-Headers' response header.
      },
    
      success: function() {
        // Here's where you handle a successful response.
      },
    
      error: function() {
        // Here's where you handle an error response.
        // Note that if the error was due to a CORS issue,
        // this function will still fire, but there won't be any additional
        // information about the error.
      }
    });
    

    来源:Using CORS

    【讨论】:

    • 感谢您的帖子。现在我收到以下响应错误:请求的资源上不存在“Access-Control-Allow-Origin”标头。因此,不允许访问 Origin 'null'。
    • 这表明 CORS 未在您使用的服务器上正确定义和/或启用。检查enable-CORS 以获取有关如何有效解决它的更多信息。希望您可以访问服务器!
    猜你喜欢
    • 2018-05-04
    • 2013-04-16
    • 2014-05-27
    • 2017-04-16
    • 1970-01-01
    • 1970-01-01
    • 2014-04-30
    • 2015-08-19
    • 1970-01-01
    相关资源
    最近更新 更多