Firebase google что это: что такое, для чего нужно, как читать и записывать данные

Содержание

что такое, для чего нужно, как читать и записывать данные

Firebase — это облачная база данных, которая позволяет пользователям хранить и получать сохраненную информацию, а также имеет удобные средства и методы взаимодействия с ней.

Firebase хранит текстовые данные в JSON формате и предоставляет удобные методы для чтения, обновления и извлечения данных. Также, Firebase может помочь с регистрацией и авторизацией пользователей, хранением сессий (авторизованные пользователи), медиафайлов к которым с легкостью предоставляет доступ благодаря Cloud Storage.

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

Зачем нужна Firebase, ведь есть другие базы данных…

Единственная причина, по которой я изначально заинтересовался Firebase, это гибкость и скорость деплоя в проект.

Вот смотрите: языки программирования Python и JavaScript сами по себе гибкие (и очень популярные). Благодаря этому, мы (разработчики) получаем мощный инструмент для создания в кратчайшие сроки сайта, веб-приложения, мобильного или даже десктопного приложения.

Firebase позволяет сохранять эту скорость. Не нужно отвлекаться на какие-то другие вещи (создание базы данных, написание API приема и получения данных). Вся серверная часть ложится на плечи этого сервиса. Благодаря такому мощному инструменту можно за один вечер накидать функционал любого модуля с чтением, сохранением данных и показать заказчику функциональный пример. 

Ну а если у Вас маленькое SPA-приложение или простенькое мобильное, где все сводится к манипулированию каких-то текстовых значений, можно использовать Firebase как основную базу данных. И даже платить не надо. 

Панель управления Firebase

Переходим к практическому ознакомлению, давайте все щупать руками. Мы посмотрим, что находится внутри “Консоли разработчика” Firebase, познакомимся с интересными методами и отправим пару тестовых запросов. Примеры я буду показывать на JavaScript в проекте где используется Webpack и менеджер пакетов npm. Основа, все же, это JavaScript, поэтому не пугайтесь.

Регистрация

Сначала нужно перейти на сайт и зарегистрироваться в Firebase. Можно использовать свою Google почту для быстрой регистрации.

Нажимаем на большую кнопку “Добавить проект”. По желанию подключаем Google Аналитику. Возможно (не знаю осталось ли это в новой версии), вас попросит выбрать местоположение проекта, просто выберите свою страну.


Внутри консоли сегодня нас интересуют только 3 вещи: настройки проекта, база данных и аутентификация. Если моя статья Вас заинтересует, то с остальными функциями Firebase можете ознакомиться сами. Все ссылки я оставлю. Например, Storage — это хранилище медиафайлов, но с ним мы сегодня работать не будем 

Установка в проект за 60 секунд

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

Прежде чем добавлять данный код в проект, нужно установить Firebase в свое приложение. Делается это очень легко с помощью команды:

npm install firebase --save

Если у вас Mac или Linux добавьте перед npm команду sudo. 

P.S: Если не учитывать, что пакеты будут устанавливаться около 3-4 минут, заголовок раздела полностью оправдывает себя. Ну ведь правда, за 60 секунд вполне реально подключить Firebase.

И не забудьте добавить firebase в проект.

import firebase from 'firebase/app'
import 'firebase/auth'
import 'firebase/database'
import 'firebase/storage'
import 'firebase/messaging'

Можно, конечно, просто добавить одну строчку: 

import firebase from 'firebase/app'

Но тогда вес исходного файла dist.js, который собирается с помощью webpack для prodaction версии приложения будет нереально большой. Поэтому я просто выбрал то, что мне пригодится для примера. 

Теперь вставляем код из конфигурации и запускаем метод firebase.initializeApp(), в аргумент которого складываем объект config. Все это делаем во время инициализации (начала работы) вашего приложения. Пример с моего проекта:

Вот и все. Давайте посмотрим на полную мощь этого инструмента. Теперь можно перейти к регистрации пользователей.

Регистрация и авторизация пользователей за 5 минут

Для начала вернемся в консоль Firebase и перейдем на страницу “Аутентификация”. Здесь есть две вкладки, это Пользователи и

Метод регистрации

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

Метод firebase.auth().createUserWithEmailAndPassword()

С помощью этого метода мы создаем нового пользователя. 

const data = firebase.auth().createUserWithEmailAndPassword(email, password)

После удачной регистрации константа data будет содержать в себе данные пользователя. Например, если вывести в консоль data.user.uid, можно увидеть уникальный идентификатор, который теперь присвоен этому пользователю.

Пример кода:

async registration(email, password) {
    try {
        const data = await firebase.auth().createUserWithEmailAndPassword(email, password)
        console.log(data.user.uid)
    } catch (error) {
        console.log(error.message)
        throw error
    }
}

Я создал асинхронную функцию (если с ними не знакомы, можете прочитать статью по ссылке). В конструкции try я создаю константу data, которая ждет await метод firebase. Благодаря волшебному слову await моя async функция превращается в промис и ждет заполнения переменной data. После заполнения (удачной регистрации) она превратится в объект и будет содержать в себе данные о пользователе. Т.е потом, можно вызвать эту переменную в консоль.

Например, можно вызвать console.log(data) и получить огромный объект с кучей разных атрибутов. В моем примере, через console.log(data.user.uid), вызывается уникальный идентификатор пользователя (которого мы только что зарегистрировали).

В сам метод firebase.auth().createUserWithEmailAndPassword() я отправляю почту пользователя и будущий пароль.

В catch мы можем попытаться поймать объект error.

Из объекта error вы можете выдергивать сообщения или статус коды ошибок. Кстати, статус коды полезная вещь, ведь сообщения приходят на английском. Я лично обрабатываю только статус коды и вывожу через switch нужное сообщение пользователю.

Обработка ошибок из моего приложения:

Оставлю полезную ссылку на все статус-коды ошибок у авторизации. У каждого метода свои статус коды ошибок!

Метод firebase.auth().signInWithEmailAndPassword()

Это метод авторизации. Давайте сразу на примере. Смотрим в конструкцию try.

Пример кода:

async login(email, password) {
           try {
               const data = await firebase.auth().signInWithEmailAndPassword(email, password)

               console.log(data.user.uid)
           } catch (error) {
               console.log(error.message)
               throw error
           }
       }

Все такая же async функция и await метод. В await метод firebase.auth().createUserWithEmailAndPassword() я передаю почту и актуальный пароль пользователя. 

После прохождения авторизации (успешного выполнения метода firebase.auth().createUserWithEmailAndPassword()) константа data будет содержать в себе объект user с его идентификатором. Если пароль (ну или еще что-нибудь) будет неверным, сработает метод catch и firebase ответит ошибкой.

Через catch мы как раз и ловим сообщения об ошибках от метода firebase.

Метод firebase.auth().onAuthStateChanged()

С помощью этого метода мы можем получить авторизованного пользователя. Это что-то вроде сессии. Пока сессия существует, мы можем использовать некоторые глобальные переменные Firebase. Например, получить объект user, в котором есть идентификатор авторизованного пользователя. Сама сессия существует пару дней и привязывается к ip адресу (но это не точно).

Пример кода:

firebase.auth().onAuthStateChanged(user => {
  if (user) {
    // Какая-то логика
  } else {
    this.$router.push('/login')
  }
})

Как видите, если user существует — я что-то делаю с этим. Если нет, отправляю человека на страницу авторизации с помощью методов из Vue.js.

Ну что, впечатлены? Если бы вы это делали второй или третий раз, то потратили не больше 10 минут на полноценную регистрацию и авторизацию пользователей.

Чтение, запись и обновление данных

Снова возвращаемся в консоль. В левом меню выбираем Database. Это и есть наша база данных. Здесь нам предлагают создать либо облачную базу данных, либо Realtime Database. Выбирайте Realtime Database.

Почему Realtime Database?

Потому что она старше, стабильней и почти любая проблема с ней освещена в интернете.

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

Возвращаемся к работе с данными

Чтобы контекст был понятен, так выглядит моя база на данный момент:

Метод firebase.database().ref().push()

Для записи данных в Firebase используем метод firebase.database().ref().push().

Пример кода:

async newClient(newClinet) {
           try {
               const addClient = await firebase.database().ref('clients').push(newClinet)

               console.log(addClient)
           } catch (error) {
               console.log(error.message)
               throw error
           }
       }

Нам нужно создать асинхронную функцию. К методу firebase мы добавляем await. Если дальше хотим как-то обработать ответ от базы данных асинхронные функции обязательны.

Здесь в асинхронной функции newClient я передаю аргумент newClient. Данный аргумент содержит какой-то объект с данными, далее этот объект (новый клиент) я отправляю в Firebase.

Метод ref() содержит в себе путь, куда мы будем что-то добавлять. Для более детального понимания смотрите скриншот выше, там копия моей базы. Данного пути еще может даже не существовать, поэтому с помощью этого метода можно создавать новые хранилища (объекты в json хранилище).

Метод push() содержит в себе данные, которые мы будет отправлять в объект clients. 

Представим, код выше я запустил 3 раза. Результат запросов вы можете увидеть все на том же скриншоте выше. Как видите Firebase сама создала главный объект (хранилище) clients и записала в него три объекта поменьше. Каждому объекту Firebase сгенерировала свой ключ (идентификатор). Он уникален в рамках объекта clients.

Метод firebase.database().ref().once()

Для получения данных из Firebase используем метод firebase.database().ref().once(). 

Пример кода:

async loadClietsList() {
           try {
               const query_clientsList = await firebase.database().ref('clients').once('value')
               const clientsList = query_clientsList.val()         
               console.log(clientsListArray)
           } catch (error) {
               console.log(error.message)
               throw error
           }
       }

Нам нужно также создать асинхронную функцию. Методу firebase мы добавляем await. Константа query_clientsList содержит в себе вышеописанный метод. В ref указывается путь к объекту, который хотим получить. Посмотрите на скриншот выше, clients у меня находятся в основе моей базы данных, поэтому путь выглядит у меня максимально простым.

Если я хочу обратиться к какому-то клиенту из clients в ref, я укажу еще его идентификатор, получится ref(‘clietns/-M5mvz6HSFnbP3L2KiHG’), а если я хочу взять номер телефона конкретного клиента, ref будет выглядеть так ref(‘clietns/-M5mvz6HSFnbP3L2KiHG/number’).

После ref идет обязательный метод once(‘value’). Т.е мы говорим Firebase, что хотим по этой ссылке получить какие-то значение.

Когда await выполнится, и константа query_clientsList заполнится, мы можем воспользоваться методом val() по отношению к константе. Например, query_clientsList.val(). Если эту конструкцию мы попробуем отправить в консоль, то увидим заветные данные: три клиента из моей базы данных.

Метод firebase.database().ref().remove()

Данный метод отвечает за удаление данных из нужного объекта.

Пример кода:

firebase.database().ref('clients').remove()

Такая команда полностью удалит весь объект clients.

Если путь у ref() будет примерно такой: ‘clients/-M5mvz6HSFnbP3L2KiHG’, то удален будет только тот объект в clients, который имеет данный идентификатор.

Права доступа

В базе данных есть вкладка “Правила”. 

В самом начале раздела “Чтение, запись и обновление данных” я попросил вас установить правила чтения и записи базы данных в тестовый режим. Когда вы закончите разработку приложения, вы обнаружите, что ваши данные могут менять и получать абсолютно все, у кого есть ваш конфиг. 

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

