Как проверить состояние моего Ajax-запроса, запущенного на моем iPhone Safari? - PullRequest
Новая
       5

Как проверить состояние моего Ajax-запроса, запущенного на моем iPhone Safari?

5 голосов
/ 18 апреля 2019

enter image description here

У меня загружен этот код на моем сайте 

<!DOCTYPE html>
<html lang="en">

<head>
    <title>fingerprinting</title>
    <meta name="csrf-token" content="{{ csrf_token() }}">
</head>

<body>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

    <h1>page loaded.</h1>
    <h1 id="model"></h1>


    <script type="text/javascript">

        // console.log(window);
        function getIPhoneModel() {
            // Create a canvas element which can be used to retrieve information about the GPU.
            var canvas = document.createElement("canvas");
            if (canvas) {
                var context = canvas.getContext("webgl") || canvas.getContext("experimental-webgl");
                if (context) {
                    var info = context.getExtension("WEBGL_debug_renderer_info");
                    if (info) {
                        var renderer = context.getParameter(info.UNMASKED_RENDERER_WEBGL);
                    }
                }
            }

            // iPhone X
            if ((window.screen.height / window.screen.width == 812 / 375) && (window.devicePixelRatio == 3)) {
                return "iPhone X";
            } else if ((window.screen.height / window.screen.width == 896 / 414) && (window.devicePixelRatio == 3)) {
                return "iPhone XS Max";
            } else if ((window.screen.height / window.screen.width == 896 / 414) && (window.devicePixelRatio == 2)) {
                return "iPhone XR";
            } else if ((window.screen.height / window.screen.width == 1024 / 768) && (window.devicePixelRatio == 2)) {
                return "iPad 4";
            }
            else if ((window.screen.height / window.screen.width == 736 / 414) && (window.devicePixelRatio == 3)) {
                switch (renderer) {
                    default:
                    return "iPhone 6 Plus, 6s Plus, 7 Plus or 8 Plus";
                    case "Apple A8 GPU":
                    return "iPhone 6 Plus";
                    case "Apple A9 GPU":
                    return "iPhone 6s Plus";
                    case "Apple A10 GPU":
                    return "iPhone 7 Plus";
                    case "Apple A11 GPU":
                    return "iPhone 8 Plus";
                }
                // iPhone 6+/6s+/7+ and 8+ in zoom mode
            } else if ((window.screen.height / window.screen.width == 667 / 375) && (window.devicePixelRatio == 3)) {
                switch(renderer) {
                    default:
                    return "iPhone 6 Plus, 6s Plus, 7 Plus or 8 Plus (display zoom)";
                    case "Apple A8 GPU":
                    return "iPhone 6 Plus (display zoom)";
                    case "Apple A9 GPU":
                    return "iPhone 6s Plus (display zoom)";
                    case "Apple A10 GPU":
                    return "iPhone 7 Plus (display zoom)";
                    case "Apple A11 GPU":
                    return "iPhone 8 Plus (display zoom)";
                }
                // iPhone 6/6s/7 and 8
            } else if ((window.screen.height / window.screen.width == 667 / 375) && (window.devicePixelRatio == 2)) {
                switch(renderer) {
                    default:
                    return "iPhone 6, 6s, 7 or 8";
                    case "Apple A8 GPU":
                    return "iPhone 6";
                    case "Apple A9 GPU":
                    return "iPhone 6s";
                    case "Apple A10 GPU":
                    return "iPhone 7";
                    case "Apple A11 GPU":
                    return "iPhone 8";
                }
                // iPhone 5/5C/5s/SE or 6/6s/7 and 8 in zoom mode
            } else if ((window.screen.height / window.screen.width == 1.775) && (window.devicePixelRatio == 2)) {
                switch(renderer) {
                    default:
                    return "iPhone 5, 5C, 5S, SE or 6, 6s, 7 and 8 (display zoom)";
                    case "PowerVR SGX 543":
                    return "iPhone 5 or 5c";
                    case "Apple A7 GPU":
                    return "iPhone 5s";
                    case "Apple A8 GPU":
                    return "iPhone 6 (display zoom)";
                    case "Apple A9 GPU":
                    return "iPhone SE or 6s (display zoom)";
                    case "Apple A10 GPU":
                    return "iPhone 7 (display zoom)";
                    case "Apple A11 GPU":
                    return "iPhone 8 (display zoom)";
                }
                // iPhone 4/4s
            } else if ((window.screen.height / window.screen.width == 1.5) && (window.devicePixelRatio == 2)) {
                switch(renderer) {
                    default:
                    return "iPhone 4 or 4s";
                    case "PowerVR SGX 535":
                    return "iPhone 4";
                    case "PowerVR SGX 543":
                    return "iPhone 4s";
                }
                // iPhone 1/3G/3GS
            } else if ((window.screen.height / window.screen.width == 1.5) && (window.devicePixelRatio == 1)) {
                switch(renderer) {
                    default:
                    return "iPhone 1, 3G or 3GS";
                    case "ALP0298C05":
                    return "iPhone 3GS";
                    case "S5L8900":
                    return "iPhone 1, 3G";
                }
            } else {
                return "Not an iPhone";
            }
        }

        var model = getIPhoneModel()
        console.log(model);

        $('#model').text(model);

        var currentUrl = window.location.href;
        var newUrl = currentUrl.replace("fingerprinting", "fingerprinting/tasks");

        // alert(newUrl);

        $.ajax({
            method: 'POST',
            url: "{{ $APP_URL }}fingerprinting/store",
            data: {'original_uri':'{!! $original_uri !!}', 'model' : model,},
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            },
            success: function(response){
                console.log(response);
                window.location.href = newUrl;
            },
            error: function(jqXHR, textStatus, errorThrown) {
                console.log(JSON.stringify(jqXHR));
                console.log("AJAX error: " + textStatus + ' : ' + errorThrown);
            }
        });


    </script>

    <h1>JS finished loaded.</h1>

</body>

</html>

У меня есть Ajax внизу страницы.Я уверен, почему это не срабатывает на iPhone Safari.или, возможно, он выполняется, но есть некоторые ошибки.

Примечание:

  • тот же код в Chrome или Safari в Mac OS X. 101
  • Ajax работает и работает нормально.101

Кажется, что Ajax не запускается на iPhone Safari

Использую ли я какой-либо старый синтаксис, который Safari на iPhone не распознает?

Как можно пойти дальше и отладить это дальше?

Ответы [ 2 ]

6 голосов
/ 23 апреля 2019

Вы можете использовать Safari WebInspector

Вам понадобится Mac с Xcode установленным .

Вам необходимо локально запустить свой сервер на своем ip,Откройте свой терминал и запустите ifconfig, найдите свой ip и либо скопируйте enp1s0 для ethernet или wlp2s0 для Wi-Fi. 

~ $ ifconfig
enp1s0: flags=4163<UP,BROADCAST,RUNNING,MULTICAST>  mtu 1500
        inet 192.168.1.38  netmask 255.255.255.0  broadcast 192.168.1.255

wlp2s0: flags=4163<UP,BROADCAST,RUNNING,MULTICAST>  mtu 1500
        inet 192.168.1.6  netmask 255.255.255.0  broadcast 192.168.1.255

запустите сервер с вашим сайтом на этом ip.С рельсами я запускаю rails server -b 192.168.1.38 -p 3000, -b означает ip binding и -p для порта.

Откройте Xcode и запустите новый эмулятор или подключите ваше устройство через USB.

Следуйте этой инструкции , чтобы открыть http://192.168.1.38:3000 на эмуляторе iphone.

В случае, если вам не удается настроить iphone для отладки , запомните этоВажные шаги из инструкций :

  1. Опция Webinspector должна быть включена ТОЛЬКО , если вы используете USB DEVICE .Вам не нужно отмечать эту опцию на симуляторе устройства.У меня нет его на симуляторе , и я смог запустить webinspector.
  2. После запуска симулятора и открытия страницы с помощью мобильного браузера Safari, вам нужно открыть свой DESKTOP браузер Safari и включите Develop в строке меню, установив Show develop menu in menu bar.

Если вы не видите «Разработка» в строке меню, перейдитек строке меню и нажмите «Safari> Настройки> Дополнительно» и установите флажок «Показать меню разработки в строке меню».

enter image description here

Выберите safari в строке меню Develop -> Simulator or Iphone -> Your Page

enter image description here

На панели инструментов разработчика откройте Timelines/Network Request или Networkкак показано в руководстве, чтобы проверить ваш сетевой запрос

Проверьте журналы вашего сервера, чтобы узнать, получает ли бэкэнд запросы AJAX, или проверьте ваш журнал phone simulator, так как вы можете увидеть некоторые ошибки, связанные с сертификатами илидругие причины.Вам придется искать в Интернете решение этих ошибок.

enter image description here

, когда я собираю проект с xcode, я также могусмотрите журнал консоли с телефона внутри xcode

enter image description here

4 голосов
/ 25 апреля 2019

Из вашего вопроса я понимаю, что вы хотите иметь возможность отладки на мобильном устройстве, а не на рабочем столе? Если вы используете iPhone 7 или более позднюю версию, в iPhone settings можно включить WebInspector.

Перейдите на Settings> Safari> Advanced (это внизу экрана), и там есть переключатель, где вы можете включить свой WebInspector. Таким образом, вы можете читать вашу консоль на вашем iPhone.

«WebInspector» был новинкой для iPhone 7; старые айфоны (6 лет или младше) использовали 'DebugConsole', к которому можно получить такой же доступ через меню настроек. Преимущество WebInspector заключается в том, что вы можете показывать webinspector в вашем настольном сафари, когда iPhone подключен к вашему Mac. (Выберите «Разработка»> «Показать WebInspector» в меню Safari.

Консоль отладки и веб-инспектор по умолчанию отключены, поэтому их необходимо включить

надеюсь, это поможет

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...