Одна статья для понимания: поделитесь небольшой программой с кругом друзей [рекомендуемая коллекция]

задний план

Недавние новости о том, что мини-программа поддерживает обмен с кругом друзей, можно назвать блокбастером в кругу разработчиков мини-программы.Команда мини-программы Zhuan Zhuan также провела исследование, как только они получили приглашение WeChat, и быстро выполнила мини-программа Zhuan Zhuan. Чтобы поддержать эту возможность, в этой статье будет всесторонне интерпретирована эта способность WeChat.

Обзор

Эта возможность фактически разделена на два модуля:

1. Возможность поделиться небольшими программами в кругу друзей

2. Возможность открывать небольшие программы в кругу друзей

Поделитесь стилем в кругу друзей

Стиль открылся в кругу друзей

развивать

Так же берем два модуля, чтобы посмотреть:

1. Возможность поделиться небольшими программами в кругу друзей

Возможность отображения кнопки «Поделиться моментами» в интерфейсе апплета, текущие требования следующие:

1. Платформа Android:

Требуется WeChat версии 7.0.16 и выше, а базовая библиотека 2.11.13 и выше.Автор обнаружил в тесте, что эта возможность также связана с моделью.В настоящее время установлено, что одна модель OPPO не имеет кнопка поделиться с кругом друзей, и все модели Xiaomi имеют эту возможность.

2. Платформа IOS:

В настоящее время эта возможность не поддерживается, но более поздняя версия WeChat поддерживает возможность открывать небольшие программы в Moments (описано ниже).

Страница «Мини-программа» по умолчанию не открывает кнопку «Поделиться с моментами», если только она не установлена в коде:

1. Страница должна быть установлена Разрешить «Отправить друзьям», пример кода:

onShareAppMessage() {
    return {
      title: '买卖二手，省钱又赚钱！转转，一个帮你赚钱的网站！',
      path: '/pages/index/index',
      imageUrl:'https://pic5.zhuanstatic.com/zhuanzh/n_v2be00a9c4aa4941bf8567f5fd999e2709.png',
    }
}

2. Страница должна быть настроена Разрешить «Поделиться с друзьями», пример кода:

onShareTimeline() {
  return {
    title: '[小程序] 买卖二手，省钱又赚钱！转转，一个帮你赚钱的网站！',
    query: 'zzfrom=pyq'
  }
}

3. Включите кнопку «Поделиться моментами» в меню «Поделиться»:

wx.showShareMenu({
      withShareTicket: true,
      menus: ['shareAppMessage', 'shareTimeline']
})

Это требование не упоминается WeChat в документе, но фактическое измерение показало, что этот метод должен быть вызван до того, как появится кнопка «Поделиться с моментами».

в: 1. Последняя версия инструментов разработчика WeChat поддерживает отладку моделирования этой возможности. 2. Страницы с компонентами веб-просмотра не поддерживают совместное использование. 3. onShareTimeline — это новый жизненный цикл страницы, начиная с базовой библиотеки 2.11.3, и его поведение аналогично onShareAppMessage. 4. Жизненный цикл должен возвращать Object для пользовательского контента для совместного использования, в том числе:

title: общий заголовок, по умолчанию имя апплета
запрос: параметр, передаваемый на общей странице, используемый для указания источника канала и т. д.
ImageURL: совместное использование изображений, по умолчанию с использованием небольших программ LOGO

5. Особое внимание:Публикация в Moments не поддерживает параметр пути, то есть, на какой странице пользователь инициирует совместное использование, какая страница является общей.

Вышеупомянутое, наконец, требует от разработчиков внесения некоторых изменений в страницу обмена, потому что, когда мы делимся страницей в кругу друзей, пользователь при ее открытии переходит в «режим одной страницы». В этом режиме нельзя использовать многие SDK.

2. Возможность открывать небольшие программы в кругу друзей

