Кнопка вставки редактора Ace отсутствует на iPhone

Я встроил редактор Ace в свое веб-приложение, и когда приложение открыто на iPhone (Safari или Chrome), кнопка «вставить» не отображается в меню.

Однако я вижу эту кнопку, когда:

  1. Я открываю свое приложение в мобильном режиме Google Chrome
  2. Открываю эту страницу на айфоне: https://ace.c9.io

Кнопка, о которой я говорю:

В моем приложении:

UPD: еще более странно - когда я открываю нижеприведенный фрагмент с iPhone - я также вижу кнопку.

Так что вопрос скорее - из-за чего может пропадать эта кнопка на моей реализации.

Фрагмент, используемый для встраивания:

editor = ace.edit("editor");
editor.setOptions({
  mode: "ace/mode/python",
  wrap: "off",
  tabSize: 4,
  overwrite: false,
  useWorker: false,
  newLineMode: "auto",
  useSoftTabs: true,
  firstLineNumber: 1,
  indentedSoftWrap: true,
  navigateWithinSoftTabs: false,
 })
#editor { 
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
    }
<script src = "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<script src = "https://cdnjs.cloudflare.com/ajax/libs/ace/1.10.1/ace.js"
        integrity = "sha512-U/FB3cdRpCPIpdDLjvLQoqCiupCM95qGrIMZqb99+84XrRQp4EppJ0gfVZAL5kcI9owxxKxrMrrFDJP1RfKAXQ= = "
        crossorigin = "anonymous" referrerpolicy = "no-referrer"></script>

<div id = "editor"></div>

Невозможно воспроизвести на моем iPhone — опция Paste отображается и полностью функциональна во фрагменте выше.

esqew 24.11.2022 13:56

@esqew, развернул приложение, чтобы вы его увидели, и теперь я тоже его вижу 😁. Он не работает только для локальной отладки (через http) и работает через https. Спасибо! вы реально помогли!

Egor Wexler 24.11.2022 14:40
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
0
2
75
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Выяснил причину 🤦‍♂️ Кнопка вставки показывается только при размещении страницы по https

Я развернул свое приложение и теперь вижу кнопку. Однако он не отображается при локальной отладке (через HTTP).

кнопка вставки работает только при наличии navigator.clipboard. Браузеры теперь ограничивают его до localhost и https://

a user 24.11.2022 20:39

@auser, приятно знать. Поскольку приложение работало на ПК и обращалось по IP - это был ни локальный хост, ни https

Egor Wexler 24.11.2022 21:44

Другие вопросы по теме