📜 ⬆️ ⬇️

Chrome HabraMail Extension (and favicon method)

In continuation of the topic .

This time, tired of the usual habr mail (from the endless updating of pages, clicking on links, etc.), I decided to write a small extension for google chrome, which should simplify the everyday tasks of a habra person.

Meet your friend, HabraMail !
')
This is, so far, the beta version (a lot of things have to be finalized ), but you can start using it now.

UPD: Source Code

The rest is under the cut:

Description



After installation, on any page of the habr, its icon will be displayed in the lower right corner.
image
We click on it and leave a small window with the latest messages in our "habrayaschike."
image
Click on the topic of the message, and smoothly, without rebooting, we get a window with our message.
image
Click on the inscription "write" or the name of the author (to the left of the subject of the message), and a new message form appears.
image
In the form of viewing, by the way, you can also delete the message.

Technical implementation


As soon as I started writing this extension, I immediately encountered the following kind of problem: even though chrome extensions can send cross-domain requests, the Origin property will be put in the request header, equal to the url of the page from which it is sent.

All would be nothing, but the server habrakhabra refuses to accept requests with a different Orgin.

And here comes the help of the favicon method, which I will tell you about ( it is quite likely that I am not the first to think of it before ).

Favicon method


And I decided to do a cross-domain request using iframe (content scripts are connected, and there too). But the trouble - the smallest page I could find (I was looking, though not for long) - this is “404 error”. Of course, this did not suit me, and I began to look for an “alternative” solution.

I accidentally noticed that the extension can even connect to a page where there is nothing at all except for a picture ( for example, http://example.com/example.png ).

I recall that the task was to send a request from the domain username1.habrahabr.ru (or just habrahabr.ru ) to the domain username2.habrahabr.ru .

And using the “find with picture” in my extension, I decided it as follows: instead of the icon, we put an iframe without border with a fixed width and height, which loads the following url: http://username2.habrahabr.ru/favicon.ico . A content script is inserted into this iframe that communicates with the main page ( username1.habrahabr.ru ) through an extension ( using chrome.extension.connect ). The script on the main page sends a request to the extension, it sends to the iframe, and he back, and the extension returns the answer to the script.

Here's a method for sending cross-origin requests to chrome extensions.

I look forward to feedback and suggestions!

Source: https://habr.com/ru/post/85452/


All Articles