Когда пользователь открывает общую страницу апплета в кругу друзей, он фактически не открывает апплет, а переходит на страницу «одностраничного режима» исходной страницы.Как упоминалось выше, исходная страница, совместно используемая пользователем и Страница "открыто в кругу друзей" "Одностраничный режим" - это фактически та же страница для разработчиков. Чтобы различать, WeChat дает два новых значения сцены:

1154: Круг друзей открывает апплет, то есть находится в "одностраничном режиме", и разработчики могут адаптироваться под это значение сцены.По идее, кроме этого значения сцены, это обычный режим.

1155: вход в обычный режим из «одностраничного режима». Поскольку это поведение является унифицированным поведением WeChat, разработчики не могут его пометить. Если вы хотите подсчитать это поведение, вы можете использовать это значение сцены.

Что нужно адаптировать для "одностраничного режима"?

У официального представителя WeChat есть следующее объяснение «одностраничного режима»:

1. В «Одностраничном режиме» панель навигации фиксируется в верхней части страницы, а заголовок отображается как заголовок при совместном использовании. Внизу закреплена панель действий.Нажмите «Перейти к мини-программе» на панели действий, чтобы открыть текущую страницу мини-программы. Верхняя панель навигации и нижняя панель действий не поддерживают пользовательские стили.

Стиль см. на картинке ниже

Стили в этих двух местах нельзя настроить.

Среди них пользователь может войти в обычный режим только через кнопку «Перейти к апплету» ниже.

Если в апплете используется настраиваемый заголовок навигации, требуются определенные адаптации.Например, наш апплет использует настраиваемый фон вверху.До адаптации он выглядит так:

Так как WeChat имеет фиксированный стиль для строки заголовка вверху, мы добавляем серый фон для заголовка, чтобы скрыть его.

2. «Одностраничный режим» запускает содержимое страницы апплета по умолчанию, но, поскольку верхняя панель навигации и нижняя панель операций фиксированы на странице, это может повлиять на макет страницы апплета. Поэтому разработчикам предлагается обратить особое внимание на адаптацию взаимодействия страниц в «одностраничном режиме» для достижения плавного и полного интерактивного взаимодействия.

Добавлены элементы конфигурации для одностраничного режима в app.json:

"singlePage" : {
  "navigationBarFit" : "" //float或squeezed
}

Эта конфигурация может установить поведение строки заголовка по умолчанию вверху, где:

По умолчанию:

Если на странице используется режим пользовательской панели навигации, значением по умолчанию для этого элемента является: float, что означает, что панель навигации перемещается по странице и не влияет на исходный макет страницы (но может блокировать некоторые элементы исходной страницы).
Если иначе, по умолчанию: сжатие, что означает, что страница сжимается на навигационной панели и не пересекается со страницей, то есть оставить фиксированное пространство в верхней части страницы для навигационной панели WECHAT и Оригинальная страница будет двигаться вниз

Конечно, эти два значения также могут быть установлены на разные значения в соответствии с потребностями страницы.

Еще одно замечание:

В одностраничном режиме safeArea, возвращаемый интерфейсом wx.getSystemInfo, представляет собой все пространство экрана, например:

Под iPhone 6 размер экрана 375x667.

В режиме одиночной страницы высота Safearea: 667
В обычном режиме высота safeArea составляет: 647

Если есть страницы, которые зависят от макета safeArea, их нужно адаптировать.

3. В «одностраничном режиме» некоторые компоненты или интерфейсы имеют определенные ограничения.

Это самый хлопотный момент для адаптации одностраничного режима, давайте сначала посмотрим, какие компоненты и интерфейсы нельзя использовать.

(Вы можете пропустить, чтобы увидеть сводку ниже)