В правах доступа используется свой “язык” оперирующий значениями true и false. На скриншоте выше мои настройки, здесь я просто запретил чтение и запись всем, кто не авторизован. Мое приложение это обычная CRM система для малого бизнеса, у нее общее хранилище и данными внутри управляют 3-4 человека, а свободная регистрация вообще отсутствует, поэтому таких настроек хватает. 

Ваше приложение — ваша логика, поэтому позаботьтесь о безопасности.

P.S: Как и обещал, ссылка на документацию к Storage.

Вывод

Надеюсь, вы впечатлены мощью инструмента Firebase и обязательно с ним ознакомитесь хотя бы в тестовых целях.

Синхронизация Google Sheets с базой данных Firebase в реальном времени 

Часто при тестировании дизайна полезно создать прототип с реалистичными данными. Пользователи склонны давать лучшие отзывы, когда содержание правдоподобно, а не заполнено текстом «lorem ipsum». В этом коротком руководстве мы покажем, как синхронизировать электронную таблицу Google Sheets с базой данных Firebase Realtime и использовать ее в своем высокоточном прототипе в качестве источника данных.

В целом, использование базы данных в реальном времени проще и быстрее, чем непосредственное использование Sheets API. Уровень Firebase также поддерживает до 100 000 одновременных подключений против 400 с использованием Sheets API. После синхронизации электронной таблицы вы можете легко использовать любой стек для доступа к вашим данным. Это также дает заинтересованным сторонам и исследователям простой способ манипулировать данными, видеть изменения в реальном времени и очень быстро тестировать множество вариантов.

Шаг 1: Создайте свой проект Firebase

Если вы еще этого не сделали, зарегистрируйтесь в Firebase, используя бесплатную подписку, а затем создайте свой проект.

Шаг 2: Создайте Realtime базу данных

Перейдите в Develop -> Database и нажмите кнопку «Create database».

Убедитесь, что вы изменили свои права на чтение и запись на «true» и нажмите «Опубликовать».

Скопируйте URL базы данных. Нам он понадобится позже.

URL вашей базы данных будет уникальным для вашего проекта.

Шаг 3. Создайте электронную таблицу и заполните ее, используя следующий формат

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

Вы можете добавить столько строк или столбцов, сколько вам нужно.

Шаг 4. Создайте свой проект Apps Script

В меню выберите Tools -> Script editor.

Вы попадете в редактор кода со следующим открытым файлом: Code.gs.

Замените содержимое этим фрагментом.

Найдите этот код в верхней части файла:

Замените параметр «spreadsheetID» своим собственным. Идентификатор — это выделенная жирным шрифтом часть полного URL-адреса электронной таблицы например:

https://docs.google.com/spreadsheets/d/spreadsheetID/edit#gid=0)

Замените заполнитель «firebaseUrl» на URL вашей базы данных из шага 2.

В вашем меню выберите View -> Show manifest file, который добавит файл с именем appsscript.json.

Это добавит файл appsscript.json в ваш проект. Замените содержимое следующим фрагментом.

Шаг 5: Запустите синхронизацию

В меню выберите Run -> Run function -> initialize. Вы увидите приглашение просмотреть и принять разрешения. Это позволяет проекту App Script получить доступ к электронной таблице и загрузить данные в Firebase. Нажмите Review Permissions, а затем нажмите Allow.

Превосходно! Ваша база данных Firebase Realtime теперь заполнена данными из вашей электронной таблицы! Любые дальнейшие изменения будут синхронизироваться без проблем, и вы даже сможете поделиться своей таблицей с другими людьми.

Советы и хитрости

Добавить безопасности

Если вы чувствуете себя модно, вы можете добавить немного больше безопасности в базу данных Firebase. Перейдите в Firebase Console -> Database и измените ваши правила на следующие.

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

Генерация массива

В списке, если ваш идентификатор начинается с 0 и увеличивается на 1, сценарий сгенерирует массив вместо пар ключ-значение.

Вложенные данные

При преобразовании таблицы в JSON можно выполнить только один уровень вложенности. Но что, если вам нужны вложенные данные? Приведенный выше скрипт имеет специальную функцию, которая позволяет создавать вложенный объект. Просто назовите заголовок столбца с путем к ключу соединения объектов, используя двойное подчеркивание __. Если вы хотите поместить улицу под адресом, вы можете просто сказать «address__street», это означает, что у вас не может быть столбца с именем только адрес в вашем списке.

Это создаст объект, подобный представленному ниже, и вы также можете вкладывать его на любом уровне.

Попробуйте! Вы не будете разочарованы…

Мы думаем, что техника, которую мы описали, поможет вашим прототипам с реалистичными данными. Наша цель — помочь сократить количество времени, которое вы тратите на ввод данных, и высвободить больше времени для экспериментов и повторений! 

Перевод статьи: Sync Google Sheets to a Firebase Realtime Database
Источник: medium.com

Как добавить рекламу AdMob + Firebase

В этой статье я расскажу как добавить в свое android-приложение самые популярные виды рекламы AdMob, и что изменилось с добавлением поддержки Firebase.

Ранее я уже публиковала статьи (раз и два) об AdMob рекламе, но сервис не стоит на месте, все меняется, поэтому я решила написать очередную статью — руководство.

После создания проекта в Android Studio нам нужно подключить необходимые для рекламы AdMob библиотеки. Сейчас они находятся в пакете com.google.firebase:firebase-ads, так что добавим следующую строчку в build.gradle уровня приложения (./app/build.gradle):

implementation 'com.google.firebase:firebase-ads:17.1.2'

Итак, посмотрим, как же добавить разные виды рекламы AdMob — баннер, полноэкранную рекламу (interstitial) и видео-рекламу с вознаграждением (rewarded video). Для этого разместим на экране MainActivity две кнопки для полноэкранной и видео-рекламы, а снизу повесим баннер.

Файл activity_main.xml зададим следующим образом:

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:ads="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:layout_gravity="center">

        <Button
                android:id="@+id/btn_interstitial"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:onClick="onShowInterstitial"
                android:text="Interstitial"/>

        <Button
                android:id="@+id/btn_video"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:onClick="onShowRewardedVideo"
                android:text="Rewarded Video"/>

    </LinearLayout>

    <com.google.android.gms.ads.AdView
            android:id="@+id/banner_ad"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom|center_horizontal"
            ads:adSize="BANNER"
            ads:adUnitId="@string/banner_id">
    </com.google.android.gms.ads.AdView>

</FrameLayout>

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

<com.google.android.gms.ads.AdView
        android:id="@+id/banner_ad"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|center_horizontal"
        ads:adSize="SMART_BANNER"
        ads:adUnitId="@string/banner_id">
</com.google.android.gms.ads.AdView>

Параметр adSize здесь установлен как SMART_BANNER, чтобы высота баннера автоматически подстраивалась под параметры экрана. Вот таблица соответствия высоты баннера к высоте экрана:

Высота баннераВысота экрана
32 dp≤ 400dp
50 dp> 400 dp и ≤ 720 dp
90 dp> 720 dp

А вот все возможные варианты размеров для баннеров:

Размер в dp (WxH)ОписаниеПоддержкаЗначение AdSize
320×50BannerPhones and TabletsBANNER
320×100Large BannerPhones and TabletsLARGE_BANNER
300×250IAB Medium RectanglePhones and TabletsMEDIUM_RECTANGLE
468×60IAB Full-Size BannerTabletsFULL_BANNER
728×90IAB LeaderboardTabletsLEADERBOARD
Ширина экрана x 32|50|90Smart BannerPhones and TabletsSMART_BANNER

Параметр adUnitId должен содержать Ad Unit Id для заранее созданного баннера на сайте AdMob. В данном проекте мы будем все id рекламы хранить в файле /res/values/ads.xml :

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <string name="app_id">ca-app-pub-3940256099942544~3347511713</string>
    <string name="banner_id">ca-app-pub-3940256099942544/6300978111</string>
</resources>

Здесь и далее я указываю тестовые id рекламы от Google, их можно использовать для разработки и тестирования.

Пока в файле всего два id, для приложения в целом и для нашего баннера в нижней части экрана.

Теперь проверим работает ли баннер, и для этого нужно добавить пару строк кода в MainActivity. Для начала инициализируем рекламную SDK в onCreate():

MobileAds.initialize(this, getString(R.string.app_id))

И настроим загрузку баннера:

val adView = findViewById<AdView>(R.id.banner_ad)
adView.loadAd(getAdRequest())

Функция getAdRequest() вспомогательная — т.к. мы будем часто создавать объект класса AdRequest, я вынесла этот процесс в отдельную функцию:

private fun getAdRequest(): AdRequest {
    return AdRequest.Builder().build()
}

Также не забудьте добавить в манифест в тело тега application следующие данные:

<meta-data
    android:name="com.google.android.gms.ads.APPLICATION_ID"
    android:value="@string/app_id"/>

И разрешение на использование интернета (в тело тега manifest):

<uses-permission android:name="android.permission.INTERNET"/>

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

Ура, первый блок готов!

Interstitial

Теперь перейдем к полноэкранной рекламе. По нажатию на кнопку btn_interstitial на экране должен появиться рекламный блок, но для удобства пользователя мы начнем загружать рекламу в onCreate(), и после каждого показа будем обновлять рекламный контент.

Для начала объявим нужную переменную класса в теле MainActivity:

private lateinit var mInterstitialAd: InterstitialAd

lateinit в данном случае нужен, т.к. мы определим mInterstitialAd в функции onCreate(), и она никогда не должна содержать null.

Теперь в onCreate() создадим полноэкранную рекламу и подгрузим контент в первый раз:

mInterstitialAd = InterstitialAd(this)
mInterstitialAd.adUnitId = getString(R.string.interstitial_id)
mInterstitialAd.loadAd(getAdRequest())

В качестве Ad Unit ID мы задаем строку interstitial_id из файла values/ads.xml:

<string name="interstitial_id">ca-app-pub-3940256099942544/1033173712</string>

Далее создадим функцию onShowInterstitial(), отвечающую за нажатие на кнопку btn_interstitial (это задано через xml файл):

public fun onShowInterstitial(view: View) {
   if(mInterstitialAd.isLoaded) {
       mInterstitialAd.show()
    }
}

Здесь обязательно проверяем, загрузилась ли реклама перед тем, как показать ее.

Теперь можно запустить приложение и проверить, показывается ли полноэкранная реклама по нажатию на кнопку ‘Interstitial’. Вот как выглядит тестовая реклама AdMob:

Далее добавим listener для полноэкранной рекламы, который будет показывать пользователю сообщение об ошибке (если реклама не смогла загрузиться), а также будет обновлять запрос на рекламный контент после закрытия текущего рекламного блока.

Создадим объект класса AdListener в теле MainActivity:

private val mInterstitialAdListener = object : AdListener() {

    override fun onAdFailedToLoad(errorCode: Int) {
        Toast.makeText(
            [email protected]vity,
            "Interstitial ad failed to load: ${Utils.getUserFriendlyError(errorCode)}",
            Toast.LENGTH_LONG)
            .show()
    }

    override fun onAdClosed() {
        mInterstitialAd.loadAd(getAdRequest())
    }
}

И привяжем этот listener к полноэкранной рекламе в onCreate:

mInterstitialAd.adListener = mInterstitialAdListener

Для того, чтобы проверить, меняется ли реклама при повторном нажатии на кнопку ‘Interstitial’, тестовый ad unit ID от Google не подходит, т.к. выдает всегда одну и ту же картинку. Вам нужно будет создать interstitial ad unit в панели управления AdMob и поменять id в файле ads.xml на свои собственные. Тогда реклама будет меняться время от времени. Вот, например, как было у меня:

Rewarded Video Ad

Теперь перейдем к последнему блоку — видео-реклама за вознаграждение.

Для начала создадим переменную для rewarded video ad в классе MainActivity:

private lateinit var mRewardedVideoAd: RewardedVideoAd

Определим ее в onCreate(), и тут же загрузим первый рекламный контент:

mRewardedVideoAd = MobileAds.getRewardedVideoAdInstance(this)
mRewardedVideoAd.loadAd(getString(R.string.rewarded_video_id), getAdRequest())

Очень важно передавать в метод MobileAds.getRewardedVideoAdInstance() в качестве контекста Activity, а не Application, т.к. если вы используете медиаторы в рекламе, то некоторые адаптеры требуют именно класс Activity.

Теперь напишем тело функции onShowRewardedVideo(), которая вызывается по клику кнопки Rewarded Video. Здесь все по аналогии с onShowInterstitial():

public fun onShowRewardedVideo(view: View) {
    if(mRewardedVideoAd.isLoaded) mRewardedVideoAd.show()
}

Еще нам обязательно нужно создать следующий listener в теле MainActivity, обрабатывающий все важные события rewarded video ad:

private val mRewardedVideoAdListener = object : RewardedVideoAdListener {

    override fun onRewardedVideoAdLeftApplication() { }

    override fun onRewardedVideoAdLoaded() { }

    override fun onRewardedVideoAdOpened() { }

    override fun onRewardedVideoCompleted() { }

    override fun onRewardedVideoStarted() { }

    override fun onRewardedVideoAdClosed() {
        mRewardedVideoAd.loadAd(getString(R.string.rewarded_video_id), getAdRequest())
    }

    override fun onRewarded(reward: RewardItem?) {
        Toast.makeText([email protected], "Here is your reward!", Toast.LENGTH_SHORT).show()
    }

    override fun onRewardedVideoAdFailedToLoad(errorCode: Int) {
        Toast.makeText(
            [email protected],
            "Rewarded video ad failed to load: ${Utils.getUserFriendlyError(errorCode)}",
            Toast.LENGTH_LONG)
            .show()
    }

}

Для нашей функциональности мы переопределим лишь методы onRewardedVideoAdClosed(), onRewarded() и onRewardedVideoAdFailedToLoad(). Функция onRewarded() — самое подходящее место, где мы можем отдать пользователю вознаграждение за просмотр рекламы. В данном случае мы просто показываем сообщение о награде. Остальные функции создаются по аналогии с interstitial ad.

Теперь свяжем этот listener с объектом rewarded video ad в onCreate():

mRewardedVideoAd.rewardedVideoAdListener = mRewardedVideoAdListener

Запускаем, проверяем. По нажатию должна появиться вот такая тестовая видео реклама:

Подключаем Firebase

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

Для начала открываем консоль Firebase и нажимаем Add project:

Здесь нам нужно ввести только имя проекта и нажать Create project. Проект может содержать несколько приложений, так что можно, к примеру, сгруппировать все свои тестовые приложения в одном проекте.

Итак, проект создан. Теперь добавим Android приложение, нажав на иконку с андроидом на главной странице проекта:

Появляется окно с 4 шагами по добавлению Android приложения:

На первом шаге вводим только имя пакета (внимательно!) и кликаем на Register app. После этого скачиваем файл google-services.json и сохраняем его в директорию проекта ./app. Следуя инструкциям, добавляем необходимые для Firebase библиотеки (не перепутайте build.gradle файлы), и можно запускать свое приложение для проверки.

Теперь переходим на вкладку AdMob и нажимаем Link. Должен открыться сайт AdMob на вкладке с приложениями, где мы для требуемого приложения выбираем Link to Firebase. Здесь вводим имя пакета, далее выбираем уже существующий проект в Firebase, и AdMob должен автоматически найти наше приложение в этом проекте.

Через несколько часов вы сможете увидеть в консоли Firebase первые данные статистика с Admob.

Весь исходный код приложения можно найти здесь: https://github.com/nerdgrlapps/admobtutorial

Ссылка на apk для демонстрации приложения.

Как создать проект Google Firebase

Сегодня мы расскажем вам, как создать проект google firebase и как создать базу данных в google firebase и как настроить базу данных google firebase в вашем проекте. Некоторое время назад мы работали с одним приложением реального времени, а затем использовали для него базу данных Google Firebase. Итак, сначала мы дадим небольшое представление о Google Firebase и о том, что сделает с вами Google Firebase.

Что такое Google Firebase:

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

[ADDCODE]

1.) База данных в реальном времени

2.) Crashlytics

3.) Отчеты о сбоях

4.) Аутентификация

5.) Облачные функции

6.) Облачное хранилище

7.) Хостинг

8.) Тестовая лаборатория для Android

9.) Мониторинг производительности

Как создать проект Google Firebase:

Теперь давайте посмотрим, как шаг за шагом создать свой первый проект Google Firebase. поэтому сначала откройте консоль Google Firebase, нажав на эту ссылку Google Firebase Console. тогда вы можете увидеть следующую страницу, посмотрите следующий снимок экрана.

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

В этом диалоговом окне введите «Название проекта» и выберите любую страну. затем нажмите кнопку «СОЗДАТЬ ПРОЕКТ». тогда вы можете увидеть, как выглядит другое диалоговое окно.

В этом диалоговом окне щелкните «COUNTINUE». Затем вы переместите страницу администратора проекта Google Firebase, как показано на следующем рисунке.

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

1.) iOS для Apple

2.) Android

3.) Интернет

После выбора или выбора среды проекта вы увидите одно всплывающее окно, и в этом всплывающем окне вы можете получить свой apiKey , authDomain , databaseURL

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

Это наша первая статья о Google Firebase. В следующий раз мы также публикуем еще одну статью о проекте Google Firebase. очень скоро мы также напишем статью об уведомлении о пожаре в реальном времени в Android, CRUD в реальном времени, хотя Google Firebase.

Мы надеемся, что вам понравились эти учебные пособия. Если у вас возникнут какие-либо вопросы по любому запросу, оставьте свой вопрос на нашем форуме, нажмите на ссылку ниже Форумы Laravelcode

Выбор между Firebase и Google Analytics SDK для отслеживания приложений

«Что мы должны использовать: Firebase или Google Analytics?» — мы часто получаем этот вопрос относительно отслеживания поведения в мобильных приложениях.

Несмотря на то, что старые мобильные SDK Google Analytics были официально объявлены Google устаревшими, а аналитические отчеты в Firebase были переименованы в «Google Analytics для Firebase», по-прежнему существует большая путаница относительно того, какой инструмент аналитики является правильным. для работы.

Мобильные SDK Google Analytics технически все еще поддерживаются и предлагают традиционные методы отчетности, с которыми вы, скорее всего, знакомы, но Google Analytics для Firebase также может многое предложить и считается будущим отслеживания мобильных приложений. .

Этот пост призван помочь прояснить важные различия между ними и предоставить некоторые предложения по использованию каждой платформы. Для простоты я буду называть Google Analytics для Firebase просто Firebase, а SDK Google Analytics — Google Analytics.

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

1. Платформа для мобильных разработчиков и инструмент для аналитики

Firebase SDK на самом деле представляет собой платформу мобильной разработки, а не просто отдельный инструмент аналитики.Я уже говорил об этом раньше, но важно понимать, что аналитические отчеты — это всего лишь один набор инструментов на платформе Firebase, предназначенный для интеграции с другими инструментами Firebase, такими как облачные сообщения, облачные функции, удаленная конфигурация и т. Д.

Это один из самых больших плюсов Firebase, поскольку он обеспечивает очень полезную интеграцию с другими продуктами Firebase. Новые возможности, которые предоставляет эта интеграция, по сути, объясняют, почему старые SDK Google Analytics устарели.Вот несколько примеров:

  • Отправить пользователю уведомление после того, как определенное событие аналитики было инициировано в приложении
  • Настройте взаимодействие с приложением с помощью Remote Config на основе определенных действий (событий аналитики) в приложении
  • Выполните A / B-тестирование с помощью Optimize & Remote Config
  • Улучшите таргетинг кампании для уведомлений с помощью Firebase Predictions, который применяет машинное обучение, чтобы помочь вам понять поведение пользователей и создать группы аудитории (также на основе событий аналитики)

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

Google Analytics, с другой стороны, является частью набора маркетинговых инструментов в Google Marketing Platform. Там также есть некоторые важные интеграции, но они в основном ориентированы на рекламные цели, такие как совместное использование аудитории. Firebase расширяет возможности интеграции — ознакомьтесь с доступными продуктами здесь.

Думаю, также стоит отметить, что Firebase сотрудничает с гораздо большим количеством мобильных рекламных сетей, чем более традиционный Google Analytics для мобильных приложений.В настоящее время существует 60 рекламных сетей, которые согласились предоставить вам данные атрибуции кампании, а также интеграцию с продуктами в Google Marketing Platform, что значительно упростило этот процесс, чем это было в прошлом.

2. Неограниченный объем регистрации событий в сравнении с ограничениями / затратами на количество обращений в GA

Firebase НЕ имеет ОГРАНИЧЕНИЙ на количество событий, которые вы можете регистрировать. Существуют ограничения на количество названий событий (всего до 500), но на данный момент плата за использование Firebase для аналитики не взимается.

Обратите внимание, что вы также можете бесплатно воспользоваться преимуществами многих других продуктов Firebase. Пара отличных примеров из них, включая Crashlytics и Dynamic Links, в частности, может помочь вам легко добавить дополнительную информацию об атрибуции кампании для неподдерживаемых рекламных сетей, что имеет большое значение для любого маркетолога, который хочет понять эффективность своих мобильных кампаний!

Существуют некоторые ограничения в отношении типов параметров, которые вы можете прикреплять к событиям Firebase, и того, что вы можете видеть в отчетах, которые сильно отличаются от сбора данных SDK Google Analytics.Вы должны быть уверены, что знаете об этих различиях, прежде чем переходить на Firebase (см. Раздел 4).

Что приводит меня к следующему пункту …

3. SLA?

Без комиссии = без поддержки. Если для вас важно соглашение об уровне обслуживания, вам не повезло с Google Analytics для Firebase. Если вы являетесь клиентом Google Analytics 360, вы, вероятно, получите поддержку для всех ресурсов, независимо от того, содержат ли они данные из Интернета или приложения.

Тем не менее, есть некоторые ресурсы, доступные на тот случай, если вам действительно понадобится помощь в реализации Firebase.На самом деле есть отличный пост по этой теме в блоге Firebase. Кроме того, статьи в документации и справочном центре прошли долгий путь и охватывают множество деталей.

4. Отчетность и модели данных

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

В некотором смысле это может быть хорошо — пользователи взаимодействуют с приложениями иначе, чем с веб-сайтами, и Firebase разработан с учетом этого. Честно говоря, чем больше я изучаю эти различия и их влияние на итоговую отчетность, тем больше я предпочитаю Firebase модели Google Analytics, ориентированной на веб. Кроме того, во многих приложениях нет особого акцента на «страницах» или «экранах», и вместо этого они сосредоточены на действиях, которые пользователь может выполнить. Firebase идеально подходит для этого, но некоторым предприятиям, например, издателям, может быть немного сложнее работать или потребуется некоторое время для привыкания.Кроме того, тот факт, что сеанс полностью исключен из модели данных в Firebase, может упростить работу, например, в BigQuery. Все это существенные различия и требуют некоторого размышления перед принятием решения о том, какой инструмент использовать.

