How to add Firebase to a Service Worker - Chrome Extension Manifest Version MV3

Rusty Zone · 14K views · 2021 · 4:30

Open on YouTube

Web developmenttutorialdated

Why Stack Overflow recommends it

Stack Overflow users link it when answering how to get Firebase working in an MV3 Chrome extension without hitting Content Security Policy errors from remote scripts.

Recommended by 2 people across 2 different months, 2022 to 2022.

What it is

A short tutorial from the Rusty Zone channel showing how to use the Firebase SDK in a Chrome extension under Manifest V3. Because MV3 bans remotely hosted code, it shows how to download the SDK files, import them into the service worker, and wrap the setup in a try/catch block.

What people said

Recommends user18173299 · 2022-02 · Stack Overflow · on “Chrome Extension with Firbease "URL violates Content Security Policy"”

In Chrome Manifest version 3, you can’t load external scripts. You need to download all Firebase packages and include them in your extension package to be used with a service worker. This video helped me: [this video]

Recommends Sandeep Vokkareni · 2022-11 · Stack Overflow · on “Chrome Extension Firestore Database Manifest Version 3”

Seems like the updates on the Chrome extension feature is not allowing to communicate with the Firestore service through the Chrome extension using manifest V3. The new update is not using the "page" background option. The service is available for RTDB, but not for Firestore. The Firestore service is still working using Manifest V2. Meanwhile you can use Firebase. This tutorial [this video] may help you. Regarding the external firebase files link, actually it's a pattern of URL, not the link.

Cites Camron · 2022-03 · Stack Overflow · on “How to implement Apple Sign In in Chrome Extension MV3?”

I have a Chrome extension built with MV3. It is a companion product to a mobile app that allows users to sign up / sign in with email, Google, and Apple. I have used the Firebase Authentication service to set up email sign up and Chrome Identity API to set up Google Sign in (solutions offered e.g. here [LINK] & here [LINK] ). However, Apple Sign in (or any other 3rd party auth) seems to be completely broken in MV3 because popup/redirect OAuth operations are not yet supported [LINK] in MV3. Seems like such a big miss by the Chrome Extension team! My question Is there a workaround solution to implement Apple Sign in for Chrome extensions using MV3? Solutions I've tried thus far I've spent a we

Cites ManuelMB · 2022-09 · Stack Overflow · on “How to add Firebase SDK version 9 to a Service Worker Chrome Extension Manifest Version MV3?”

I found this video How to add Firebase to a Service Worker - Chrome Extension Manifest Version MV3 [this video] created at 26 Jan 2021 Importing the files in the same way he did in the video I got the following error: "SyntaxError: Unexpected token 'export'" To try solve this I changed manifest.json to include "type"="module" (because firebase SDK version 9 uses es module) { "background": { "service_worker": "firebase.js", "type": "module" } } And now the error is: "importScripts() of new scripts after service worker installation is not allowed" So I dowloaded to the extension [LINK] to include Firebase static js files in the extension in a folder called firebase and try to import as follows. imp

Cites Ryan Kim · 2022-11 · Stack Overflow · on “CSP error occured when on build an extension with Flutter included Firebase Auth”

I'm trying to build an extension with Flutter sources included Firebase Auth. is occurred a CSP error. what should I do? is there any way to solve this problem? or BP examples? flutter build web (OK) web extension build ( CSP error) Modify manifest.json, index.html for web extension build (ref. Building a Chrome Extension Using Flutter [LINK] [this video] CSP Violation in GitHub core [LINK]