Классификация	функциональные точки
компоненты	кнопка открытого типа , камера , редактор , форма , функционал-навигатор страниц , live-пушер , навигатор , панель навигации , официальный-аккаунт , открытые данные , веб-просмотр
маршрутизация	wx.redirectTo, wx.reLaunch, wx.navigateTo, wx.switchTab, wx.navigateBack
интерфейс	Панель навигации, панель вкладок
Интернет	mDNS, UDP-связь
интерфейс	Панель навигации, панель вкладок
кеш данных	Периодическое обновление
СМИ	VoIP, wx.chooseMedia, wx.chooseImage, wx.saveImageToPhotosAlbum, wx.chooseVideo, wx.saveVideoToPhotosAlbum, wx.getVideoInfo, wx.compressVideo
Место нахождения	wx.openLocation, wx.chooseLocation, wx.startLocationUpdateBackground, wx.startLocationUpdate
Вперед	wx.getShareInfo, wx.showShareMenu, wx.hideShareMenu, wx.updateShareMenu
документ	wx.openDocument
открытый интерфейс	Вход , Прыжок в мини-программу , Информация о пользователе , Оплата , Авторизация , Настройки , Адрес доставки , Купон , Счет , Биометрическая аутентификация , WeChat Sports , WeChat Red Packet
оборудование	Bluetooth, iBeacon, Wi-Fi, NFC, контакты, буфер обмена, телефон, код сканирования
рекламировать	объявление , wx.createRewardedVideoAd , wx.createInterstitialAd

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

Среди них самые влиятельные являются:

Авторизоваться

Вызов wx.login в одностраничном режиме не увенчается успехом, а это значит, что наша страница должна поддерживать отображение в состоянии без входа в систему (даже автоматический вход не поддерживается)

В связи с этим апплет Zhuanzhuan относительно прост при преобразовании:

if(this.scene == 1154) {
  this.$httpWithLogin = this.$http
}

То есть прямо в одностраничном режиме переписать все методы запроса интерфейса на методы запроса, не требующие состояния входа.

Для этого ограничения необходимо целенаправленно обрабатывать различные страницы мини-программы.

Прыгать

В одностраничном режиме не поддерживается метод перехода между страницами, то есть пользователь не может покинуть текущую страницу, пока не нажмет кнопку «Перейти к апплету», чтобы вернуться в обычный режим.

разное

Первоначальное намерение WeChat предоставить эту возможность — отображать больше контента в кругу друзей, а не хотеть, чтобы пользователи напрямую заходили в апплет.Однако в одностраничном режиме слишком много ограничений, и невозможно изменить их один за другим.Предложение автора состоит в том, чтобы решить проблему, которая мешает нормальному отображению страницы, и проблему, которая мешает основному процессу страницы.При использовании неподдерживаемых возможностей WeChat будет решать это следующим образом:

Если пользователь нажмет, WeChat унифицирует тост: «Пожалуйста, перейдите в апплет, чтобы использовать полный сервис».
Если нет поведения щелчка, метод войдет в логику отказа вызова:

Уведомление:

В одностраничном режиме по-прежнему поддерживаются различные взаимодействия, не покидающие страницу, такие как вкладки, слайд-шоу и т. д.
В одностраничном режиме только кнопка «Перейти к апплету» внизу может войти в обычный апплет
В одностраничном режиме им можно снова поделиться в кругу друзей, а также его можно отправить друзьям (через карточку апплета, открыв его, вы войдете в обычный апплет)
Ресурсы облачной разработки можно использовать в одностраничном режиме только при включенном незарегистрированном доступе:

По умолчанию разработка облачных ресурсов не разрешает доступ не вошедшим в систему, вам нужно в облачную консоль - не вошедшие разрешить доступ к глобальным настройкам вручную открыть облачную среду - настройка.

А в режиме входа контроль разрешений на стороне C должен использовать правила безопасности, то есть доступ к облачным функциям, базам данных и файловому хранилищу должен соответствовать правилам безопасности.Выберите и настройте правила безопасности в соответствующих настройках разрешений для облачные функции, базы данных и файловое хранилище. При доступе незарегистрированного пользователя поле auth правила безопасности пусто, поэтому можно сделать вывод, что запрос исходит от незарегистрированного пользователя.

Ландшафтное использование не допускается
Если страница содержит панель вкладок, панель вкладок не будет отображаться, включая пользовательские панели вкладок.
Локальное хранилище не используется совместно с обычным режимом апплета, который определяет одностраничный режим и обычный режим.Единственным способом связи друг с другом является значение сцены 1155.

Совместимость с более низкими версиями

Кнопка «Поделиться с моментами»: в настоящее время эта кнопка недоступна для WeChat низкого уровня.

Откройте мини-программу в «Моментах»: в документе WeChat сказано «да», WeChat с низкой версией откроет «Моменты», и вы перейдете на страницу с запросом на обновление, но это процесс постепенного охвата базовой библиотеки. оказалось, что достаточно версии iOS WeChat 7.0.14.Одностраничный режим отображается нормально.

Общая проблема

1. Настройки выставлены согласно документу, но не появляется кнопка поделиться с друзьями кругом

Возможные решения:

Вызовите метод wx.showShareMenu, чтобы открыть меню
Замена отладочного оборудования

2. Одностраничный режим не может быть нормально открыт

Прежде всего, рекомендуется использовать реальную машинную отладку для отладки одностраничного режима.

Во-вторых, проверьте, не блокируются ли какие-либо ключевые процессы ограниченными возможностями SDK.

Наконец, проверьте страницу на наличие ошибок

3, ошибка shareImageMessage

Ошибка связана с тем, что WeChat добавил внутренний метод в одностраничный режим: wx.shareImageMessage, и WeChat запрещает разрешение на чтение/перечисление этого метода, иначе он напрямую сообщит об ошибке.Многие разработчики в сообществе столкнулись с этой ошибкой, Апплет Zhuanzhuan также встречается, основные причины:

Код страницы или сторонний фреймворк/плагин содержит операции для копирования wx, подобные:

Object.assign({},wx)

Нам нужно найти такой код и сделать его совместимым, примеры следующие:

//先将报错方法设置为不可枚举
for (let key in wx) {
    try {
      if(wx[key]) {}
    }catch(e) {
      Object.defineProperty(wx,key,{
        enumerable:false
      });
    }
}
Object.assign({},wx)

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

Мнение автора

Наконец, я также хотел бы рассказать о своих взглядах на эту способность.

Wechat предоставляет эту возможность, которая может решить проблему, заключающуюся в том, что текущие мини-программы имеют плохой эффект перекомпоновки из круга друзей.Раньше единственным способом поделиться мини-программами в кругу друзей было создание QR-кода для картинку и поделиться ею.Однако, по опыту автора, этот эффект перекомпоновки этого метода становится все хуже и хуже, что сильно ограничивает возможности мини-программы по распространению в кругу друзей.WeChat хочет решить эту проблему, но Это очень сдержанно. WeChat не хочет, чтобы пользователи напрямую входили в мини-программу из круга друзей, но обеспечивает Одностраничный режим направлен на то, чтобы показать пользователям больше контента и привлечь пользователей для входа в мини-программу через контент. Разрыв с нашими ожиданиями, эта способность действительно сильно повлияет на распространение Мини-программы в кругу друзей.Считается, что все больше и больше небольших программ будут поддерживать эту способность.

об авторе

Чжан Суён

Персональный человек, отвечающий за операционный центр платформы Zhuanzhuan, имеет углубленные исследования в полевом поле, в том числе: эскиз одним щелчком мыши нарезки резки карты, моделирование данных, базовое наращивание малых программ и т. Д. Среди 10 лет опыта работы он был инженером в течение 2 лет, 5 лет генеральным директором, 3 года техническим управлением, может написать некоторые статьи, а также является отличным автором самородков в 2018 году.