проблемы с приложением wechat
Я давно знал, что подводный камень мини-программ очень глубок. После более чем месяца практики я обнаружил, что этот подводный камень действительно заслуженный...
Однако разработанная небольшая программа была запущена в намеченные сроки, и это до сих пор стоит отметить! ! ! Ха-ха, записывай моменты, которые заставляют тебя остановиться.
1. Подводные камни, возникающие при разработке мини-программ WeChat
- 1. {{}} не может выполнять методы и может обрабатывать только простые операции, такие как «+ - * /». Например, при перемещении по списку необходимо форматировать количество каждого элемента. Его можно отформатировать только в предварительном формате. js, а затем setData Once (╯□╰)
- 2. Можно только пройти, можно только пройти, обновить представление можно только через setData(), ловушка...
- 3. Мы оговариваем, что путь к странице может состоять только из пяти уровней. Старайтесь избегать многоуровневого взаимодействия.
- 4. Страница A -> Страница B, страница B возвращается к A, как запустить обновление A без повышения уровня страницы. Решение, которое сейчас приходит на ум: записать логику данных инициализации A в событие onshow на странице A.
- 5.
undefined рассматривается как строка if(xxx == "undefined") [Итеративная оптимизация в более поздних версиях] - 6. При возникновении странных проблем (например, стилей и т. д.) сначала перезапустите инструмент, и после повторных попыток он никогда не заработает.
- 7. Локальные веб-шрифты не поддерживаются (необходимо использовать онлайн-шрифты). После тестирования выяснилось, что некоторые устройства Android не могут отображаться должным образом. После долгих хлопот я обнаружил, что сервер, на котором изначально нужно было хранить шрифты, должен был поддерживать междоменный доступ. Блин, никаких ошибок при отладке на мобиле я почти отказался от веб-шрифтов. Я застрял надолго, это ловушка...
- 8. Если локальные ресурсы невозможно получить через CSS, вы можете использовать сетевые изображения, base64 или использовать тег
<image/>
. - 9. Page.data нельзя использовать напрямую [Избегайте прямого назначения и изменения Page.data, используйте Page.setData для синхронизации данных со страницей для рендеринга]
- 10. Используйте type="digit" для цифровой клавиатуры.
- 11. Что произойдет, если вы использовали https, но он сообщает, что вы не можете установить безопасное соединение с сервером [Вам необходимо настроить nginx для настройки стандарта шифрования https на tls1.2 и выше]
- 12. wx.setStorage(OBJECT) [В настоящее время размер каждой мини-программы ограничен 5 МБ]
- 13. Мониторинг данных [бэкэнд WeChat: фактическое количество посещений/обзор вчерашнего дня/кумулятивное количество посещенных пользователей/ТОП посещенных страниц]
- 14. Артефакт отладки WeChat, ngrok, см. ngrok.
- 15. Добавьте эффект клика для просмотра [необходимо включить эффект наведения]:
< view hover hover-class =" item-hover " >
- 16. Метод отладки авторизации пользователя [Инструменты разработки-》Очистить данные авторизации мобильного телефона (Кэш-Очистить данные авторизации мобильного телефона)]
- 17. При первой загрузке мини-программы на телефоне Android на домашней странице дважды непонятным образом загрузится метод onshow, но на iPhone он не загрузится, так как его нужно запустить в onshow. получить информацию о пользователе, система дважды загрузит onshow. В фоновом режиме появится сообщение об ошибке. . .
- 18. Отключить раскрывающийся список страниц: установите «disableScroll»: true.
- 19. В Android появится getAppConfig:fail, и получить информацию о пользователе невозможно. Проблема с WeChat. Загрузите последнюю версию установочного пакета WeChat.
- 20. Фон не может принимать данные POST, но может получать параметры запроса GET.
url: url,
data: data,
method: "POST",
dataType: "json",
header: {
'content-type': 'application/x-www-form-urlencoded' //==> 此处若为application/json则服务端无法获取POST的参数
}
- 21. После того, как пользователь откажется от авторизации при первом запуске мини-программы, всплывающее окно авторизации не может быть вызвано в следующий раз, и последний выбор пользователя будет запомнен по умолчанию. Решение пока не найдено, и у WeChat нет соответствующего анализа. 【10 января 2017 г.】 WeChat обновил API (wx.authorize(OBJECT)) для поддержки вызова всплывающих окон авторизации【05 июля 2017 г.】
- 22. Чтобы перейти на страницу с панелью вкладок, необходимо использовать wx.switchTab(). Об этом спрашивают в различных группах почти каждый день! ! !
- 22. При привязке разработчиков/экспертов не забудьте подтвердить приглашение на своем мобильном телефоне. (Многие спрашивали)
- 23. В фоновом режиме WeChat обновлено легальное доменное имя запроса. Вы можете напрямую перейти в Инструменты разработки WeChat -> Проект -> Информация о конфигурации -> Обновить, и это вступит в силу немедленно.
- 24. Официальная мини-программа не предоставляет пример расшифровки информации для входа в версию Java. Вы можете использовать эту демонстрационную версию расшифровки Java-версии.
- 25. При использовании wx:for для обхода лучше всего добавлять wx:key="{{item.id}}", если вы четко знаете, что список статический, или вам не нужно обращать внимание на его порядок. , вы можете игнорировать его. Однако если пройденный массив изменится, последовательность данных может измениться.
- 26. Удобство страницы разработки мини-программы — rpx, поэтому для эскиза дизайна рекомендуется использовать размер iPhone 6. Информацию о гибком макете см. в этой статье.
- 27. Апплет WeChat по умолчанию отслеживает изменения файлов, а затем автоматически обновляет их. Но недостатком является то, что он каждый раз полностью обновляется вместо горячей замены модулей, что влияет на скорость разработки. Особенно для разработчиков, которые любят частые команды Command + S, вы обнаружите, что ваша мини-программа постоянно обновляется. @MinJieLiu
- 28. Мини-программа WeChat поддерживает компонент
web-view
начиная с базовой библиотеки 1.6.4
, то есть мини-программа поддерживает возможность встраивания веб-страниц. Однако при ее использовании выяснилось, что веб-страницу невозможно встроить. отображается в инструментах разработчика, но предварительный просмотр для мобильных устройств может быть [обновлен] Последняя версия клиента WeChat]. Причина в том, что используемая базовая библиотека не поддерживает компонент web-view
, и эту проблему можно решить, выбрав последнюю базовую библиотеку. следующее:
- 29. Связь между H5 и мини-программами не поддерживается и не может передаваться через локальное хранилище или другими способами. Если вам абсолютно необходимо перенести параметры, вы можете попробовать перенести их в URL-адрес
web-view
, но это не рекомендуется. авторизоваться можно через официальный аккаунт. Открытые возможности веб-просмотра (веб-страницы должны включать jssdk): Интерфейсы JSSDK, поддерживаемые на веб-страницах: - 30. Веб-просмотр в настоящее время не поддерживает оплату WeChat.
- 31. В мини-программе часть
catch
оператора try...catch
использует throw
для выдачи ошибки, которую невозможно перехватить внешним оператором try...catch
.
2. Соответствующие конфигурации перед разработкой мини-программы.
- 1. Вход ---> Администратор сканирует QR-код --> Настройки --> Настройки разработки --> Создать AppSecrect.
- 2. Вход в конфигурацию сервера ---> Администратор сканирует QR-код --> Настройки --> Настройки разработки --> Доменное имя сервера --> Сканировать QR-код.
- 3. Привяжите идентификатор пользователя разработчика -> Разработчик -> До 10 разработчиков QR-кода.
- 4. Привяжите личность пользователя, испытывающего опыт --> Опытный пользователь --> Отсканируйте QR-код для 20 участников.
3. Выпуск мини-программы
Публикация возможна только с учетной записью администратора. Шаги следующие:
- Выйдите из учетной записи разработчика в инструментах разработки.
- Администратор сканирует QR-код, чтобы войти в инструменты разработчика, загрузить -> установить фон WeChat в качестве пробной версии -> просмотреть -> опубликовать.
Примечание. Время рассмотрения варьируется от 2 до 6 дней.
4. Сбор причин непрохождения экспертизы
- 1. Введение в мини-программу не знакомит с ее функциями.
- 2. Категория не соответствует содержанию, представленному на странице.
- 3. Услуги и контент, предоставляемые мини-программой, должны быть формальными и не могут быть представлены в качестве тестового контента или представлены в качестве тестового контента несколько раз.
- 4. Если он содержит аудио- и видеоконтент, добавьте соответствующие категории.
- 5. Картинки и текст на главной странице перекрывают друг друга, поэтому рекомендуется их оптимизировать.
- 6. Поле поиска можно выбрать только после нескольких кликов. При нажатии на комментарии страницы нет ответа. Искажается разрешение и размер изображений страницы.
- 7. На некоторых фотографиях видно, что они были сдавлены, а медицинский осмотр неудовлетворителен.
- 8. Мини-программы с системой учетных записей должны поддерживать авторизованный вход WeChat в дополнение к своим собственным методам входа.
- 9. Для услуг, для использования которых необходимо войти в систему, предоставьте тестовую учетную запись.
- 10. Существует онлайн-торговля виртуальными предметами. Для системы iOS требуется IAP. Мини-программа на данный момент не платит. Обратите внимание на последующие действия.
- 11. Основное содержание страницы, соответствующей категории услуг мини-программы, должно соответствовать этой категории.
- 12. Необходимо обеспечить, чтобы пользователи могли использовать категорию услуг на этой странице и не могли скрываться или совершать несколько переходов.
- 13. Не показывайте и не рекомендуйте сторонние мини-программы. Пример: навигация по мини-программам, продвижение ссылок на мини-программы, рейтинг мини-программ и т. д. невозможны.
- 14. В содержимом страниц мини-программ присутствуют побуждения, включая, помимо прочего, побуждение поделиться, побуждение добавить, побуждение подписаться на общедоступные учетные записи, побуждение к загрузке и т. д. Программы, которые требуют от пользователей делиться, добавлять, подписываться или загружаемые до того, как они смогут работать, содержат мини-программы, которые выражают или подразумевают копирайтинг, изображения, кнопки, наложения, всплывающие окна и т. д., которыми пользователи делятся, мини-программы, которые побуждают пользователей делиться и распространять их из-за искушения выгоды, мини-программы, которые использовать преувеличенные слова, чтобы принудить или побудить пользователей поделиться, заставить или побудить любые мини-программы, добавленные пользователями, будут отклонены;
- 15. Запретите автоматическое воспроизведение мультимедиа, например видео, музыки и голосов.
- 16. Если в мини-программе есть система учетных записей, она должна предоставлять возможность выхода из учетной записи, которую можно использовать в обычном режиме и которую легко найти.
- 17. Содержание мини-программы не может включать в себя азартные игры, викторины и розыгрыши.
- 18. В контенте страницы мини-программы не может присутствовать тестовый контент, примеры: гадание, лотерея, гороскоп и т.п.
Распространенные ситуации отказа на других платформах мини-программ WeChat
5. Документация и сообщество
- 1.Официальные документы
- 2. Официальные вопросы и ответы
- 3. Официальное сообщество
- 4. Мини-руководство по доступу к программам
- 5. Общие часто задаваемые вопросы о мини-программах
6. код
- 1. Инкапсулируйте интерфейс запроса на инициацию WeChat. Если вход не удался, запрос на вход будет автоматически инициирован по умолчанию.
/**
* 发起的是 HTTPS 请求
* @pram url: 请求地址,协议必须为https
* @pram data 请求参数请求参数
* @param success 请求成功回调
* @param fail 请求失败回调
* @param complete 请求完成(成功或者失败)回调
*/
function request ( url , data , success , fail , complete ) {
var _url = url ,
_data = data ,
_success = success ,
_fail = fail ,
_complete = complete ;
wx . request ( {
url : url ,
data : data ,
method : "POST" ,
dataType : "json" ,
header : {
'content-type' : 'application/x-www-form-urlencoded' ,
'Client-Agent' : getSystemInfo ( ) ,
'WX-SESSION-ID' : wx . getStorageSync ( constant [ 'WX-SESSION-ID' ] ) //每次请求带上登录标志
} ,
success : function ( res ) {
if ( res . data . code == "-9999" ) { //会话失效重新登录
requestLogin ( function ( ) {
constant [ 'NUM_TRY_LOGIN' ] ++ ;
//设置请求上限,防止重复提交并死循环
if ( constant [ 'NUM_TRY_LOGIN' ] < constant [ 'LIMIT_NUM_TRY_LOGIN' ] ) {
request ( _url , _data , _success , _fail , _complete ) ;
}
} ) ;
return ;
}
if ( res . data . code == "0" ) {
if ( typeof _success == "function" ) {
_success ( res . data ) ;
}
} else {
wx . showToast ( { title : res . data . msg , icon : 'loading' , duration : 2000 } ) ;
return ;
}
} ,
fail : function ( res ) {
if ( typeof _fail == "function" ) {
_fail ( res ) ;
}
if ( typeof _fail == "string" ) { //请求失败的弹框提示
wx . showToast ( { title : _fail , icon : 'loading' , duration : 2000 } ) ;
}
} ,
complete : function ( res ) {
if ( typeof _complete == "function" ) {
_complete ( res ) ;
}
}
} ) ;
}
- 2. Запросить интерфейс входа в систему
/**
* 请求登录,获取用户相关信息
* @param callback
*/
function requestLogin ( callback ) {
var _callback = callback ;
wx . login ( {
success : function ( event ) {
// 获取到请求码,继续请求用户的基本信息
if ( event . code ) {
var code = event . code ;
wx . getUserInfo ( {
success : function ( res ) {
var data = {
code : code ,
encryptedData : res . encryptedData ,
iv : res . iv ,
signature : res . signature ,
rawData : res . rawData
}
var url = domain + "/wx_xxx" ; //请求登录地址
request ( url , data ,
function ( res ) { //success
if ( res . code == "0" ) {
//此处可以将服务端返回的登录状态保存起来
wx . setStorageSync ( constant [ 'WX-SESSION-ID' ] , res . object . sessionId ) ;
if ( typeof _callback == "function" ) {
_callback ( ) ;
}
}
} ,
function ( res ) { //fail
wx . showToast ( { title : '请求登录失败' , icon : 'loading' , duration : 2000 } ) ;
}
) ;
} ,
fail : function ( res ) {
//用户拒绝授权
if ( res . errMsg == "getUserInfo:cancel" || res . errMsg == "getUserInfo:fail auth deny" ) {
wx . redirectTo ( { //跳转至未授权页面
url : '../xxx-page/xxx-page'
} ) ;
}
}
} )
} else {
wx . showToast ( { title : '微信登录失败' , icon : 'loading' , duration : 2000 } ) ;
}
} ,
fail : function ( res ) {
wx . showToast ( { title : '微信登陆失败!' , icon : 'loading' , duration : 2000 } ) ;
}
} ) ;
}