Write a chrome extension to console.log the active tab URL whenever a new page is loaded

Question

I want to write a chrome extension which records the current active tab URL every time a new site is loaded and send it to a server for further use. So far I have managed to write the following code: manifest.json

{
    "manifest_version": 2,
    "name": "Currenturl",
    "description": "Fetches current tab url.",
    "version": "0.1",
    "author": "Tarun Khare",
    "browser_action": {
        "default_icon": "icon.png",
        "default_title": "Just observing your current url."
    },
    "permissions": ["tabs", "activeTab"],
    "background": {
        "scripts": ["content.js"],
        "persistent": false
    }
}

content.js

chrome.tabs.query({'active': true, 'lastFocusedWindow': true}, function (tabs) {
    var url = tabs[0].url;
    console.log("hello: "+url);
});

I am using background scripts since chrome.tabs doesn't work in content scripts. But this extension is not printing anything in chrome console. What is the issue?

Answer 1

1. Rename content.js to background.js since this is a background script
2. Use chrome.tabs.onUpdated listener
3. Look at the correct console: Where to read console messages from background.js?

---

chrome.tabs.onUpdated.addListener((tabId, change, tab) => {
  if (change.url) {
    console.log(change.url);
  }
});

It'll report the URL changes in all tabs.
You can also limit the processing to only the active tab by adding a check for tab.active property.

Answer 2

i try to write code based on the information you provide.

const tabUpdatelistenerFun = (tabid, changeInfo, tab) => {
  const url = changeInfo.url;

  if (!url || ['chrome://', 'about://'].some(p => url.startsWith(p))) return false;

  const { index, active, highlighted, windowId } = tab;

  if (!active) return false;

  chrome.tabs.query({ index, highlighted, windowId, lastFocusedWindow: true }, () => {
    console.log(url);
  })
}

chrome.tabs.onUpdated.addListener(tabUpdatelistenerFun);

i think this is what you want.

Answer 3

You can count and extract the URL with full detail in background.js here is the main code from below GihHub repository:

    chrome.windows.getAll({ populate: true }, function (windows) {
    windows.forEach(function (window) {
    window.tabs.forEach(function (tab) {
    //i++
    collect all of the urls here, I will just log them instead
    console.log("tab.ur[![enter image description here][1]][1]l aaaaakahari 2");
        console.log(tab.url);
    });
  });
});

There is a GitHub repository of chrome Extension below here, you can find in the background.js there are methods to count and extract the open URL, and there is and even section that console it imminently when the user open or close any tab.

https://github.com/Farbod29/extract-and-find-the-new-tab-frome-the-browser-with-chrome-extention