Как заблокировать непроизводительные веб-сайты и повысить производительность с помощью JavaScript

1656528256 kak zablokirovat neproizvoditelnye veb sajty i povysit proizvoditelnost s pomoshhyu javascript

от Мадхова Бала

1*9-xBdZXdd_FT1X-DTTX75A
Пора делать дерьмо 🙂

Устали тратить свое время на разные непроизводительные веб-сайты? Почему бы не создать сценарий, который помог бы вам ограничить время, которое вы проводите на этих веб-сайтах?

Это звучит знакомо…?

Еще один день, прокручивая мой Соц.медиа кормить и смотреть мему. Я обнаружил, что прошло 4 часа с тех пор, как я сидел в той же позе и ничего не делал. Я ненавидел это! Мне нужно было что-то с этим делать. Мне пришло в голову, почему бы не создать сценарий, который помог бы мне ограничить время, которое я провожу на этих веб-сайтах?

0*bIF5jb6o8DpD_JvS
Прекратите прокручивать свой канал и сделайте что-нибудь xD (источник: https://www.writerswrite.com/writingmemes/)

Как насчет создания сценария, который блокировал бы все эти веб-сайты? Сценарий позволяет использовать их только в определенные часы дня. Звучит законно! Давайте сделаем это. 🙂

Да, я знаю, что есть много простых способов заблокировать любой веб-сайт. Просто загрузите плагин Chrome, или, вернее, любое программное обеспечение, которое сделает это за нас. Ну да, достаточно просто! Но давай мы разработчики, мы не делаем таких вещей! Когда нам что-то нужно, мы разрабатываем для этого сценарии, а не используем какой-нибудь случайный трюк для выполнения работы… не правда ли?!

Если вы хотите загрузить сценарий напрямую, вы можете сделать это здесь.

Давайте начнем!

В отличие от других моих учебных статей вам не понадобится структура каталогов или среда разработки, настроенные для этого проекта. Все, что вам нужно это установить NodeJS в вашей системе и хороший текстовый редактор. Вы можете создать этот сценарий, используя любой язык по вашему выбору, который поддерживает обработку файлов. Я выбрал JavaScript, потому что мне это нравится!

0*Fhqu52MS8kbjNWKY
Я ❤️ JavaScript! (источник: https://brendaneich.com/2015/06/from-asm-js-to-webassembly/)

Фоновая идея

Идея этого блокировщика, которую мы собираемся создать, очень проста. Есть файл с именем hosts. Мы можем добавить URL-адрес любого веб-сайта и URL-адрес веб-сайта, на который мы хотим перенаправить предыдущий веб-сайт. Что-то вроде этого:

127.0.0.1    www.facebook.com

Теперь, когда мы пытаемся открыть Facebook, он будет автоматически перенаправлен на 127.0.0.1 (localhost). Это косвенно заблокирует веб-сайт.

Файл hosts, о котором я говорю, присутствует C:\Windows\System32\drivers\etc\hosts если вы используете Windows. Если вы используете Mac или Linux, расположение этого файла: /etc/hosts.

Давайте изменим файл…

Прежде чем запустить код, давайте попробуем изменить файл и проверим, работает ли он. Обратите внимание, что только пользователь с правами администратора может изменить этот файл. Если у вас Windows, вы можете щелкнуть правой кнопкой мыши на этом файле и открыть его от имени администратора. Если вы используете Linux, вы можете использовать команду sudo. Я использую nano для открытия файла, вы можете использовать любой другой редактор по вашему выбору.

sudo nano /etc/hosts

После ввода этой команды вам будет предложено ввести пароль. Вы можете ввести его и открыть файл. Давайте попробуем:)

1*0MXqMMIcuM34PF780gIO-w

Ладно, мы добавили наш веб-сайт «для блокировки» к файлу hosts, теперь давайте проверим, работает он или нет. Чтобы проверить это, перейдите к любому браузеру и перейдите на этот веб-сайт.

0*l-CTDo6vZEcLlSUu
Yippee! Это сработало :3

Теперь, когда мы проверили, что наша концепция верна, давайте закодируем блокировщик.

1. Настройка переменных

Как я уже говорил ранее, нет необходимости в огромном структурировании каталогов или настройке среды разработки. Все, что вам нужно сделать, это создать файл JavaScript (скажем, blocker.js) и начните кодировку.

Прежде всего, нам нужно импортировать fs (файловая система) Модуль узла, с помощью которого мы будем вносить изменения в наш файл hosts. Вы можете прочитать полную документацию fs здесь.

const fs = require('fs');

Теперь нам нужно инициализировать 3 переменные:

  1. путь к файлу — Чтобы сохранить путь к файлу hosts
  2. redirectPath — Для пути перенаправления (здесь, localhost)
  3. веб-сайты — Массив веб-сайтов, которые необходимо заблокировать

Кроме того, мы создадим переменную с именем delay. Эта переменная сохраняет значение продолжительности времени (в миллисекундах), после чего наш скрипт повторится. В основном идея заключается в том, чтобы скрипт постоянно работал, чтобы проверить, пора ли блокировать/разблокировать веб-сайты. Для поддержания его работы мы будем использовать setInterval() метод в JavaScript. Мы также можем использовать while (true) {} чтобы совершить бесконечный цикл.

Сейчас мы сохраняем время, после которого функция повторяется, постоянным (скажем, 10 секунд). Но этот сценарий можно сделать умнее, установив значение задержки равной разнице во времени между текущим временем и временем, когда необходимо изменить состояние сценария (блокировка/разблокировка). Сделать это гораздо проще, чем кажется, поэтому я хочу, чтобы вы (читатель) сделали это сами, и напишите мне, я хотел бы услышать от вас?

const filePath = "/etc/hosts";const redirectPath = "127.0.0.1";let websites = [ "www.someRandomWebsite.com","anotherWebsite.com" ];let delay = 10000;

Примечание* Если вы пользователь Windows, сохраните это в переменной filePath: C:\Windows\System32\drivers\etc\hosts

2. Функция блокировки

Теперь мы сделаем функцию блокировки. Мы вызываем его из метода setInterval, чтобы поддерживать его работу после каждого заданного интервала времени.

let blocker = () => {    ....    ....};

Теперь мы заполняем код внутри нашей функции блокировки.

Внутренний блокировщик: получение текущего времени

Прежде всего нам нужно получить текущее время, а затем проверить, пора ли заблокировать веб-сайт или разблокировать его.

let date = new date();let hours = date.getHours();if(hours >= 14 && hours < 18) {    console.log('Time to block websites');    ....    ....} else {    console.log('Time to unblock websites');    ....    ....}

Внутренний блокировщик: Inside If — условие If истинно

Теперь нам нужно прочитать файл hosts и превратить полученные данные в строку ( readFile() функция вернет буферные данные, которые нужно преобразовать в строчку).

После прочтения файла нам нужно проверить, есть ли каждый веб-сайт и путь перенаправления в файле hosts или нет. Если он находится, мы можем его игнорировать. В противном случае нам нужно добавить redirectPath websiteURL к нему, который будет выглядеть примерно так:

127.0.0.1    www.someRandomWebsite

Для реализации этого мы будем использовать цикл for. Цикл перебирает каждый URL в массиве веб-сайтов и проверяет, существует ли он в файле. Для этого воспользуемся indexOf() метод струн. Если значение больше нуля, то есть данный веб-сайт находится в файле hosts, мы можем просто проигнорировать. В противном случае, если значение не больше нуля, нам нужно добавить в файл путь перенаправления и URL веб-сайта (разделенные пробелом).

fs.readFile(filePath, (err, data) => {    fileContents = data.toString();    for(let i=0;i<websites.length;i++) {        let addWebsite = "\n" + redirectPath + " " + websites[i];        if (fileContents.indexOf(addWebsite) < 0) {            console.log('Website not present in hosts file');            fs.appendFile(filePath, addWebsite, (err) => {                if (err)  return console.log(err);                console.log('File Updated Successfully');            });        } else {            console.log('Website is present');        }    }});

Внутренний блокировщик: Inside Else — если условие ошибочно

Если условие ошибочно, нам нужно проверить, есть ли веб-сайты в списке в файле hosts. Если они находятся, мы должны их удалить.

Для удаления мы воспользуемся простым приёмом. Мы будем читать файл строку за строкой. Мы создаем пустую строку и проверяем, содержит ли текущая строка какой-либо из веб-сайтов, присутствующих в списке. Если да, мы просто игнорируем это. Иначе мы добавим эту строку к инициализированной строке. После проверки последней строки мы просто заменим текущее содержимое файла этой полной строкой Content.

Код для этого очень прост. Сначала инициализируйте пустую строку (completeContent). Затем прочтите файл строку за строкой. Выполните шаги, приведенные ниже. Затем замените содержимое файла на переменную completeContent.

// Initialize the empty stringlet completeContent="";
// Read the file line by linefs.readFileSync(filePath)    .toString()    .split()    .forEach((line) => {        ....        ....        ....        // Do the below given procedure to update completeContent });
// Replace the file contents by `completeContent` variablefs.writeFile(filePath, completeContent, (err) => {    if (err) {        return console.log('Error!', err);    }});

Теперь, когда у нас есть доступ к каждой строке, мы можем проверить, содержит ли эту строку какой-либо веб-сайт с помощью флажка и цикла for. Мы устанавливаем флажок на 1 (или true), а затем запускаем цикл для итерации списка веб-сайтов. Если строка содержит текущий веб-сайт (мы проверим его с помощью string.indexOf(substring) метод), сбросьте флажок на 0 и разорвет текущий цикл. Вне цикла мы проверяем, если флаг равен 1 (или истина), мы добавляем текущую строку к completeContent переменный.

Также обратите внимание что если флаг равен 1, мы также проверяем, есть ли текущая строка последней или нет. Если это не последняя строка, мы добавляем текущую строку к completeContent строка вместе с a "\n" так что следующая строка будет добавлена ​​к completeContent из новой строки (или с разрывом строки). Следуйте следующему коду внутри forEach() вышеуказанного блока кода.

let flag = 1;for (let i=0; i<websites.length; i++) {    if (line.indexOf(websites[i]) >= 0) { // line contains website        flag = 0;        break;    }}
if(flag == 1) {    if (line === '')           completeContent += line;    else         completeContent += line + "\n";}

3. Запуск кода для функции блокировки

Вот код функции блокировки на тот случай, если вас перепутали с распределенным кодом в главе 2:

Теперь для непрерывного выполнения этой функции мы можем воспользоваться while (true) {} как нескончаемый цикл. Внутри мы можем дать определенную задержку, чтобы она не занимала процессор постоянно.

Или, лучший вариант – использовать setInterval() функция. Это продолжает повторять функцию блокировки через определенный промежуток времени. но, setInterval() запустится впервые после указанной задержки. Поэтому мы должны вызвать функцию блокировки один раз перед функцией setInterval.

blocker();setInterval(blocker, delay);

4. Все готово! Давайте проверим наш сценарий

Пора запустить наш сценарий. Для запуска сценария откройте текущий рабочий каталог в терминале и введите следующую команду:

sudo node blocker.js

Если вы используете Windows, вы можете открыть командную строку как администратор, перейти в каталог проекта, а затем запустить команду:

node blocker.js

Обратите внимание, что я блокирую только для проверки facebook.com. Вот тестовый запуск:

1*3csxXZL_6AjyODUwXucfbw
Юсс! Мы сделали это ❤

5. Последний шаг…

Для Mac и Linux

Вы можете запланировать выполнение этого сценария каждый раз, когда кто-то запускает систему с помощью crontab. Cron – это планировщик задач на основе времени в операционных системах, подобных Unix. Вы можете прочитать больше о cron здесь.

Поэтому мы добавим нашу команду, с помощью которой мы запускаем скрипт (sudo node blocker.js) в таблице cron. Сделать это очень просто: откройте терминал с помощью ctrl+alt+tзатем откройте crontab с помощью sudo crontab -e. Эта команда откроет таблицу cron.

Примечание что мы использовали sudo crontabнет crontab. Это позволит нам изменить таблицу cron.

Открыв его, добавьте эту строчку в конце (замените path-to-script с путём в каталог вашего проекта):

@reboot node /path-to-script/blocker.js

Это! Это будет запускать ваш скрипт всякий раз, когда система перезагрузится.

Для Windows

Также можно запланировать запуск сценария при каждом запуске системы в Windows. Вот очень хорошая статья, рассказывающая, как это сделать.

Куда уходить?

Вы энтузиаст открытого кода? Хотите внести свой вклад в этот проект?
Я начинаю новый проект с открытым кодом под названием «Контролируй себя» которая будет являться настольной программой, созданной с помощью Electron. Функции будут включать:

  • получение информации от пользователей о том, когда они хотят заблокировать какие веб-сайты
  • отслеживание времени, которое пользователь проводит по просмотру веб-сайтов социальных сетей
  • таймер Pomodoro
  • и приложение со списком дел с ежедневным отчетом о производительности.

Просмотрите репозиторий и добавьте комментарий «заинтересованный» по вопросу, над которым вам интересно работать.

Теперь позвольте мне дать вам полный код с соответствующими комментариями, которые помогут вам понять код:

Полный код (blocker.js)

Это оно

Вы нашли статью полезной?

Подпишитесь на TheLeanProgrammer, чтобы первым получать уведомления о предстоящих обновлениях.

1*L-3kS5mz7jp4e8zV8WLoLQ

Не стесняйтесь обращаться ко мне в любое время, если хотите что-нибудь обсудить 😀

Буду рад, если вы вышлете свои отзывы или предложения или зададите вопросы. Более того, я люблю заводить новых друзей – поэтому просто напишите мне.

Спасибо, что дочитали до конца. Вы можете связаться со мной, если вам нужна помощь:
Электронная почта: madhavbahl10[at]Gmail[dot]com
Веб-сайт: http://madhavbahl.tech/
Github: https://github.com/MadhavBahlMD
LinkedIn: https://www.linkedin.com/in/madhavbaсм/

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *