Google chrome extensions are a bundle of multiple JavaScript, HTML, and CSS files,
much like a web app but inside your browser and interacting with the pages or
providing functionalities to enhance your browsing experience.
‫ تشبه‬،‫ المتعددة‬CSS‫ و‬HTML‫ و‬JavaScript ‫ عبارة عن حزمة من ملفات‬Google chrome ‫ملحقات‬
‫إلى حد كبير تطبيق الويب ولكن داخل متصفحك وتتفاعل مع الصفحات أو توفر وظائف لتحسين تجربة‬
.‫التصفح لديك‬
In this post, I'll be talking about an extension called Raindrop, which is one of those
neat Bookmark managers for Google chrome, and believe me, it works really well in
increasing productivity and keeping a track of things in an organized way. I'll be
explaining how I exploited Raindrop's Google Chrome extension to use their premium
services for free.
‫ وهو أحد أدوات إدارة الإشارات المرجعية‬،Raindrop ‫ سأتحدث عن ملحق يسمى‬،‫في هذا المنشور‬
‫ إنه يعمل بشكل جيد حًق ا في زيادة الإنتاجية وتتبع الأشياء‬،‫ وصدقني‬،Google chrome ‫الأنيقة لمتصفح‬
‫ لاستخدام‬Raindrop ‫ الخاص بشركة‬Google Chrome ‫ سأشرح كيف استغلت ملحق‬.‫بطريقة منظمة‬
.‫خدماتها المتميزة مجاًنا‬
Background‫خلفية‬
Raindrop is one of the most famous Bookmark manager apps that's being used by
more than 100,000+ users according to its Chrome Extension page here 100000 ‫ واحًد ا من أشهر تطبيقات إدارة الإشارات المرجعية التي يستخدمها أكثر من‬Raindrop ‫يعد‬
- ‫ الخاصة به هنا‬Chrome ‫مستخدم وفًق ا لصفحة ملحق‬
It also has one of the nicest web interfaces at https://app.raindrop.io/. On top of all
that, it's completely open sourced at https://github.com/raindropio which attracted
me towards using it.
،‫ علاوة على كل ذلك‬. /https://app.raindrop.io ‫كما أن لديها واحدة من أجمل واجهات الويب على‬
.‫ مما جذبني لاستخدامه‬https://github.com/raindropio ‫فهو مفتوح المصدر بالكامل على‬
So how this extension works is you add it to your Google chrome, and then bookmark
any of your pages using this extension. This will be saved in your browser's extension
as well as on Raindrop's Web app because the same API is being used to interact with
the application.
‫ ثم وضع إشارة‬،‫ الخاص بك‬Google chrome ‫لذا فإن كيفية عمل هذا الامتداد هي إضافته إلى متصفح‬
‫ سيتم حفظ هذا في ملحق متصفحك وكذلك في‬.‫مرجعية على أي من صفحاتك باستخدام هذا الامتداد‬
‫ لأنه يتم استخدام نفس واجهة برمجة التطبيقات للتفاعل مع‬Raindrop ‫تطبيق الويب الخاص بـ‬
.‫التطبيق‬
Raindrop features two plans, one is free and the other one is paid. The paid plan
comes with some extra features which you can find on their website. One of the most
useful features in their paid plan is creating nested collections for bookmarks. This is
what I'll be bypassing today.
‫ تأتي الخطة المدفوعة مع بعض الميزات‬.‫ واحدة مجانية والأخرى مدفوعة‬،‫ بخطتين‬Raindrop ‫تتميز‬
‫ إحدى الميزات الأكثر فائدة في خطتهم‬.‫الإضافية التي يمكنك العثور عليها على موقعهم على الإنترنت‬
.‫ وهذا ما سأتجاوزه اليوم‬.‫المدفوعة هي إنشاء مجموعات متداخلة للإشارات المرجعية‬
Finding a needle in the Haystack
‫العثور عىل إبرة في كومة القش‬
First of all, this is an unlisted Extension and it can't be searched in Google Chrome
extensions anymore. You can still find its other extension in the Chrome store which is
not vulnerable. Let me rephrase that to obfuscated.
‫ لا يزال بإمكانك‬.‫ بعد الآن‬Google Chrome ‫ هذا ملحق غير مدرج ولا يمكن البحث عنه في ملحقات‬،‫أولًا‬
‫ اسمحوا لي أن أعيد صياغة ذلك‬. ‫ وهو غير معرض للخطر‬Chrome ‫العثور على امتداده الآخر في متجر‬
.‫إلى غامض‬
I'll start with installing the extension normally from the Chrome store.
.Chrome ‫سأبدأ بتثبيت الامتداد بشكل طبيعي من متجر‬
When this extension is installed for the first time, a screen like this will be shown in a
new tab after signing up and logging in
‫ ستظهر شاشة كهذه في علامة تبويب جديدة بعد الاشتراك وتسجيل‬،‫عند تثبيت هذا الامتداد لأول مرة‬
‫الدخول‬
And when we try to create a Nested Collection from the sidebar, in the free account,
an error like this will be shown which I'll be bypassing soon.
‫وعندما نحاول إنشاء مجموعة متداخلة من الشريط الجانبي‪ ،‬في الحساب المجاني‪ ،‬سيظهر خطأ مثل هذا‬
‫والذي سأتجاوزه قريًبا‪.‬‬
‫‪I already checked my Burp to see if Pro validations are being done on any API‬‬
‫‪endpoint but couldn't find any which probably means that it's happening somewhere‬‬
‫‪in the source code on the client-side.‬‬
‫لقد قمت بالفعل بفحص ‪ Burp‬الخاص بي لمعرفة ما إذا كانت عمليات التحقق من صحة ‪ Pro‬يتم‬
‫إجراؤها على أي نقطة نهاية لواجهة برمجة التطبيقات ولكن لم أتمكن من العثور على أي منها مما يعني‬
‫على الأرجح أنه يحدث في مكان ما في الكود المصدري من جانب العميل‪.‬‬
‫‪Let's fire up the Chrome debugger to look deeper into the source to see where the‬‬
‫‪actual validation is happening.‬‬
‫فلنقم بتشغيل مصحح أخطاء ‪ Chrome‬للبحث بشكل أعمق في المصدر لمعرفة مكان حدوث التحقق‬
‫الفعلي‪.‬‬
‫‪Going to the Sources tab, I can see a partial directory structure of the extension.‬‬
‫‪From the looks of it, it seems the application logic is inside app.js .‬‬
‫بالانتقال إلى علامة التبويب "المصادر"‪ ،‬يمكنني رؤية بنية دليل جزئية للامتداد‪ .‬من مظهره‪ ،‬يبدو أن‬
‫منطق التطبيق موجود داخل ‪. app.js‬‬
Now since I'm looking for the function which validates if a user is Pro or Free, I'll be
searching for the word Pro inside the JS file. This gave around 932 matches which
was too much to manually go through so I turned on "Match Case" which reduced the
potential matches to 233 and also gave me what I was looking for. The name of the
function which looks like it is the one validating if a user is Pro.
‫ فسوف أبحث عن‬،‫الآن بما أنني أبحث عن الوظيفة التي تتحقق مما إذا كان المستخدم محترًف ا أم مجانًيا‬
932 ‫ أعطى هذا حوالي‬.JS ‫ داخل ملف‬Pro ‫كلمة‬
233 ‫ لذلك قمت بتشغيل "حالة المطابقة" مما أدى إلى تقليل التطابقات المحتملة إلى‬،‫معالجته يدو ًيا‬
‫ اسم الوظيفة التي تبدو وكأنها هي التي تتحقق مما إذا كان‬.‫وأعطاني أيًضا ما كنت أبحث عنه‬
.‫المستخدم محترًف ا‬
‫ وهو ما كان كثيًرا جًد ا بحيث لا يمكن‬،‫مطابقة‬
So the name of the function is isPro() . Now onto the function definition which quickly
brought me to this little part where the function is defined.
‫ الآن ننتقل إلى تعريف الوظيفة الذي أوصلني سريًع ا إلى هذا الجزء‬. )(isPro ‫إذن اسم الدالة هو‬
.‫الصغير حيث يتم تعريف الوظيفة‬
From the definition, it is obvious that the function is checking if the user is logged in
and if the user is a pro user, this will return true, otherwise false. Now, all we need to
do to bypass the Pro validation is to make this function return true. Let's verify this by
using Chrome's Debugger.
‫من التعريف‪ ،‬من الواضح أن الوظيفة تتحقق مما إذا كان المستخدم قد قام بتسجيل الدخول وإذا كان‬
‫‪.‬‬
‫المستخدم مستخدًم ا محترًف ا‪ ،‬فسيعود هذا صحيًح ا‪ ،‬وإلا فسيكون خطأ الآن‪ ،‬كل ما يتعين علينا القيام به‬
‫‪.‬‬
‫لتجاوز التحقق من صحة ‪Pro‬‬
‫مصحح الأخطاء في ‪.Chrome‬‬
‫‪I'll set a break-point on the function and invoke a Pro feature (Nested collection) to‬‬
‫‪see if the application flow stops on my break-point. To create a break-point, just click‬‬
‫‪on the line number in the JS file and it'll be shown on the right side as shown below.‬‬
‫سأقوم بتعيين نقطة توقف على الوظيفة واستدعاء ميزة ‪( Pro‬مجموعة متداخلة) لمعرفة ما إذا كان‬
‫تدفق التطبيق سيتوقف عند نقطة التوقف الخاصة بي‪ .‬لإنشاء نقطة فاصلة‪ ،‬ما عليك سوى النقر على‬
‫رقم السطر في ملف ‪ JS‬وسيظهر على الجانب الأيمن كما هو موضح أدناه‪.‬‬
‫هو جعل هذه الوظيفة تعود صحيحة دعونا نتحقق من ذلك باستخدام‬
‫‪Now I'll invoke the Pro feature from the sidebar. It can be seen from the below‬‬
‫‪screenshot that the execution halted on this exact function.‬‬
‫سأقوم الآن باستدعاء ميزة ‪Pro‬‬
‫‪.‬‬
‫من الشريط الجانبي يمكن أن نرى من لقطة الشاشة أدناه أن التنفيذ‬
‫توقف على هذه الوظيفة بالضبط‪.‬‬
‫‪I'll step into the next function call to see the return value and it can be seen in the‬‬
‫‪Scope section that false was returned since I'm not a pro user.‬‬
‫سأنتقل إلى استدعاء الوظيفة التالي لرؤية القيمة المرجعة ويمكن أن نرى في قسم النطاق أنه تم إرجاع‬
‫خطأ لأنني لست مستخدًما محترًف ا‪.‬‬
This confirms that it is the same function that's validating if a user is on a Pro or a
Free plan.
‫ أو‬Pro ‫وهذا يؤكد أنها نفس الوظيفة التي يتم التحقق من صحة ما إذا كان المستخدم مشترًكا في خطة‬
.‫خطة مجانية‬
Now onto the next part.
.‫الآن إلى الجزء التالي‬
Taking things apart‫تفكيك األشياء‬
Here I'll modify the extension, bypass Chrome's Extension Content verification and
Load our Unpacked extension back into the browser.
‫ وتحميل الامتداد الذي تم فك‬Chrome ‫سأقوم هنا بتعديل الامتداد وتجاوز التحقق من محتوى ملحق‬
.‫حزمته مرة أخرى في المتصفح‬
On Linux, the path where Chrome extensions are stored is usually in
‫ موجوًدا عادًة‬Chrome ‫ يكون المسار الذي يتم فيه تخزين ملحقات‬،Linux ‫في نظام التشغيل‬
/home/<user>/.config/google-chrome/Default/Extensions/<extension_id>
The extension ID can be obtained from the Extensions page in Chrome
Chrome ‫يمكن الحصول على معرف الامتداد من صفحة الامتدادات في‬
chrome://extensions/
I'll copy that folder from the path to any other location and will be making changes in
this one. Now Google Chrome does not allow modified extensions to be directly
installed and will give an error saying that This extension may have been corrupted .
‫ الآن لا يسمح‬.‫سأقوم بنسخ هذا المجلد من المسار إلى أي موقع آخر وسأجري تغييرات في هذا الموقع‬
This extension may ‫ بتثبيت الإضافات المعدلة مباشرة وسيعطي خطًأ يفيد بذلك‬Google Chrome
. have been corrupted
To do this I need to modify some of the files inside the source. Here's what's needed
to be done.
.‫ إليك ما يجب القيام به‬.‫للقيام بذلك أحتاج إلى تعديل بعض الملفات داخل المصدر‬
Disable or delete the original extension in Chrome.
.Chrome ‫قم بتعطيل أو حذف الامتداد الأصلي في‬
Delete _metadata .
. metadata_ ‫حذف‬
Edit manifest.json and remove key and _ update_url _ sections.
.‫ _ الأقسام‬update_url _ ‫ و‬key ‫ وإزالة‬manifest.json ‫يحرر‬
Change the name and the _ short_name _ fields to something else which will be
easily identifiable in Chrome so as to not get confused with the disabled original
extension if it's not already deleted.
Chrome ‫ _ إلى شيء آخر يمكن التعرف عليه بسهولة في‬short_name _ ‫ وحقول‬name ‫قم بتغيير‬
.‫حتى لا يتم الخلط بينه وبين الامتداد الأصلي المعطل إذا لم يتم حذفه بالفعل‬
Now I just have to find the isPro() function inside app.js and make it always return
true as shown below.
‫ وجعلها صحيحة دائًم ا كما هو‬app.js ‫() داخل‬isPro ‫الآن كل ما علي فعله هو العثور على الدالة‬
.‫موضح أدناه‬
To proceed further, I need to save all my changes including the ones in the manifest
file and the app.js file.
‫ أحتاج إلى حفظ جميع التغييرات بما في ذلك التغييرات الموجودة في ملف البيان وملف‬،‫للمضي قدًم ا‬
.app.js
Heading over to chrome://extensions/ I enabled Developer mode and loaded the
unpacked extension folder from the top-left option.
‫ قمت بتمكين وضع المطور وقمت بتحميل مجلد الامتداد الذي تم‬/chrome://extensions ‫بالتوجه إلى‬
.‫فك حزمته من الخيار العلوي الأيسر‬
Now when I create a Nested collection it'll happily allow me to do so since the
validation function will always return true. This also bypasses other Pro features for
the extension and the application.
‫ فسوف يسمح لي بذلك بكل سرور لأن وظيفة التحقق من‬،‫الآن عندما أقوم بإنشاء مجموعة متداخلة‬
.‫ الأخرى للامتداد والتطبيق‬Pro ‫ يتجاوز هذا أيًضا ميزات‬.‫الصحة ستعود دائًما صحيحة‬
These changes will also be synced with the server which I think is another bug that
automatically creates Pro resources due to a missing server-side validation on the
endpoint.
Pro ‫ستتم أيًضا مزامنة هذه التغييرات مع الخادم والذي أعتقد أنه خطأ آخر يقوم تلقائًيا بإنشاء موارد‬
.‫بسبب فقدان التحقق من جانب الخادم على نقطة النهاية‬