javascript - 从外部 API 获取数据时出错

Question

我有一个包含 Google ADWords 的 HTML 页面，以及来自外部 URL 的 ajax 调用，我想获取 json 来自 url 的数据。外部API也是我做的。API Controller (在 Laravel 5.2 中):

public function index()
{
    $data = WeatherData::orderBy('created_at', 'DESC')->first();

    return Response::json($data);
}

HTML ADWords 代码:

$.ajax({
        url: 'https://weather.mnsc.com/api/v1/data',
        type: 'POST',
        dataType: 'JSON',
        cors: true,
        success: function (data) {
            console.log(data);
        }
    });

但是我在 Chrome 中遇到错误:

XMLHttpRequest 无法加载 https://weather.mnsc.com/api/v1/data 。请求的资源上不存在“Access-Control-Allow-Origin” header 。因此，不允许访问来源“null”。响应的 HTTP 状态代码为 500。

我需要在 Laravel API 中设置 header 吗？

Answer 1

您需要一个用于 AJAX 请求的 crossDomain: true 属性，而不是普通的属性。另外，$.ajax() 没有 cors 选项，所以我删除了它。请参阅jQuery.ajax() settings在文档页面上查看所有可用选项:

$.ajax({
    url: 'https://weather.mnsc.com/api/v1/data',
    type: 'POST',
    dataType: 'JSON',
    crossDomain: true,
    success: function (data) {
        console.log(data);
    }
});