0

I'm having a trouble with the migration from the MV2 to MV3 in my chrome extension application. With the MV2, everything worked fine implementing the azure library in the background.js file through the html one. But with the MV3 and the background.js file becoming a service worker i tried several thing to make my app functional with no results.

According to the documentation, i switched background part in the manifest file to :

"background": {
        "service_worker": "background.js",
        "type": "module"
    },

I built the module of the azure cognitive services sdk through https://github.com/microsoft/cognitive-services-speech-sdk-js

But when i try to import it in the background.js like this :

import * as SpeechSDK from './distrib/es2015/microsoft.cognitiveservices.speech.sdk.js';
var speechConfig = SpeechSDK.SpeechConfig.fromSubscription(
  "key",
  "region"
);
speechConfig.speechRecognitionLanguage = "fr-FR";
speechConfig.outputFormat = SpeechSDK.OutputFormat.Detailed;

I get the error "Service worker registration failed" and "An unknown error occurred when fetching the script." I tried multiples things like using a wrapper or the importScripts function according to this post : chrome extension mv3 - Modularize service worker js file but none of them worked for me. Do you have any idea how to use the azure cognitive services in a chrome extension MV3 ? Thanks in advance !

Delal
  • 1
  • 1
  • 1
    Service workers don't have the necessary API for audio/speech. Welcome to ManifestV3 that breaks thousands of extensions. You'll have to open a new tab/window and do the processing there or add an [extension iframe](/a/25100953) inside the web page. – wOxxOm Apr 04 '22 at 09:46
  • 1
    Oh yeah didn't thought the problem could be that. So i guess AudioContext() and co doesn't work anymore in service worker. Not very cool.. As you said maybe the best thing to do is to avoid this weird backgroud file. I will try what you suggested. Thanks ! – Delal Apr 04 '22 at 10:03

1 Answers1

0
  1. Hot Permission:

In MV3 you need to mention the hot permissions separately. Follow the below code block to mention the hot permissions.

// Manifest V3
"permissions": [
  "tabs",
  "bookmarks"
],
"optional_permissions": [
  "unlimitedStorage"
],
"host_permissions": [
  "http://www.blogger.com/",
  "*://*/*"
],
  1. CSP (Content Security Policy):

Check the CSP headers code block.

// Manifest V3

"content_security_policy": {
  "extension_pages": "...",
  "sandbox": "..."
}
  1. Action API Unification:

There is a small different between MV2 and MV3 implementation in background.js

// Manifest V3

// manifest.json
{
  "action": { … }
}


// background.js
chrome.action.onClicked.addListener(tab => { … });

For better reference, check out the below document.

https://developer.chrome.com/docs/extensions/mv3/intro/mv3-migration/

Sairam Tadepalli
  • 1,563
  • 1
  • 3
  • 11