How to block a specific URL in google chrome extension? - google-chrome

I am trying to develop a chrome extension which blocks a specific URL like gmail.com and when someone goes to gmail.com they got pop up to enter the password to continue to that website, this may decrease unauthorized way of accessing your personal sites.
If you know something about let me know, I have googled some extension and there are two-three extensions which block sites like stay focused.

The simplest way to do this is to inject a content script to all pages that should be 'protected' (you can set it up using "content_scripts"/"matches" setting in manifest.json). When script is injected and fired it should display the login dialog and handle the sign in process. You may use this code as a starting point for your extension.
BTW, I don't think that your extension can really protect anything working the way you described it. Extensions may be easily deactivated/uninstalled.

Related

Get Chrome to open Google Cloud Storage links

I would like to be able to open a tab in Chrome and enter something like gs://bucket-name/path/to/file and have it open the corresponding page in the GCP Web Console https://console.cloud.google.com/storage/browser/bucket-name/path/to/file. I saw there are external protocol handlers in Chrome, but I don't want to open an external application. I just want it to open another page based on the URI. I also don't want to put up any of my own servers for this simple purpose. Perhaps a Chrome Extension that can do some simple JS on the URI after I enter it into the address bar?
I think it is possible now with link you gave (works for me).
#shiv turned my attention on fact that this is question about automated link replacement under the hood in address bar when you write "gs://bucket-...". So such handler just collects address and modifies it and uses modified version to go further.
Well then looks like you need something like this Set custom protocol handler in Firefox? (in case of Firefox) but unfortunately I cannot help more.

Window.postMessage - Two pages, same URL

I'm using
window.postMessage({message: "Hello !"}, url);
to send a message from a Chrome Extension (i don't know if this is relevant) to a specific page in a window with multiples opened pages. I noticed that sometimes i have TWO pages with the same URL.
I have a simple question:
How can i be sure to which page is postMessage sending the message ?
I want to send the message to only one tab. Can i use anything else apart from the url to identify the it?
Thanks in advance !
Considering that you said you can modify the remote website's code, and I don't see how to fix the postMessage solution, here are a couple of alternatives. I would love to know if there is a way to fix the postMessage approach, as it is the recommended one from the docs!
First off, you will need to coordinate your scripts from a central background page, which can keep track of open tabs.
Custom DOM events
This is an old recommendation from Chrome docs, that was replaced with window.postMessage example. It is described here (disregard the old chrome.extension.connect API) and consists of firing a custom event in shared DOM.
So, a sample architecture would be a background page deciding which tab to post message to, and sending that tab a message via chrome.tabs.sendMessage, to which your content script listens with chrome.runtime.onMessage. The tab's content script can then communicate with the page using the above custom event technique.
One possible approach to keeping tack of tabs: have the tabs permission to be able to enumerate all open tabs with the chrome.tabs API. Your background page can then decide which tab to message based on URL.
Another possible approach, to eliminate need for the scary tabs permission, is to have your content scripts report to the background page with chrome.runtime.connect as soon as they are initialized. The background page then can keep track of all active instances of your script and therefore decide which tab to message.
Webpage connecting to your extension
This is a "modern" way of doing communication with one exact extension.
It is described in the Chrome docs here. You can define your extension as externally connectable from your webpage, and your webpage initiates a port connection with your background script.
Then, as above, you can track live ports and use them for communication, cutting out the content script middleman.

Google Chrome - Extension vs App

I want to modify chrome start page, change background and maybe logo.
I want to include jQuery in users local storage and load it while users page loads ( search page )
I never done anything with chrome so I want some way where to start. Do I go reading with apps or extensions?
As a rule of thumb: Choose an app if you want to develop an (independent) application that can stand on its own. If you want to interact with the browser (e.g. modify a web page), build an extension.
In your case, you definitely need an extension.
Change start page - use chrome_url_overrides in the manifest file to override newtab.
Locally store jQuery: Although it's possible to store jQuery in local storage, you're probably fine with packaging jQuery with your extension.
To add it to your user's "search page", you have to use a content script. By default, content scripts run in an execution environment that is different from the page (the document's DOM is shared though). Usually, this behavior is desired. If you really want to expose the jQuery library to the scripts in the page, take a look at this answer.
If you really want to load some script from a remote location and use it as a content script, read Chrome extension adding external javascript to current page's html.
I'm not sure what you mean by "change background and maybe logo". If you're referring to the browser's appearance, the only option to do that is by creating a theme. This must be a separate extension.

Can I use Google Drive's editor interface embed in a website?

I want to use google drive to store the files, but allow the users of my website to be able to edit them transparently, so that they don't have to go to google drive's website.
Is this possible with the current API? Thus far I have only seen how to create an app for them to install in google drive, or doing something like DrEdit (https://developers.google.com/drive/examples/), which parses the files to JSON and uses the ACE editor, which is definitely not what I want.
EDIT:
I believe it is not possible to do this with Google Drive, I've decided to go with Zoho Docs instead.
Yes it's possible. The biggest consideration is how much formatting you want to support. Eg. if it's plain text, it's very simple. If you want to support character or layout formatting, it becomes more complex.
I don't believe its possible to embed the editor (or even embed a preview!) using an iframe, because if you look at how the google docs page loads, it first redirects you to the login page, and that automatically logs you in if you are already logged in, and redirects you back to the docs editor.
This means that the iframe would have to at least pass through the login page, even if the user doesn't need to enter anything. However, google's login page has the x-frame-option header set to SAMEORIGIN (or deny?), and thus, the browser refuses to display it, and thus you can't actually get logged in!
The only way I've found to enable just preview embedding (not editing), is to publish the document first (via the File->publish to web menu item).

How to build a chrome extension to add panel to gmail windows?

I want to build a chrome extension like rapportive.com. I'm new to Chrome extensions and Gmail Content Script. Can any one please suggest how to go about this?
Currently I'm reading Google's Gadget docs.
Here are some notes to get you started. There are more robust ways to build this, but this is the "hello world" of the functionality you are talking about:
You will need to define a content script that you add to the context of gmail. This part is pretty easy and can work with any of the content script examples available in the Google's documentation. You should read and learn about what it means to be a content script.
The content script will need to know where to look inside gmail for an email address. This address will be used to grab the social media information on the user. You message this email address from the content script to the extension's background page.
The background page will need to have social media integration that the user pre-configured. Basically, you need to plug the background page into Facebook's/Twitter's/LinkedIn's APIs and use their APIs to collect information about the email address.
The background page will then message the content script you added to gmail with the social media details for the email address
The content script then modifies gmail's user interface to contain your social media details.
The greatest long-term challenge you will face is that gmail's layout will change unexpectedly and break email discovery or the modified UI. Both issues either require some cleverness to solve, or will require you to stay up at night wondering whether Google will suddenly break your extension.
Good luck!
I don't know what google gadget is and link you provided gives 404 but I don't think you even need this.
What you need is a content script that is injected into gmail page where it adds a panel. So, start with reading about how to create a Chrome extension that is using content scripts.
There is a new SDK for modifying the DOM elements in gmail: https://www.inboxsdk.com/docs/
They have a useful API for adding buttons and other elements.