Geek Answers Handbook

Chrome extensions and content scripts can only interact in the "check pop-ups" mode

I have this pretty simple extension and content script:

manifest.json:

{
  "name": "My.First.App.Uses.Native.Api",
  "version": "1.0",
  "manifest_version": 2,
  "description": "My app uses my first Native Api",
  "icons": {
    "128": "icon-128__2.png"
  },
  "permissions": [
    "nativeMessaging", "activeTab"
  ],
  "browser_action": {"default_popup": "ext-page.htm"},
  "content_scripts": [
    {
      "matches": ["file:///*"],
      "js": ["content-script.js"]
    }
  ]
}

EXT- script.js

// Listen for messages that come from the client script.
chrome.runtime.onMessage.addListener(
  function( request, sender, sendResponse ) {
    if( request.greeting ) {
        //connectToNative();
        sendResponse( { farewell: request.greeting + ' -> received' } );
    }
  } );

content script.js

var btn = document.getElementById( 'mybutton' );
if( btn ) {
    btn.addEventListener( 'click', function() {
        var msg = document.getElementById( 'mytext' ).value;
        if( msg ) {
            chrome.runtime.sendMessage( { greeting: msg }, function( response ) {
                console.log( response.farewell );
            } );
            //port.postMessage({joke: "Knock knock"});
        }
        else {
            alert( "content script could not send message" );
        }
    } );
}

int-page.htm:

<!DOCTYPE html>
<html>
<head>
    <script src='./ext-script.js'></script>
</head>
<body>
    This is a test Extention.
</body>
</html>

An example of the page whose contents are inserted into the script:

<html>
<head>
    <title>Connecting to a Chrome Extention using Content Script</title>
</head>

<body>
    <p>
        <!--<input id="btn" type="button" value="open document" />-->
        <input id="mytext" type="text" />
        <input id="mybutton" name="mybutton" type="button" value="open document" />
    </p>
</body>
</html>

: " " ( ) " " , , . - . " " , :

(): TypeError: "" undefined

!

+4
1

, main.js, , . background.js. background.js content_script, .

.js

    if( msg ) {
        chrome.extension.sendRequest( msg );
    }

Do

var msg = document.getElementById( 'mytext' ).value;
    if( msg ) {
        alert( msg );
    }

:

{
    "manifest_version": 2,
    "name": "Test",
    "version": "0.1",
    "background": {
    "scripts": ["background.js"],
    //this script is the main one which your extension communicates with
    "persistent": false
},
"browser_action": {
    "default_title": "BET",
    "default_popup": "popup.html"
    //this html file is the one that will be shown when clicked on your extension icon
},
"content_scripts": [{
    //this file will get injected into the tabs
    "matches": ["file:///*"],
    "js": ["content.js"]
}],
"permissions": [
    "tabs",
    "<all_urls>"
]

}

, content.js

chrome.tabs.sendMessage(tabs[0].id, {greeting: "hello"}, function(response) {
    console.log(response.farewell);
});

background.js

chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
    console.log(request.greeting);
    if (request.greeting == "hello")
        sendResponse({farewell: "goodbye"});
});

, , script, ... .

, , . ,

0

More articles:


All Articles