Safari和iOS設備無法與jQuery AJAX調用一起使用

Question

我正在嘗試通過AJAX設置Cookie。 它適用於Android設備，Chrome，FF，Opera，Microsoft Edge，IE，但Safari和iOS設備除外。 關於Safari和iOS，我缺少AJAX隱藏的神奇之處嗎？

這是我在Android設備/ etc上可以使用的代碼。

Javascript文件

function setCookie() {
var $cookieName   = 'example-cookie',
            $cookieMethod = 'example-method',
            $cookieGet    = 'example-get'

        $.ajax({
            type: 'POST',
            url: $(location).attr('protocol') + 'to/location.php',
            data: {
                name: $cookieName,
                method: $cookieMethod,
                get: $cookieGet
            },
            cache: false,
            success: function(data, textStatus, jQxhr) {
                try {
                    $('.report .display-result').css('display', 'none').css('position', 'absolute')
                        .css('width', '100%').html($(data).filter('.display').html()).fadeIn(1000);

                    setTimeout(function() {
                        $('.report .display-result').fadeOut(1000);
                    }, 4000);
                } catch (err) {/*alert(err);*/}
            },
            error: function(jqXhr, textStatus, errorThrown) {
                try {
                    alert(jqXhr.responseText);
                } catch (err) {/*alert.log(err);*/}
            }
        });
    }

PHP文件

    <?php

require_once '../to/class/Class.php';

$uc           = new Class();
$cookieName   = $_POST['name'];
$cookieMethod = $_POST['method'];
$cookieId     = $_POST['get'];

$uc->method($_POST['name'], $_POST['method'], $_POST['get']);
?>

<?php
if (!empty($uc->method($_POST['name'], 'get-cookie'))):
    $cookie = json_decode($uc->method($_POST['name'], 'get-cookie'));

    // Making sure the cookie exists and is not empty.
    if (!empty($cookie)):
        // Making sure the cookie has id's, if not, will spit out 'Successly added to report'.
        if (isset($cookie->data->id)) {
            foreach ($cookie->data->id as $chkDuplicates) {
                // If any id's match, there is a duplicate. Make sure that they know they've added this already.
                if ($chkDuplicates == $_POST['get']) {
                    $duplicateFound = true;
                    break;
                }
            }
        }

        if (isset($duplicateFound)): ?>
            <div class="display info">
                <h3 class="alert alert-info">You've already added this to your report.</h3>
            </div>
        <?php else: ?>
            <div class="display success">
                <h3 class="alert alert-success">Successfully added to report.</h3>
            </div>
        <?php endif; ?>
    <?php endif; ?>
<?php else: ?>
    <div class="display failure">
        <h3 class="alert alert-failure">Unfortunately, that item wasn't added, please refresh the page and try again.</h3>
    </div>
<?php endif; ?>

無論出於何種原因，這似乎在Safari和iOS設備中均不起作用。 每當我嘗試獲取警報（jqXhr）時，我什么都沒有。 jqXhr.responseText也是如此，textStatus給我“錯誤”，errorThrown與其他內容一樣是空白。 我對此有些茫然。 非常感謝您在這里的任何支持，並感謝您抽出寶貴時間來研究此問題。

Answer 1

Safari可以對AJAX請求進行大量的緩存。 也許您之前在響應完全正常工作並且您的API給出了空響應之前就已經在Safari中測試了jQuery。

嘗試執行以下操作，對API url + '&nocache=' + new Date().getTime()進行以下更改，從而使Safari緩存無效。 這樣做基本上是使Safari在每次請求時都將Ajax url視為不同的url，因此Safari將從您的API端點獲得新的響應。

 $.ajax({
            type: 'POST',
            url: $(location).attr('protocol') + 'to/location.php' + '&nocache=' + new Date().getTime(),
            data: {
                name: $cookieName,
                method: $cookieMethod,
                get: $cookieGet
            },
            cache: false,
            success: function(data, textStatus, jQxhr) {
                try {
                    $('.report .display-result').css('display', 'none').css('position', 'absolute')
                        .css('width', '100%').html($(data).filter('.display').html()).fadeIn(1000);

                    setTimeout(function() {
                        $('.report .display-result').fadeOut(1000);
                    }, 4000);
                } catch (err) {/*alert(err);*/}
            },
            error: function(jqXhr, textStatus, errorThrown) {
                try {
                    alert(jqXhr.responseText);
                } catch (err) {/*alert.log(err);*/}
            }
        });

Answer 2

好的，所以它與JS文件和AJAX的URL有關。

顯然，iOS / Safari無法讀取

$(location).attr('protocol')

因此請確保將其更改為

$(location).attr('origin')

噓，這么簡單的事情花了很長時間才找到。 希望這對將來的任何人有幫助。