Кроме того, существуют разные схемы отслеживания событий в Firebase по сравнению с Google Analytics. С помощью Google Analytics вы можете отправлять различные типы обращений — например, просмотры экрана и события. События Google Analytics состоят из нескольких ключевых параметров: категории события , действия события и метки события (плюс еще пара других, но они не имеют отношения к данному обсуждению).В Firebase схема отличается — все является событием (даже просмотры экрана — это просто события), а вместо этого схема выглядит так: имя события , плюс до 25 дополнительных пар ключ-значение параметров, которые вы можете настроить для добавления контекст события . Это намного больше доступных параметров, чем при использовании традиционных событий в Google Analytics. Обратной стороной является то, что вы не увидите все эти данные в интерфейсе по умолчанию. — вам нужно войти в консоль Firebase и «зарегистрировать» их, чтобы они отображались в ваших отчетах, и вы можете зарегистрировать только до 50 пользовательских параметры событий для каждого проекта (40 числовых, 10 текстовых).Данные включаются в экспорт BigQuery, если он у вас включен. Обязательно помните об этом, когда планируете свои потребности в отчетности до внедрения.

Есть и другие соображения, например, специальные параметры в Google Analytics — это могут быть для пользователя, сеанса, обращения или продукта . Вы можете настроить до 20 из них для бесплатной версии Google Analytics или 200 для версии Google Analytics 360 / предприятия. В Firebase вы можете либо использовать настраиваемые параметры, прикрепленные к событиям, для хранения настраиваемых данных (до 25, как я упоминал выше), либо настроить пользовательских свойств .Свойства пользователя аналогичны параметрам в области действия пользователя в Google Analytics, где значения, установленные для данного пользователя, будут автоматически сохраняться во всех будущих взаимодействиях, связанных с этим пользователем. У вас есть ограничение в Firebase до 25 пользовательских свойств на проект Firebase (не приложение).

Из-за этих значительных различий я настоятельно рекомендую вам тщательно спланировать реализацию отслеживания приложений до его фактической настройки, особенно если вы используете Firebase.

Есть также много различий в параметрах отчетности между этими двумя инструментами, например:

  • Нет возможности создавать собственные отчеты или информационные панели в интерфейсе Firebase
  • Ограниченное количество параметров событий (50) можно увидеть в отчетах Firebase (плюс вы должны зарегистрировать их, чтобы увидеть какие-либо, они не просто отображаются в ваших отчетах).Кроме того, только десять из них могут быть текстовыми.
  • Ограничение: 15 настраиваемых событий конверсии в Firebase для каждого проекта (по сравнению с 20 целями на представление в устаревшей версии Google Analytics для приложений)
  • Отсутствие более детальной отчетности о «сеансах, в которых произошли определенные действия» в Firebase — это также создает проблемы для сегментации аудитории и ретаргетинга на основе поведения, зависящего от сеанса, что характерно для Google Analytics.

Чтобы узнать больше о различиях в отчетах между Firebase и Google Analytics, ознакомьтесь с моей предыдущей публикацией:

Google Analytics для Firebase: введение в отчетность

Автор: Аманда Шредер,
Дата публикации: 12 октября 2017 г.

Пожалуйста, внимательно прочтите это, если вы планируете перейти на Firebase?

5.Накопление данных

Раньше, если у вас была версия приложения для iOS и Android, они отслеживались бы отдельно для Firebase. Это уже не так, поэтому я хотел указать на это. Данные теперь находятся на уровне проекта, а не приложения, поэтому, хотя вы можете видеть данные для определенной платформы (называемой «потоком») в Firebase, теперь они собраны в один набор данных. Это означает, что вы можете видеть общие показатели, такие как количество пользователей во всех приложениях в проекте Firebase. Это верно как для интерфейса Firebase, так и для экспорта BigQuery (это было недавнее обновление).

С помощью Google Analytics вы можете выбрать, например, отправлять свои данные iOS на тот же или другой ресурс, чем данные Android. Или вы можете даже отправить его на тот же ресурс, что и посещаемость вашего веб-сайта, хотя мы обычно не рекомендуем этого делать. Таким образом, у вас есть немного больше гибкости в интерфейсе с Google Analytics, но те, кто использует BigQuery, больше не сочтут это серьезной проблемой для Firebase.

6. Опора платформы

В настоящее время Google Analytics для Firebase доступен для iOS, Android, C ++ и Unity, в частности — взгляните на документацию здесь.Эта поддержка распространяется на большинство платформ, но не на все из них.

Рассмотрим, например, OTT или приложения «поверх», такие как Amazon Fire TV или Apple TV. Многие из этих платформ могут быть настроены, например, для iOS или Android, которые поддерживает Firebase. Но если вы, например, работаете с Roku или Adobe AIR, я не уверен, насколько вам повезет. Roku, например, использует собственное проприетарное программное обеспечение, и я не знаю, как реализовать там Firebase.

Google Analytics, с другой стороны, предлагает протокол измерения, что делает его более гибким, чем Firebase для таких ситуаций.Обязательно поговорите об этом со своей командой разработчиков, прежде чем чем-либо задумываться.

Примечание. Существуют определенные продукты Firebase, предназначенные также для Интернета (HTML / JS), но аналитика в настоящее время не является частью этих предложений.

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

Если вы уже используете GA SDK в своем приложении, узнайте, как собираемые вами данные могут быть сопоставлены с моделью данных Firebase. Будет ли это работать хорошо? Сколько специальных параметров вы используете в настоящее время и как вы собираете их с параметрами событий Firebase или свойствами пользователя? Составьте список того, что вам понадобится, и это поможет вам понять уровень усилий, необходимых для перехода.Кроме того, обратите внимание на любую существующую инфраструктуру отчетности и то, какую часть ее необходимо обновить, чтобы вместо этого использовать данные Firebase.

Некоторые дополнительные соображения:

Обязательно поговорите со своей командой разработчиков о своих конкретных приложениях — убедитесь, что для них есть поддержка, если вы хотите попробовать Firebase и узнать, например, для какого-либо из ваших приложений уже настроено отслеживание с помощью GA SDK. Для перехода на схему ведения журнала событий Firebase потребуется поработать.

Подумайте, есть ли у вас потребность или интерес к другим продуктам Firebase, даже в будущем — взгляните на предложения здесь (многие из них бесплатны).Продукты Firebase предназначены для совместного использования, например:

  • отправить пользователю уведомление с Cloud Messaging , чтобы побудить их повторно взаимодействовать с вашим приложением
  • настроить взаимодействие с приложением с помощью Remote Config на основе определенных событий или действий, которые пользователь выполняет в приложении
  • выполнить A / B-тестирование с помощью Remote Config
  • создать динамические списки аудитории пользователей на основе прогнозов и машинного обучения

Если вы разбираетесь в BigQuery или не возражаете против создания дополнительных отчетов в Data Studio, я особенно рекомендую вам попробовать Firebase — возможности здесь потрясающие!

Я также хочу еще раз повторить, насколько важно иметь твердую стратегию, прежде чем приступить к реализации.Даже если вы не готовы использовать Firebase прямо сейчас или у вас уже установлен GA SDK в вашем приложении, все равно стоит приложить усилия, чтобы точно определить, что для вас важно в вашем приложении (и как это отслеживается в настоящее время. ). Если вы все же решите переключиться на Firebase в будущем, будет намного проще учесть изменения, которые необходимо будет внести для сопоставления точек данных с соответствующими полями Firebase, когда эта основа уже завершена. Все это, наверное, звучит как здравый смысл, но поверьте — это не очень распространенное явление!

Каждая платформа имеет множество преимуществ, так почему бы не воспользоваться преимуществами обеих? Мы часто так и поступаем.

Установив Firebase SDK и Google Tag Manager SDK, вы можете начать сбор данных как в отчетах Google Analytics для Firebase, так и в Google Analytics (SDK GA не требуется). Это может быть очень полезно по ряду причин:

  • Возможно, вам еще не нравятся отчеты в Firebase, поэтому вы хотите использовать Google Analytics в качестве «резервной копии» для отчетов, пока вы разогреваете модель данных на основе событий в Firebase
  • .
  • Возможно, нужные вам отчеты (например, настраиваемые) просто еще не доступны в Firebase
  • Может быть, вам нужен простой способ свернуть данные приложения и веб-сайтов для более удобного получения совокупных итогов

Позвольте мне прояснить, что это хорошее временное решение, а не отличный долгосрочный план. Думайте об этом как о краткосрочном варианте, который поможет вашей команде получить большую часть * стандартной отчетности, к которой они привыкли, из Google Analytics (с дополнительным преимуществом параметров настройки, доступных в Google Analytics, где нет Firebase), во время работы над переход на использование исключительно Firebase.

* Я считаю, что это временное решение по нескольким причинам. Во-первых, данные Firebase и Google Analytics не будут совпадать 1: 1 — это просто два совершенно разных инструмента (вы обнаружите, что сравниваете данные, что обычно не имеет смысла).Во-вторых, значительные различия в моделях данных этих двух инструментов приводят к серьезным проблемам при атрибуции кампании. Вы просто не сможете точно отправить данные своей кампании из Firebase в Google Analytics (не без серьезного взлома, и в этот момент ситуация, возможно, станет еще хуже). Основная причина этого связана с тем, как Google Analytics обрабатывает сеансы (и как Firebase вообще не заботится об этом). В-третьих, эти два инструмента предлагают совершенно разные взгляды на поведение пользователей приложения.Отсутствие в Firebase концепции сеанса, аналогичной Google Analytics, должно побудить вас по-другому думать о поведении приложения, тогда как Google Analytics ограничивает вас этим более традиционным ожиданием от поведения в Интернете, которое часто просто не имеет смысла с мобильным приложением. .

Из-за этих проблем вы, скорее всего, в конечном итоге будете использовать определенные отчеты из Google Analytics, когда, например, вам станет удобнее работать с Firebase. Мы могли бы больше поговорить на эту тему в целом, но это несколько из моих основных причин использовать этот подход в качестве временного решения для стратегического перехода на Firebase, при этом тем временем получая интерфейс отчетности, с которым вы знакомы из Google Analytics. .Я хотел бы услышать ваши мысли по этому поводу в комментариях!

Чтобы еще больше упростить параметры, вот таблица того, что вам нужно, в зависимости от того, где вы хотите создавать отчеты:

Если вам нужны отчеты на: Необходимо установить:
Firebase Firebase SDK
Google Analytics GA SDK ИЛИ GTM SDK
И Firebase, и Google Analytics Firebase SDK + GTM SDK

Cloud Messaging | React Native Firebase

Установка и начало работы с Cloud Messaging.

Установка

Этот модуль требует, чтобы модуль @ react-native-firebase / app уже был настроен и установлен. Чтобы установить модуль «приложение», просмотрите Документация по началу работы.

 
пряжа добавить @ react-native-firebase / app


пряжа добавить @ response-native-firebase / сообщения


cd ios / && pod install
  

iOS требует дополнительной настройки, прежде чем вы сможете начать получать и отправлять сообщения через Firebase. Прочтите документацию о том, как настроить iOS с помощью Firebase Cloud Messaging.

Для использования API sendMessage () и связанных с ним приемников требуется настраиваемый сервер XMPP . Прочтите документацию по обмену сообщениями с помощью XMPP.

