Tampermonkey הוא תוסף לדפדפן עם מעל 10 מיליון משתמשים, שמאפשר להריץ סקריפטים על דפי אינטרנט.
סקריפטים אלו מאפשרים לשנות, להוסיף או לשפר את התפקוד של אתרי אינטרנט, כגון:
בשורה התחתונה, Tampermonkey מיועד למשתמשים שרוצים שליטה גמישה על האתרים שבהם הם גולשים.
איך Tampermonkey עובד?כתיבת סקריפטים: לאחר התקנת התוסף, אפשר להוסיף סקריפטים חדשים, לערוך אותם ולנהל אותם בלוח הבקרה.
פעולת הסקריפט: התוסף מזהה דפים רלוונטיים שבהם הסקריפט אמור לעבוד, ומריץ אותו כאשר נכנסים לדף.
זיהוי אתרים: לכל סקריפט ניתן להגדיר רשימה של אתרים או דפים שבהם הוא ירוץ.
תחילת השימוש ב-Tampermonkey ראשית, נתקין את התוסף לכרום או לפיירפוקסנלחץ לחיצה ימנית על האייקון של התוסף בשורת התוספים.
נלחץ על Create a new script:
3bd7da0d-9ce5-498c-8efd-0337bed4f7f0-image.png
ונעבור לדף כתיבת קוד של טמפרמונקי:
צילום מסך 2025-01-03 040859.png
בלוח הבקרה (Installed Userscripts) נראה את כל הסקריפטים שלנו, מה המצב של כל סקריפט, על איזה אתרים הוא פועל, וכו', ונוכל לשלוט עליהם:
0eb1c068-31d5-42b6-b66c-8eec0d34c2b6-image.png
בלשונית Utilities נוכל להתקין קובץ JS ישירות מהמחשב, או לייבא מURL של קובץ JS.
כתיבת סקריפטים ל-Tampermonkeyכל סקריפט ב-Tampermonkey מורכב משני חלקים עיקריים:
Metadata Block: [מקביל לmanifest.json בתוספים] חלק זה מכיל מידע חשוב על הסקריפט, כמו שם הסקריפט, באיזה אתרים הוא ירוץ, מה הוא עושה, ואילו הרשאות הוא דורש.
JavaScript Code: זה החלק שבו נכתוב את הקוד JS שאנחנו רוצים שירוץ על האתר .
למזלינו, Tampermonkey מביא לנו כבר קוד בסיסי מוכן, אז תתפנקו:
// ==UserScript== // @name New Userscript // @namespace http://tampermonkey.net/ // @version 2025-01-03 // @description try to take over the world! // @author You // @match https://*/* // @icon data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw== // @grant none // ==/UserScript== (function() { 'use strict'; // Your code here... })(); החלק הראשון: Metadata Blockזהו החלק שמתחיל ב ==UserScript== ומסתיים ב ==/UserScript==
הוא כתוב בסגנון הערות, אך הוא חשוב מאוד כדי שהתוסף ידע איך להתנהל עם הסקריפט.
הוא מכיל תגיות שמגדירות איך, איפה, ומה הסקריפט יעשה.
תגית שמסומנת ב (*) זה אומר שחייבים לכתוב אותה.
@name(*): שם הסקריפט שיוצג בלוח הבקרה.
לדוגמה: הסקריפט שלי
@namespace: אני לא יגע בזה עכשיו כי זה לא כ"כ חשוב,
תכתבו: /http://tampermonkey.net
@version: גרסת הסקריפט.
לדוגמה: 999.9
@description: תיאור הסקריפט.
לדוגמה: תנסו ותראו...
@author: השם של כותב הסקריפט.
לדוגמה: אני
@match(*): הכתובת שבה הסקריפט ירוץ.
בשביל להגדיר עוד כתובת שבה הסקריפט ירוץ, תוסיפו מתחת עוד תגית @match
ניתן להשתמש בכוכביות לתתי כתובות.
לדוגמה: /https://mitmachim.top יריץ את הסקריפט רק על דף הבית של "מתמחים טופ"
ו: */https://mitmachim.top יריץ את הסקריפט על כל הפורום.
אם אתם רוצים שהסקריפט ירוץ על כל הדפי אינטרנט, תכתבו:
@icon: כתובת של תמונה קטנה שתוצג בלוח הבקרה ליד שם הסקריפט.
@grant(*): הגדרת הרשאות שהסקריפט זקוק להן.
לדוגמה אם רוצים להזריק CSS לאתר: GM_addStyle
וכאשר לא נדרשות הרשאות מיוחדות: none
בשביל להגדיר עוד הרשאה, תוסיפו מתחת עוד תגית @grant
@require: לטעינת ספריות JavaScript חיצוניות.
@exclude: להחריג אתרים מסוימים מהרצת הסקריפט.
החלק השני: JavaScript Codeאחרי בלוק המטא, מתחיל החלק שבו נכתוב את הקוד עצמו.
ראשית נכתוב:
(function() { 'use strict'; })();ובשורה 3 נכתוב את הקוד שלנו,
מכיוון שאנחנו לא במדריך JS, אז אני יכתוב רק דוגמא קטנה:
// ==UserScript== // @name הצלחתם! // @match https://mitmachim.top/* // @grant none // ==/UserScript== (function() { 'use strict'; alert('הצלחתם!'); })();תשמרו את הקוד הזה ע"י לחיצה על ctrl+s, או file>save
תלכו לכל עמוד במתמחים טופ, תרעננו, ואם קופץ לכם חלון עם ההודעה "הצלחתם!" סימן שבאמת הצלחתם!
בהמשך אני מקווה להעלות כמה סקריפטים שימושיים.
בינתיים יש לכם את הסקריפט הזה שהביא @נ-נח האלוף כאן, שמאפשר לגלול את המסך בGPT עם החיצים במקלדת: