完整日历CakePhp 3.x和错误：XMLHttpRequest无法加载“…”。 请求的资源上没有'Access-Control-Allow-Origin'标头吗？

Question

我在cakephp 3.x上使用了完整日历，并且仅在移动设备上收到此错误消息“ XMLHttpRequest无法加载https://www.utahreia.org/events/feed ...否'Access-Control-Allow-Origin “标头出现在所请求的资源上。因此，不允许访问源' https://utahreia.org '。”

在桌面上，事件加载正常，只是移动设备出现了错误，我也不知道为什么。 该提要用于从数据库中获取事件并将其呈现到以下URL： 完整日历

这是feed方法：

public function feed($id=null) {
        $this->layout = "ajax";
        $vars = $this->request->query([]);
        $conditions = ['UNIX_TIMESTAMP(start) >=' => $vars['start'], 'UNIX_TIMESTAMP(start) <=' => $vars['end']];
        $events = $this->Events->find('all', $conditions)->contain(['EventTypes']);
        foreach($events as $event) {
            if($event->all_day === 1) {
                $allday = true;
                $end = $event->start;
            } else {
                $allday = false;
                $end = $event->end;
            }
            $event_img[] = array(
                    'id' => $event->id,
                    'title'=> $event->title,
                    'start'=> $event->start,
                    'end' => $end,
                    'allDay' => $allday,
                    'url' => Router::url('/') . 'events/view/'.$event->id,
                    'details' => $event->details,
                    'className' => $event->event_type->color
            );
        }
        $this->set("json", json_encode($event_img));
        $this->set(compact('user'));
    }

这是ready.js：

jQuery(document).ready(function( $ ) {

    // page is now ready, initialize the calendar...
    $('#calendar').fullCalendar({

        header: {
            left:   'title',
            center: '',
            right:  'today agendaDay,agendaWeek,month prev,next'
        },
        defaultView: 'month',
        fixedWeekCount: false,
        firstHour: 8,
        aspectRatio: 2,
        editable: adminEdit,
        events: plgFcRoot + "events/feed"
    })
});

完整的日历页面：

<div class="page-wrap">
    <div class="Calendar index">
        <div id="calendar"></div>
    </div>
</div>

<script type="text/javascript">plgFcRoot = "https://www.utahreia.org/";</script>
<?php if (isset($current_user) && $current_user['role'] === 1): ?>
<script type="text/javascript">adminEdit = true;</script>
<?php else: ?>
<script type="text/javascript">adminEdit = false;</script>
<?php endif; ?>

<?= $this->Html->css('/full_calendar/css/fullcalendar', ['plugin' => true]); ?>
<?= $this->Html->css('/full_calendar/css/jquery.qtip.min', ['plugin' => true]); ?>
<?= $this->Html->script('/full_calendar/js/lib/jquery.min.js', ['plugin' => true]); ?>
<?= $this->Html->script('/full_calendar/js/lib/moment.min.js', ['plugin' => true]); ?>
<?= $this->Html->script('/full_calendar/js/fullcalendar.js', ['plugin' => true]); ?>
<?= $this->Html->script('/full_calendar/js/jquery.qtip.min.js', ['plugin' => true]); ?>
<?= $this->Html->script('/full_calendar/js/ready.js', ['plugin' => true]); ?>

Answer 1

假设您正在运行混合移动应用程序，这就是为什么收到XMLHttpRequest错误的原因。 您遇到此错误的原因是，您的移动应用程序是从移动设备本地提供给混合WebView的，这意味着应用程序中提供的页面的来源与您所使用的资源的来源不匹配尝试请求（您的feed终结点。）要允许跨源移动应用程序连接到终结点，您将必须在请求上设置跨源资源共享（CORS）标头。 我实际上写了一个插件来做到这一点。 在这里 ，希望对您有所帮助！

Answer 2

我已升级到CakePHP 3.1，并且不再遇到此问题。