Если вы используете старую версию React Native без поддержки автоматического связывания или хотите интегрироваться в существующий проект, вы можете выполнить шаги ручной установки для iOS и Android.

Что он делает

React Native Firebase обеспечивает встроенную интеграцию Firebase Cloud Messaging (FCM) как для Android, так и для iOS.FCM — это стоимость бесплатный сервис, позволяющий общаться сервер-устройство и устройство-устройство. Модуль React Native Firebase Messaging предоставляет простой JavaScript API для взаимодействия с FCM.

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

Использование

iOS — запрос разрешений

iOS запрещает отображение сообщений, содержащих полезные данные уведомления (или «предупреждения»), если вы не получили явного разрешения от пользователя.

Чтобы узнать больше о локальных уведомлениях, просмотрите документацию по уведомлениям.

Этот модуль предоставляет метод requestPermission , который запускает диалоговое окно с собственными разрешениями, запрашивающее разрешение пользователя:

  импорт сообщений из '@ response-native-firebase / messaging';

асинхронная функция requestUserPermission () {
  const authStatus = ждать сообщений (). requestPermission ();
  const включен =
    authStatus === messaging.AuthorizationStatus.РАЗРЕШЕНО ||
    authStatus === messaging.AuthorizationStatus.PROVISIONAL;

  if (enabled) {
    console.log ('Статус авторизации:', authStatus);
  }
}
  

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

На Android не нужно запрашивать разрешение пользователя. Этот метод по-прежнему можно вызывать на устройствах Android; однако и всегда разрешается успешно.

Получение сообщений

Сообщения FCM могут быть отправлены на реальных устройств Android / iOS и эмуляторов Android (однако симуляторы iOS , а не обрабатывают облачные сообщения) несколькими способами (см. Ниже). Сообщение — это просто полезная нагрузка данных, которую можно использовать в своем приложении, как вы сочтете нужным.

Типичные варианты использования для обработки сообщений:

  • Отображение уведомления (см. Уведомления).
  • Автоматическая синхронизация данных сообщений на устройстве (например,грамм. через AsyncStorage ).
  • Обновление пользовательского интерфейса приложения.

Чтобы узнать, как отправлять сообщения на устройства из настроек вашего собственного сервера, просмотрите Документация по интеграции серверов.

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

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

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

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

Обработчики сообщений

Состояние устройства и содержимое сообщения определяют, какой обработчик будет вызван:

Передний план Фон Выйти
Уведомление

07

Уведомление

07

setBackgroundMessageHandler
Уведомление + Данные OnMessage setBackgroundMessageHandler setBackgroundMessageHandler
данных OnMessage setBackgroundMessageHandler ( см. ниже ) setBackgroundMessageHandler ( см. ниже )
  • В случаях, когда сообщение предназначено только для данных и устройство работает в фоновом режиме или закрывается, и Android, и iOS обрабатывают сообщение как низкий приоритет и проигнорирует его (т.е. событие не будет отправлено). Однако вы можете увеличить приоритет, установив приоритет на высокий (Android) и content-available to true (iOS) properties on the payload.

Чтобы узнать больше о том, как отправлять эти параметры в полезные данные сообщения, просмотрите документацию Firebase для вашей реализации FCM API.

Уведомления

Состояние устройства и содержимое сообщения также могут определять, будет ли отображаться уведомление:

Передний план Фон Выйти
Уведомление Уведомление: ✅ Уведомление: ✅
Уведомление + данные Уведомление: ❌ Уведомление: ✅ Уведомление: ✅
Уведомление о данных Уведомление: ❌
Сообщения о состоянии переднего плана

Для прослушивания сообщений на переднем плане вызовите метод onMessage внутри кода приложения.Код выполняется через этот обработчик, имеет доступ к контексту React и может взаимодействовать с вашим приложением (например, обновлять состояние или пользовательский интерфейс).

Например, API-интерфейс React Native Alert может использоваться для отображения нового предупреждения. каждый раз, когда доставляется сообщение ‘

  import React, {useEffect} из' react ';
импортировать {Alert} из 'react-native';
импортировать сообщения из @ response-native-firebase / messaging;

function App () {
  useEffect (() => {
    const unsubscribe = сообщения ().onMessage (асинхронное удаленное сообщение => {
      Alert.alert ('Пришло новое сообщение FCM!', JSON.stringify (remoteMessage));
    });

    вернуться отписаться;
  }, []);
}
  

Свойство remoteMessage содержит всю информацию о сообщении, отправленном на устройство из FCM, включая любые пользовательские данные (через свойство data ) и данные уведомлений. Чтобы узнать больше, просмотрите RemoteMessage Справочник по API.

Если полезная нагрузка RemoteMessage содержит свойство уведомления при отправке в обработчик onMessage , устройство не будет показывать пользователю никаких уведомлений.Вместо этого вы можете вызвать локальное уведомление или обновите пользовательский интерфейс в приложении, чтобы сигнализировать о новом уведомлении.

Фоновые сообщения и сообщения о состоянии выхода

Когда приложение находится в фоновом режиме или в состоянии выхода, обработчик onMessage не будет вызываться при получении сообщений. Вместо этого вам необходимо настроить фоновый обработчик обратного вызова с помощью метода setBackgroundMessageHandler .

Чтобы настроить фоновый обработчик, вызовите setBackgroundMessageHandler вне логики приложения как можно раньше:

 
импортировать {AppRegistry} из 'react-native';
импортировать сообщения из @ response-native-firebase / messaging;
импортировать приложение из './Приложение';


сообщения (). setBackgroundMessageHandler (async remoteMessage => {
  console.log ('Сообщение обработано в фоновом режиме!', remoteMessage);
});

AppRegistry.registerComponent ('приложение', () => Приложение);
  

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

Свойство remoteMessage содержит всю информацию о сообщении, отправленном на устройство из FCM, включая любые пользовательские данные через свойство data .Чтобы узнать больше, просмотрите RemoteMessage Справочник по API.

Если полезная нагрузка RemoteMessage содержит свойство уведомления при отправке в обработчик setBackgroundMessageHandler , устройство отобразит уведомление для пользователя.

Сообщения только для данных

Когда входящее сообщение предназначено только для данных (не содержит опцию уведомления ), и Android, и iOS рассматривают его как низкий приоритет. и предотвратит пробуждение приложения (игнорирование сообщения).Чтобы разрешить сообщениям только с данными запускать фон обработчик, вы должны установить «приоритет» на «высокий» на Android и включить флаг content-available на iOS. Например, при использовании пакета Node.js firebase-admin для отправки сообщения:

  admin.messaging (). sendToDevice (
  [],
  {
    данные: {
      владелец: JSON.stringify (владелец),
      пользователь: JSON.stringify (пользователь),
      picture: JSON.stringify (изображение),
    },
  },
  {
    
    contentAvailable: true,
    
    приоритет: 'высокий',
  },
);
  

Для сообщений iOS, предназначенных только для данных, сообщение должно включать соответствующие заголовки APN, а также флаг Content-available , чтобы запустить фоновый обработчик.Например, при использовании пакета Node.js firebase-admin для отправки сообщения «только данные» на устройство iOS:

  admin.messaging (). Send ({
    данные: {
      
    },
    apns: {
      полезная нагрузка: {
        aps: {
          contentAvailable: true
        }
      },
      заголовки: {
        'apns-push-type': 'фон',
        'apns-priority': '5',
        'apns-topic': ''
      }
    },
    
    
    
    
});
  

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

Эти параметры могут применяться ко всем сообщениям FCM. Просмотреть документацию по интеграции серверов чтобы узнать больше о других доступных SDK.

Состояние фонового приложения

Хотя библиотека поддерживает обработку сообщений в фоновом режиме / состоянии выхода, базовая реализация того, как это работает, отличается на Android и iOS.

На Android создается задача JS без головы (функция только для Android), которая выполняется отдельно от вашего основного компонента React; позволяет запускать код фонового обработчика без монтирования корневого компонента.

Однако в iOS при получении сообщения устройство автоматически запускает ваше приложение в фоновом состоянии. На этом этапе ваш фоновый обработчик (через setBackgroundMessageHandler ) запускается, но ваш корневой компонент React также монтируется. Это может быть проблематично для некоторых пользователей, поскольку любые побочные эффекты будут вызываться внутри вашего приложения (например, useEffects , события / триггеры аналитики и т. Д.). Чтобы обойти эту проблему, вы можете настроить свой AppDelegate.m (см. инструкции ниже), чтобы внедрить опору isHeadless в корневой компонент. Используйте это свойство для условной визуализации null («ничего»), если ваше приложение запускается в фоновом режиме:

 
импортировать {AppRegistry} из 'react-native';
импортировать сообщения из @ response-native-firebase / messaging;

сообщения (). setBackgroundMessageHandler (async remoteMessage => {
  console.log ('Сообщение обработано в фоновом режиме!', remoteMessage);
});

function HeadlessCheck ({isHeadless}) {
  if (isHeadless) {
    
    return null;
  }

  return <Приложение />;
}

function App () {
  
}

AppRegistry.registerComponent ('приложение', () => HeadlessCheck);
  

Чтобы внедрить опору isHeadless в ваше приложение, обновите файл AppDelegate.m , как указано ниже:

 
#import "RNFBMessagingModule.h"





NSDictionary * appProperties = [RNFBMessagingModule addCustomPropsToUserProps: nil withLaunchOptions: launchOptions];


RCTRootView * rootView = [[RCTRootView alloc] initWithBridge: мост
                                             moduleName: @ "nameOfYourApp"
                                             initialProperties: appProperties];
  
  • Для проектов, которые используют встроенную навигацию (или если вы просто не хотите связываться со своими launchProperties), вы можете использовать метод getIsHeadless (только для iOS) из сообщений, например:
  сообщения ().getIsHeadless (). then (isHeadless => {
  
});

  

На Android опора isHeadless не существует.

Темы

Темы — это механизм, который позволяет устройству подписываться и отказываться от подписки на именованные каналы PubSub, управление которыми осуществляется через FCM. Вместо того, чтобы отправлять сообщение определенному устройству с помощью токена FCM, вы можете вместо этого отправить сообщение в тему и любой устройства, подписанные на эту тему, получат сообщение.

Темы позволяют упростить интеграцию с сервером FCM, поскольку вам не нужно хранить токены устройства.Однако при работе с темами следует помнить о некоторых вещах:

  • Сообщения, отправляемые по темам, не должны содержать конфиденциальную или личную информацию. Не создавайте тему для конкретного пользователя подписаться на.
  • Обмен сообщениями по темам поддерживает неограниченные подписки для каждой темы.
  • На один экземпляр приложения можно подписаться не более чем на 2000 тем.
  • Частота новых подписок ограничена для каждого проекта. Если вы отправили слишком много запросов на подписку в коротком В течение определенного периода времени серверы FCM ответят ответом 429 RESOURCE_EXHAUSTED («квота превышена»).Повторите попытку с экспоненциальным откатом.
  • Серверная интеграция может отправлять одно сообщение сразу в несколько тем. Однако это ограничено 5 темами.

Чтобы узнать больше о том, как отправлять сообщения на устройства, подписанные на темы, просмотрите раздел Отправлять сообщения темам документация.

Подписка на темы

Чтобы подписать устройство, вызовите метод subscribeToTopic с именем темы:

  messaging ()
  .subscribeToTopic ('погода')
  .then (() => console.log ('Подписан на тему!'));
  
Отмена подписки на темы

Чтобы отказаться от подписки на тему, вызовите метод unsubscribeFromTopic с именем темы:

  messaging ()
  .unsubscribeFromTopic ('погода')
  .then (() => console.log ('Отписался от темы!'));
  

firebase.json

Обмен сообщениями можно дополнительно настроить для обеспечения большего контроля над тем, как FCM обрабатывается внутри вашего приложения.

Автоматическая регистрация (iOS)

React Native Firebase Messaging автоматически регистрирует устройство с APN для получения удаленных сообщений. Если тебе нужно для ручного управления регистрацией вы можете отключить это через файл firebase.json :

 
{
  "react-native": {
    "messaging_ios_auto_register_for_remote_messages": false
  }
}
  

После отключения автоматической регистрации вы должны вручную вызвать registerDeviceForRemoteMessages в своем коде JavaScript как как можно раньше при запуске вашего приложения;

  импортировать сообщения из @ response-native-firebase / messaging;

асинхронная функция registerAppWithFCM () {
  ждать сообщения ().registerDeviceForRemoteMessages ();
}
  

Автоинициализация

Firebase генерирует идентификатор экземпляра, который FCM использует для генерации регистрационного токена и который Analytics использует для сбора данных. Когда создается идентификатор экземпляра, библиотека загружает идентификатор и данные конфигурации в Firebase. В большинстве случаев, вам не нужно менять это поведение.

Если вы предпочитаете запретить автоматическое создание идентификатора экземпляра, отключите автоматическую инициализацию для FCM и Analytics:

 
{
  "react-native": {
    "analytics_auto_collection_enabled": ложь,
    "messaging_auto_init_enabled": ложь
  }
}
  

Для повторного включения инициализации (например,грамм. после запроса разрешения) вызвать метод messaging (). setAutoInitEnabled (true) .

Тайм-аут фонового обработчика (Android)

На Android фоновое событие, отправленное на setBackgroundMessageHandler , имеет 60 секунд для разрешения, прежде чем оно будет выполнено автоматически отменен, чтобы освободить ресурсы устройства. Если вы хотите переопределить это значение, установите количество миллисекунд в вашей конфигурации:

 
{
  "react-native": {
    «messaging_android_headless_task_timeout»: 30000
  }
}
  

Идентификатор канала уведомления

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

 
{
  "react-native": {
    "messaging_android_notification_channel_id": "высокий приоритет"
  }
}
  

Создание и управление каналами выходит за рамки библиотеки React Native Firebase, однако внешние библиотеки такие функции, как Notifee, могут предоставить такие функции.

Цвет уведомления

На Android любые сообщения, отображающие уведомление, не используют цвет для окрашивания содержимого (например, маленький значок, заголовок и т. д.). Чтобы задать собственный цвет оттенка, обновите свойство messaging_android_notification_color с именем ресурса цвета Android.

Библиотека предоставляет набор предопределенных цветов, соответствующих цветам HTML для удобства, например:

 
{
  "react-native": {
    "messaging_android_notification_color": "@ color / hotpink"
  }
}
  

Обратите внимание, что в firebase можно использовать только предопределенные цвета.json . Если вы хотите использовать собственный цвет, определенный в ресурсах вашего приложения, вам следует вместо этого установить его в AndroidManifest.xml .

 
<ресурсы>
   # 123456 






  <приложение>
      

      <метаданные
            android: name = "com.google.firebase.messaging.default_notification_color"
            android: resource = "@ color / my-custom-color"
            инструменты: replace = "android: resource" />
  

  

Ускоренный курс Angular, Firebase и AngularFire

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

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

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

Какой бэкэнд мне выбрать?

Допустим, вы запускаете новое приложение с нуля и решили использовать Angular для внешнего интерфейса. Отличное начало!

А затем вы начинаете строить свой бэкэнд в своей обычной предпочтительной технологии в форме REST API, который получает данные из Postgresql, MySql или из вашей любимой базы данных SQL или даже из Mongo.

Вы, вероятно, будете использовать одно из следующего:

  • Если вы разработчик Ruby, очень высока вероятность, что вы выберете Rails
  • Если вы разработчик Python, вы можете использовать Django
  • Если вы разработчик узлов, возможно, вы выберете стек MEAN, возможно, вы воспользуетесь Hapi вместо Express или воспользуетесь Websockets и попробуете Socket.io или даже Meteor. Используете базу данных SQL? Sequelize отлично работает!
  • Если вы корпоративный Java-разработчик, вы, вероятно, развернете бэкэнд Spring / Hibernate с Spring Boot и Spring Data и можете даже добавить Spring REST, если вы просто не используете Spring MVC
  • Если вы работаете в мире C # / .Net, вы можете использовать .NET framework, Entity Framework и т. Д.

Вы, вероятно, выберете свое решение Go-To, которое используете в течение многих лет, и создадите собственный API REST, как вы привыкли, и это сработает.

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

И если вы действительно хотите использовать REST, у нас есть для вас очень хорошие новости!

Что входит в этот пост

В этом посте мы рассмотрим Firebase, AngularFire и то, как создавать приложения с использованием стека Angular / Firebase. Рассмотрим следующие темы:

  • Большинству приложений требуется решение тех же проблем
  • Почему Backendless разработки не существует на практике
  • Зачем использовать хранилища данных JSON для веб-разработки
  • WebSockets и уровень служб приложений
  • Firebase SDK, как использовать его с Typescript
  • Ключи, ссылки и снимки Firebase
  • Моделирование данных в Firebase — правильный и неправильный путь
  • Библиотека AngularFire — запрос списка
  • Запрос объектов в AngularFire
  • Изменение списков и объектов в AngularFire
  • Аутентификация Firebase
  • Firebase Встроенная функция REST
  • Что такое архитектура FIREStack?
  • Создание пакетных заданий с использованием очереди Firebase
  • Хранилище Firebase и HTTP / 2
  • Что еще не включает Firebase
  • Сводка

К некоторым разделам привязаны видеоуроки на случай, если вы предпочитаете обучение через видео.Итак, приступим!

Большинство приложений нуждаются в решении тех же проблем

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

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

Упущенная возможность создавать приложения быстрее

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

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

Бэкэнд-разработка на практике не существует

Идея разработки без серверной части и вся волна BaaS могла случайно принести больше вреда, чем пользы, способствуя распространению Backend as a Service как более часто используемого варианта разработки приложений.

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

Скорее всего, нам всегда понадобится какой-нибудь бэкэнд

CRUD-операции могут работать из коробки, как и многие общие запросы, но нам всегда понадобится какое-то пакетное задание, которое, например, очищает сообщения чата от запрещенных слов.

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

BaaS не является ценностным предложением «все или ничего»

Использование решения BaaS не обязательно является выбором «все или ничего»: если часть нашей системы полностью настраивается, нам не нужно строить всю систему индивидуальным образом.

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

И это то, что позволяет нам делать Firebase, плюс он значительно упрощает создание настраиваемой части Backend, как мы увидим

Несоответствие REST и относительного импеданса

Многие из нас уже создают свои приложения как одностраничные приложения, которые используют конечные точки RESTful JSON, мы привыкли видеть данные как JSON.Но многие бэкенды построены с использованием технологий, отличных от Javascript, и используют реляционную базу данных.

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

Кроме того, модификации дороги, потому что нам нужны фреймворки ORM и фреймворки отображения, чтобы выполнять даже простейшие операции. Например, взгляните на этот объект JSON на интерфейсе:

Если мы хотим изменить название урока, почему мы не можем изменить объект и просто вызвать db.save (modifiedObject) или что-то очень близкое к нему?

Вместо этого мы обычно делаем следующее:

  • создайте вызов REST Ajax PUT или PATCH
  • получить его в нашем бэкэнде и, возможно, отобразить в объект C #, Java и т. Д., Используя структуру сопоставления
  • , если мы используем отображение узлов, это не проблема
  • использовать ORM для сохранения этих данных в реляционной таблице или ODM для отображения в хранилище документов
Почему именно хранилища данных JSON?

Это большая работа, чтобы сделать что-то очень простое: сохранить объект JSON.В идеале было бы иметь хранилище данных JSON, а именно этим и является база данных Firebase Real-Time.

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

Основные причины использовать базу данных Firebase

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

Возможно, существует мнение, что база данных Firebase — это что-то, что нужно использовать для создания чатов или приложений с потребностями в реальном времени, таких как игры. На самом деле это база данных очень общего назначения (это форк MongoDB).

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

Зачем использовать хранилища данных JSON для веб-разработки

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

Примечание: мы рассмотрим этот странно выглядящий ключ «KT-etc.»

Мы можем рассматривать базу данных Firebase как гигантский объект JSON в небе, это всего лишь один большой объект!

Но взгляните на первый уровень объекта: вы найдете узлы с именами Курсы, Уроки. Это подозрительно похоже на названия таблиц SQL, не так ли?

Моделирование данных в Firebase

Если вы предпочитаете учиться через видео, вот короткое видео о моделировании данных Firebase:

Это видео является частью полного плейлиста YouTube. Вы можете найти список здесь, который содержит больше видео по Angular и Firebase.

Мы собираемся показать, как можно легко моделировать данные в Firebase, на примере ассоциации «один ко многим».

Это всего лишь введение, но цель состоит в том, чтобы передать идею о том, что моделирование данных в Firebase намного больше похоже на мир SQL, чем мы думаем. Чтобы узнать больше о методах моделирования данных, прочтите этот пост.

В нашем примере у нас будет модель:

  • некоторые курсы
  • некоторые уроки
  • В одном курсе может быть много уроков
  • каждый урок относится только к одному курсу

Так что это довольно знакомый многим сценариям ассоциации.Итак, как нам смоделировать это в Firebase? Это будет зависеть от вашего приложения, но в большинстве случаев есть хороший и неправильный способ.

Начнем с того, что скорее всего не так

Допустим, мы добавляем к каждому курсу свойство с именем уроки, которое представляет собой массив объектов урока:

Это может показаться разумным, но мы, вероятно, просто создали проблему с производительностью.

Что здесь могло пойти не так?

В некоторых более редких случаях это может быть именно то, что вам нужно.Допустим, понятие курсов не имеет смысла в нашем приложении без уроков. Что на самом деле не существует сценария, в котором нам понадобится курс без уроков.

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

В Firebase чтение всегда читает все

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

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

Что мы обычно делаем в мире SQL?

В базах данных SQL мы бы сделали:

  • разделить две взаимосвязанные сущности (курсы и уроки) на две отдельные таблицы
  • , затем запрашивать только курсы, если нам нужно только описание
  • присоединитесь к двум таблицам, если нам нужны уроки данного курса
  • связать уроки с курсом через внешний ключ

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

Моделирование ассоциации «один ко многим» в Firebase

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

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

Мы перейдем к этим ключам через секунду, и у них действительно есть потрясающие свойства! Теперь мы видим, что узел уроков представляет собой список и содержит список идентификаторов, которые являются уникальными идентификаторами урока.Расширяя свойство ID, мы получаем данные урока плюс courseId .

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

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

Создание узла ассоциации в Firebase

Чтобы связать данные вместе, мы можем создать в нашей базе данных узел classesPerCourse :

И под ним мы создаем по одной записи на курс, используя ключ курса. Затем мы создаем список под этим свойством со списком ключей урока. В JSON мы не можем добавить свойство к объекту без добавления значения.

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

Если в результате какого-либо изменения ассоциация между уроком и курсом имела свойства ассоциации, такие как дата начала и окончания ассоциации, мы хотели бы сохранить эти свойства ассоциации как значение этого узла (вместо «истина»).

Моделируйте осторожно, при необходимости денормализуйте

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

Это то же самое, что и в случае с базами данных SQL: иногда полностью нормализованная модель данных не применяется, и нам нужно денормализовать.

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

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

Другие концепции моделирования данных также могут быть объяснены аналогичными терминами, как и многие другие ассоциации и т. Д., Все это будет хорошо знакомо. Но одна вещь, которая может вас сейчас беспокоить, — что это за странно выглядящие ключи?

Нам действительно нужно их использовать? Разве мы не можем вместо этого использовать просто целые последовательные числа?

Ключи Firebase

Я действительно думаю, что вам следует принять ключи Firebase с самого начала, лучше не пытаться обойти их, поскольку они избавят вас от боли:

  • Эти ключи предназначены для работы в распределенной среде
  • Они могут быть синхронно сгенерированы на стороне клиента даже в автономном режиме
Все ли случайные символы?

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

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

Мы увидим эти ключи в действии в следующих разделах, прямо сейчас вас, вероятно, интересует следующее:

Как мне запросить данные, как изменить их Что насчет объединений, как мне снова объединить данные?

Мы собираемся ответить на эти вопросы, но перед этим лучше знать одну вещь: прямо сейчас вы не можете выполнять запросы SQL , такие как запросы , непосредственно в Firebase.

Если вам нужен мощный поиск, лучше на данный момент настроить специальное поисковое решение, как описано здесь, API Firebase постоянно расширяется и в будущем может включать больше параметров поиска. Но ничто не может заменить этот тип полнотекстового поиска, подобный Google.

Тем не менее, Firebase SDK действительно дает нам очень мощные возможности запросов без необходимости изучения отдельного языка запросов.

Firebase SDK, как использовать его с Typescript

Для чтения и записи из базы данных Firebase в реальном времени у нас есть несколько вариантов:

  • использовать только Firebase SDK напрямую в качестве библиотеки Javascript
  • используйте Firebase SDK с Typescript
  • использует AngularFire, который также позволяет нам получить доступ к Firebase SDK

Давайте начнем с установки всего этого, поскольку мы могли бы использовать все в определенный момент:

  npm установить firebase angularfire2 @ types / firebase
  

База данных Firebase на самом деле всего лишь один большой объект

Чтобы продемонстрировать, что база данных Firebase на самом деле представляет собой один большой объект JSON в небе, мы собираемся прочитать всю базу данных за один раз и распечатать ее на консоли:

Это выводит всю базу данных на консоль, вы же не хотите этого делать! Обычно вы хотите запросить внутренний узел базы данных, например курс или урок.

Но здесь происходит кое-что еще:

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

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

Здесь произошло кое-что еще:

вы только что кэшировали всю базу данных в браузере!

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

Ссылки и снимки Firebase

Firebase SDK использует в своем API несколько понятий, некоторые из которых мы только что видели здесь: ссылки и снимки.

Чтобы узнать больше об этих концепциях, вот видео о некоторых основах Firebase SDK:

Сейчас мы собираемся понять, что произошло с новым значением, полученным из базы данных, и как это работает. Мы использовали длинный запрос Ajax для опроса?

Веб-сокеты и их преимущества

Связь между клиентом Firebase SDK, работающим в браузере, и базой данных Firebase Real Time осуществляется через Websocket, если браузер клиента поддерживает его, в противном случае SDK прозрачно откатится к длительному опросу Ajax.

Обратите внимание, что все это прозрачно и внутренне для Firebase SDK, нам никогда не придется напрямую кодировать веб-сокеты, чтобы использовать Firebase.

Почему веб-сокеты быстрее?

Websocket использует длительное соединение TCP / IP, поэтому передача данных туда и обратно не включает стоимость установки соединения TCP / IP каждый раз, в отличие от случая Ajax-запроса.

Также с веб-сокетом, если вы хотите отправить объект по сети, вы оплачиваете только стоимость полезной нагрузки объекта, а не все стандартные заголовки HTTP, которые браузер автоматически включает в обычный запрос Ajax.Эти заголовки на самом деле могут быть во много раз больше, чем сами данные (для небольших полезных нагрузок).

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

Объединение данных в Firebase

Поскольку соединение между клиентом SDK и базой данных такое же быстрое, как и через Websocket, на стороне клиента возможно объединение данных для того объема данных, который обычно отображается в пользовательском интерфейсе, и даже некоторого больше данных, чем это.

Firebase сама по себе не поддерживает объединение запросов на сервере, вам нужно запрашивать каждый путь, который вам нужен, выполнив несколько запросов:

  • получить курс из курсов получить его ID
  • получить идентификаторы уроков для курса из уроковPerCourse
  • получить уроки для курса из уроков для каждого урока ID

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

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

Краткое описание того, что включает Firebase SDK

Подводя итог, Firebase SDK включает в себя все, что нам нужно для взаимодействия с базой данных Firebase в реальном времени (мы рассмотрим аутентификацию ниже):

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

База данных в реальном времени и наблюдаемые

Идея подписки на части базы данных действительно удобна, так как очень хорошо моделируется с помощью RxJS Observables.Обещания не являются естественным API для базы данных реального времени, потому что нам нужен асинхронный примитив, который позволяет обрабатывать несколько значений с течением времени, а обещание возвращает только одно значение.

И здесь на помощь приходит библиотека AngularFire. Обратите внимание, что если вы включите AngularFire в свое приложение, вы также получите Firebase SDK и сможете использовать его напрямую, подробнее об этом чуть позже.

Библиотека AngularFire

Начнем с добавления AngularFire в наше приложение:

  npm install angularfire2 --save
  

Затем мы настраиваем AngularFire в нашем прикладном модуле:

Благодаря этой простой конфигурации у нас есть все инъекционные элементы AngularFire, доступные в любом месте нашего приложения.Например, мы можем внедрить основное приложение Firebase SDK и использовать его напрямую:

Это эквивалент примера, который мы видели ранее, он читает всю базу данных, не делайте этого! Но это хорошее решение Hello World, если вы только начинаете.

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

Но обратите внимание, что здесь мы все еще используем интерфейс обратного вызова, а не API на основе Observables.Это потому, что мы на самом деле используем API Firebase SDK напрямую.

AngularFire дополняет это двумя наблюдаемыми API-интерфейсами привязки, которые позволяют подписаться на любую часть базы данных Firebase:

  • Вы можете подписаться на весь список
  • Или вы можете подписаться на один объект вместо

Давайте теперь посмотрим на AngularFire Observable API в действии и посмотрим, насколько он действительно является идеальным дополнением на стороне клиента для базы данных Realtime.

Доступ к базе данных в реальном времени через AngularFire

Допустим, мы хотим подписаться на список курсов, чтобы знать, когда появится новый курс. Раньше мы видели, как это сделать напрямую, используя Firebase SDK, теперь давайте воспользуемся AngularFire:

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

Давайте теперь посмотрим, как его использовать, вы также можете внедрить службу AngularFire, как в этом видео:

Запрос списка в AngularFire

Так как же нам использовать базу данных AngularFire для чтения списка уроков? У объекта базы данных есть два основных метода API для запроса данных: список и объект .

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

Возвращаемое значение вызова списка - это объект RxJs Observable, передаваемые значения которого являются содержимым списка уроков:

  • первое переданное значение будет текущим значением списка
  • , если никто не изменит урок в списке уроков, новое значение не будет выдано
  • , если кто-то изменит какой-либо урок в списке, будет выдано второе значение с совершенно новым списком

Ключевым моментом, который следует учитывать при использовании Observable, возвращаемого AngularFire, является то, что он не завершается после первого значения (хотя мы могли бы вызвать для него first () , чтобы получить такое поведение).Это не похоже, например, на Observables, возвращаемые Angular HTTP Library.

Observable остается «запущенным» (не завершается), поэтому со временем мы получаем новые значения, что на самом деле является наиболее естественным поведением Observable.

Список Вызов может быть настроен с помощью объекта конфигурации запроса, выполняющего такие действия, как разбиение на страницы, поиск на основе свойства и т. Д.

Запрос объектов в AngularFire

Точно так же, как мы можем запрашивать списки, мы также можем запрашивать определенный объект с помощью AngularFire через метод API объекта .Вот пример:

Этот запрос вернет нам Observable, значения которого с течением времени являются разными версиями урока с заданным Id.

Два основных API-интерфейса AngularFire очень удобны для работы с частями базы данных реального времени как наблюдаемыми. Но мы также можем изменять данные с помощью AngularFire.

Изменение списков и объектов в AngularFire

Допустим, у нас есть наблюдаемые курсы, значения которых являются списком всех курсов. Наблюдаемые курсы называются курсами долларов, поэтому переменная оканчивается знаком доллара, чтобы указать, что это наблюдается.

Мы могли бы написать новый курс в конец этого списка следующим образом:

Обратите внимание, что вызов push не возвращает Observable, мы возвращаем объект, похожий на обещание, для которого мы можем вызвать then () .

Возможности записи в базу данных с помощью Angular Fire доступны, но они по замыслу являются лишь подмножеством того, что мы можем делать с помощью SDK. Мы должны без колебаний внедрить приложение SDK и использовать его напрямую при использовании AngularFire, а также использовать всю мощь SDK.

Но не думайте, что вам нужно использовать Firebase SDK, чтобы вообще иметь возможность использовать базу данных Realtime!

Это правда, если вы хотите, чтобы SDK вам даже не понадобился, давайте разберемся, почему.

Firebase и REST

Если вам не нравится идея использования клиента Firebase для кэширования данных или если вам не нужны возможности базы данных в реальном времени, вы можете просто использовать вызовы Ajax с Firebase. Вам вообще не нужен SDK, только ваш любимый клиент REST.

Оказывается, все в Firebase имеет URL, начинающийся с корневого URL. И этот URL-адрес можно использовать для выполнения операций извлечения и изменения данных:

  • HTTP GET будет читать все данные на данном узле
  • PUT заменит все существующие данные новыми данными
  • PATCH может использоваться для изменения только некоторых свойств данных
  • a DELETE удаляет данные должным образом
  • POST добавляет запись в список

Это действительно так просто, и вам не нужно писать ни одной настраиваемой конечной точки REST! Но есть одна загвоздка: вам нужно добавить .json в конце URL-адреса.

Например, предположим, что корневой URL вашей базы данных:

  https://final-project-recording.firebaseio.com
  

И вы хотите прочитать все курсы под узлом первого уровня курсы . Если вы выполните GET по следующему URL-адресу, вы получите обратно JSON, содержащий все курсы:

  https://final-project-recording.firebaseio.com/courses.json
  

А вот итоговые данные:

Таким образом, вы получаете всю эту функциональность REST из коробки без написания единой строчки кода!

Но вы, вероятно, предпочтете использовать SDK: он имеет встроенное кеширование, и вы можете выполнять атомарные многопутевые обновления, в отличие от REST API.

Но если вы хотите просто сделать CRUD, он работает отлично и очень удобно.

Создание пользовательских серверных программ и пакетных заданий

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

Так как же создать собственный сервер с помощью Firebase?

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

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

Это решение известно как архитектура FIREstack. Чтобы узнать о нем больше, посмотрите это замечательное видео и запись в блоге @ChrisEsplin.

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

Как насчет пакетных заданий?

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

Это можно сделать, например, с firebase-queue , поэтому давайте установим его и покажем пример:

  npm установить firebase-queue --save
  

Итак, как нам писать в очередь на стороне пользовательского интерфейса? Скажем, чтобы привести простой пример, вы хотите вызвать удаление урока из курса.Но это не просто удаление данных, это логическое удаление со сложной бизнес-логикой.

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

Что вы можете сделать, так это начать во внешнем интерфейсе, отправив запрос на удаление в очередь:

Запишет запрос на удаление в очередь. Чтобы обработать запрос, вы можете создать процесс узла, который очень прост, он не должен получать входящие запросы HTTP или HTTPS.

Запись процесса узла потребителя очереди Firebase

Этот процесс просто использует один и тот же Firebase SDK, который является универсальным или изоморфным Javascript и работает как на клиенте, так и на сервере. Вы также можете использовать очередь Firebase для обработки запроса очереди и создания потребителя:

При определении своего потребителя вы получаете несколько аргументов в обратном вызове для обработки запроса очереди:

  • data содержит данные, которые вы сохранили в запросе очереди, запрос очереди теперь находится в состоянии «PENDING»
  • , вы можете вызвать progress () и передать ему номер, чтобы сообщить о проценте завершения задачи
  • нам нужно вызвать resolve () после успешного завершения задачи.Это удалит задачу из очереди.
  • нам нужно вызвать reject () , если во время выполнения задачи будет обнаружена бизнес-ошибка, задача будет помечена как ошибочная, и ее можно будет повторить позже, это можно настроить в firebase-queue
  • , если во время обработки возникает техническая ошибка, например, возникшее исключение, задача будет помечена как ошибочная в очереди, и у вас будет сообщение об ошибке, доступное там
Преимущества создания собственных серверных ВМ, подобных этому

Итак, как мы видим, мы можем создавать собственные серверные модули, вероятно, намного проще, чем если бы приходилось запускать процессы HTTP или HTTPS в узле, обрабатывать входящие HTTP-запросы и т. Д.Вместо этого мы можем написать эти очень простые и недоступные по сети процессы (проще обеспечить безопасность в этом сценарии) и просто использовать тот же Firebase SDK, который мы также используем во внешнем интерфейсе, - повторно используя знания и экономя мозговые циклы.

Нам не обязательно иметь какие-то относительно продвинутые знания в совершенно другой экосистеме и языке, это просто Javascript, и мы также можем извлечь выгоду из Typescript. Но Firebase SDK также доступен для многих других языков, помимо Javascript.

Но какие еще функции, кроме базы данных реального времени, дает нам Firebase?

Аутентификация Firebase

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

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

Сколько пользователей Роли и Таблицы базы данных SQL вы видели в проектах, над которыми вы работали? Это тот вид вещей, который может мгновенно работать из коробки с первого дня, если мы используем решение BaaS, но вместо этого мы часто переписываем его с нуля в каждом проекте.

Пример использования аутентификации Firebase

Если мы используем и Firebase SDK, и AngularFire, мы можем настроить аутентификацию с помощью пары вызовов API. Допустим, мы хотим аутентифицировать пользователя по электронной почте и паролю, вот как это выглядит с использованием Firebase SDK:

Аутентификация - лишь одна из многих проблем, которые Firebase может решить для нас из коробки.Другие функции, которые нам нужны для реализации приложения, включают облачные сообщения, хостинг, хранилище, тестовую лабораторию, отчеты о сбоях и многое другое.

Хранилище Firebase, хостинг и HTTP / 2

Если вы хотите создать свое приложение как одностраничное приложение, скорее всего, если вы не используете разделение пакетов, ваш интерфейс на самом деле состоит только из 3 статических файлов:

  • index.html, который представляет собой буквально единственную html-страницу вашего приложения и в основном пустую
  • пакет CSS
  • Пакет Javascript

И все, 3 статических файла! Одно из преимуществ одностраничных приложений, о котором часто не упоминается, заключается в том, насколько легко их развернуть в производственной среде: это всего лишь несколько статических файлов, загрузите их на Amazon S3 или на сервер nginx / apache и готово! По крайней мере, фронтенд.

Что может быть лучше для загрузки этих файлов, чем на сами серверы Firebase, чтобы вам не приходилось выполнять отдельный поиск в DNS, чтобы получить эти файлы откуда-то еще? Предоставляется сертификат SSL, поэтому он безопасен из коробки.

Не говоря уже о том, что вы получаете полную поддержку HTTP 2, если используете для этого Firebase Hosting. Вы также хотите загрузить все свои изображения на хостинг Firebase. Вы хотите извлечь выгоду из этой невероятной производительности, имея только одно соединение TCP / IP для получения индекса вашего приложения.html , пакеты CSS и Javascript, а также ваши изображения - все в одном DNS-запросе.

И если у вас нет поддержки HTTP 2, хостинг Firebase по-прежнему является довольно удобным решением, как и остальная часть Firebase, поскольку очень просто загружать файлы через командную строку, взгляните на этот Firecast on Hosting, чтобы увидеть его в действие.

Сводка

Подводя итог, это основные причины, по которым Firebase может оказать значительное влияние на текущее состояние веб-разработки:

  • он дает нам из коробки базу данных JSON, которая является именно тем, что нам нужно, чтобы уменьшить несоответствие базам данных SQL
  • при использовании Angular у нас есть очень удобный способ взаимодействия с Firebase с помощью AngularFire
  • намного проще создавать собственные серверные части, используя Firebase Queue и сам Firebase SDK, который работает одинаково как на клиенте, так и на сервере
  • он решает кучу проблем, которые нам не нужно каждый раз передавать код с нуля: аутентификация - это всего лишь пример
  • он дает нам полное решение CRUD для частей CRUD нашего приложения
  • многие знания, полученные при построении других систем, все еще применимы

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

Надеюсь, вам понравился пост. Я приглашаю вас взглянуть на список ниже, где есть другие похожие посты и ресурсы по Angular.

Я приглашаю вас подписаться на нашу рассылку, чтобы получать уведомления, когда появятся другие подобные сообщения:

Видеоуроков доступны на YouTube

Посмотрите на Youtube канал Angular University, там мы публикуем от 25% до трети наших видеоуроков, новые видео публикуются постоянно.

Подпишитесь, чтобы получать новые видеоуроки:

Другие сообщения на Angular

Если вам понравился этот пост, посмотрите также другие популярные посты, которые могут вас заинтересовать:

Firebase Cloud Messaging Tutorial для Android

package net.simplifiedcoding.firebasepushexample;

импорт android.app.NotificationManager;

импорт android.app.PendingIntent;

импорт android.content.Context;

импорт android.content.Intent;

импорт android.support.v4.app.NotificationCompat;

импорт статического android.content.Context.NOTIFICATION_SERVICE;

/ **

* Создано Belal 08.12.2017.

* /

открытый класс MyNotificationManager {

частный контекст mCtx;

частный статический MyNotificationManager mInstance;

частный MyNotificationManager (контекст контекста) {

mCtx = context;

}

общедоступный статический синхронизированный MyNotificationManager getInstance (контекст контекста) {

if (mInstance == null) {

mInstance = new MyNotificationManager (context);

}

return mInstance;

}

public void displayNotification (название строки, тело строки) {

NotificationCompat.Builder mBuilder =

новый NotificationCompat.Builder (mCtx, Constants.CHANNEL_ID)

.setSmallIcon (R.drawable.app_icon)

.setContentTitle (title)

.setContentText (body);

/ *

* Щелчок по уведомлению приведет нас к этому намерению

* Прямо сейчас мы используем MainActivity, так как это единственное действие, которое есть в нашем приложении

* Но для вашего проекта вы можете настроить его как хотите

* * /

Intent resultIntent = new Intent (mCtx, MainActivity.класс);

/ *

* Теперь создадим ожидающее намерение

* Метод getActivity принимает 4 параметра

* Все параметры описывают сами себя

* 0 - это код запроса (второй параметр)

* Мы можем обнаружить этот код в действии, которое откроется при этом, мы можем получить

* Какое уведомление открыло действие

* * /

PendingIntent pendingIntent = PendingIntent.getActivity (mCtx, 0, resultIntent, PendingIntent.FLAG_UPDATE_CURRENT);

/ *

* Установка ожидающего намерения для построителя уведомлений

* * /

mBuilder.setContentIntent (pendingIntent);

NotificationManager mNotifyMgr =

(NotificationManager) mCtx.getSystemService (NOTIFICATION_SERVICE);

/ *

* Первый параметр - это идентификатор уведомления

* лучше не вводите здесь литерал (прямо сейчас мы даем литерал int)

* потому что, используя этот идентификатор, мы можем изменить его позже

* * /

if (mNotifyMgr! = Null) {

mNotifyMgr.уведомить (1, mBuilder.build ());

}

}

}

Сопоставление пользовательского домена Google Firebase с GoDaddy

В моем сообщении о том, как развернуть ваш веб-сайт на firebase, я объяснил, как разместить наш веб-сайт в Google Firebase, и мы можем получить доступ к веб-сайту, используя URL-адрес firebase. Теперь в этой статье мы поговорим и узнаем о добавлении нашего веб-сайта с персональным доменом, например ваших собственных доменов, приобретенных на домен, предоставляющий веб-сайты, такие как GoDaddy и NameCheap.В этой статье мы собираемся интегрировать наш домен в GoDaddy с веб-сайтом, размещенным на Firebase. Я попробовал и интегрировал свой личный домен, взяв ссылку из документации google firebase

Шаг 1. Зайдите в консоль firebase и проверьте свой проект.

Шаг 2: Щелкните Hosting Link слева, и вы увидите, что ваш веб-сайт по умолчанию развернут.

Шаг 3: Щелкните ссылку Connect Domain на странице.

Шаг 4: Добавьте доменное имя во всплывающем окне подключения личного домена.

Шаг 5: Теперь вы получите идентификатор подтверждения сайта Google и скопируете его. Примечание: не копируйте единственное значение, вы должны скопировать весь текст, например:

google-site-verify = 9xUIjWlRgKX-jsM8Hhlaj3HHtDK0xnEoA98Ms

Нам нужен этот идентификатор проверки сайта Google, чтобы добавить в TXT запись в провайдере DNS.

Шаг 6. Теперь вернитесь в GoDaddy, войдите в свою учетную запись и перейдите на страницу домена

.

Шаг 7: Теперь нажмите на три точки рядом с кнопкой Use My Domain и щелкните ссылку Manage DNS .

Шаг 8: На странице управления DNS добавьте значение идентификатора подтверждения сайта Google в качестве значения TXT в список.

Шаг 9: Теперь, после добавления этого значения TXT в список DNS, вернитесь в консоль firebase и щелкните ссылку подтверждения во всплывающем окне пользовательского домена.

Шаг 10: В FireBase на GoOnline Step вы получите 2 IP-адреса, которые вам нужно снова добавить в таблицу GoDaddy DNS как Type A .

Шаг 11: Теперь снова вернитесь в консоль Firebase и подключитесь.

После выполнения всех шагов через некоторое время вы увидите, что ваш веб-сайт запущен и работает с пользовательским доменом, который вы только что добавили в firebase. ** Вы увидите ошибку сертификата для HTTP в течение некоторого времени, но через некоторое время после проверки сертификата ошибка исчезнет, ​​и вы сможете получить доступ к веб-сайту по HTTPS **

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

Напишите мне, если у вас возникнут проблемы при подключении личного домена.

Спасибо за чтение!

.

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Theme: Overlay by Kaira Extra Text
Cape Town, South Africa