إنشاء تكوينات لـ nginx وتاريخ طلب سحب واحد

تحياتي لكم أيها الرفاق. جميلة على خوادمي القتالية NGINX تم تشغيله منذ عام 2006 وعلى مدار سنوات إدارته، تراكمت لدي الكثير من التكوينات والقوالب. لقد أثنت على nginx كثيرًا وبطريقة ما اتضح أنني بدأت تشغيل مركز nginx على المركز أيضًا، وأظهر m/
طلب مني الأصدقاء إنشاء مزرعة تطوير لهم، وبدلاً من سحب قوالبي المحددة إليهم، تذكرت مشروعًا مثيرًا للاهتمام nginxconfig.io، الذي ينثر التكوينات على الرفوف ويجهز كل شيء للسماح بالتشفير، وما إلى ذلك. فكرت، لماذا لا؟ ومع ذلك، فقد شعرت بالغضب من حقيقة أن nginxconfig عرض علي تنزيل أرشيف مضغوط في المتصفح، دون السماح لي بتحميله مباشرة إلى الخادم باستخدام wget/fetch/curl. يا له من هراء، لماذا أحتاجه في المتصفح، أحتاجه على الخادم من وحدة التحكم. غاضبًا، ذهبت إلى جيثب لرؤية جوهر المشروع، مما أدى إلى شوكته، ونتيجة لذلك، طلب سحب. وهو ما لن أكتب عنه لو لم يكن مثيرًا للاهتمام 😉

بالطبع، قبل البحث في المصادر، نظرت إلى المكان الذي يسحب فيه Chrome الأرشيف المضغوط الذي تم إنشاؤه باستخدام التكوينات، وكان هناك عنوان يبدأ بـ "blob:" في انتظاري، عفوًا. لقد أصبح من الواضح بالفعل أن الخدمة لا تولد أي شيء على طول الطريق، في الواقع، يتم كل ذلك بواسطة js. في الواقع، يتم إنشاء الأرشيف المضغوط بواسطة العميل والمتصفح وجافا سكريبت نفسها. أولئك. الجميل هو أن المشروع nginxconfig.io يمكن حفظها ببساطة كصفحة html، وتحميلها على البعض narod.ru وسيعمل) هذا حل مضحك ومثير للاهتمام للغاية، ومع ذلك، فهو غير مريح للغاية لإعداد الخوادم، في الواقع، بالضبط لما تم إنشاء هذا المشروع. قم بتنزيل الأرشيف الذي تم إنشاؤه باستخدام المتصفح، ثم قم بنقله إلى الخادم باستخدام nc... في عام 2019؟ لقد حددت لنفسي مهمة إيجاد طريقة لتنزيل التكوين الناتج مباشرة على الخادم.
بعد أن تخليت عن المشروع، بدأت أفكر في الخيارات المتاحة أمامي. كانت المهمة معقدة لأنني لم أرغب في الانحراف عن شرط أن يظل المشروع واجهة أمامية خالصة، دون أي نهاية خلفية. بالطبع، سيكون الحل الأبسط هو سحب العقدة وإجبارها على إنشاء أرشيف مع التكوينات باستخدام الروابط المباشرة.
في الواقع، لم يكن هناك الكثير من الخيارات. بتعبير أدق، واحد فقط يتبادر إلى الذهن. نحتاج إلى إعداد التكوينات والحصول على رابط يمكننا نسخه إلى وحدة تحكم الخادم للحصول على أرشيف مضغوط.
كان وزن العديد من الملفات النصية في الأرشيف المضغوط الناتج قليلًا جدًا، حرفيًا بضعة كيلو بايت. كان الحل الواضح هو الحصول على سلسلة base64 من الأرشيف المضغوط الذي تم إنشاؤه وإلقائها في المخزن المؤقت أثناء وجودك على الخادم باستخدام الأمر الموجود في وحدة التحكم

echo 'base64string' | base64 --decode > config.zip

يمكننا إنشاء نفس الملف المضغوط.

nginxconfig.io تمت كتابته في AngularJS، لا أستطيع حتى أن أتخيل عدد الكيلومترات من التعليمات البرمجية التي كانت ستكون مطلوبة إذا لم يقم المؤلف باختيار إطار عمل js التفاعلي. لكن يمكنني أن أتخيل تمامًا مدى بساطة وجمال كل هذا الذي يمكن تنفيذه في VueJS، على الرغم من أن هذا موضوع مختلف تمامًا.
في موارد المشروع نرى طريقة لإنشاء أرشيف مضغوط:

$scope.downloadZip = function() {
	var zip = new JSZip();

	var sourceCodes = $window.document.querySelectorAll('main .file .code.source');

	for (var i = 0; i < sourceCodes.length; i++) {
		var sourceCode = sourceCodes[i];

		var name	= sourceCode.dataset.filename;
		var content	= sourceCode.children[0].children[0].innerText;

		if (!$scope.isSymlink() && name.match(/^sites-available//)) {
			name = name.replace(/^sites-available//, 'sites-enabled/');
		}

		zip.file(name, content);

		if (name.match(/^sites-available//)) {
			zip.file(name.replace(/^sites-available//, 'sites-enabled/'), '../' + name, {
				unixPermissions: parseInt('120755', 8),
			});
		}
	}

	zip.generateAsync({
		type: 'blob',
		platform: 'UNIX',
	}).then(function(content) {
		saveAs(content, 'nginxconfig.io-' + $scope.getDomains().join(',') + '.zip');
	});

	gtag('event', $scope.getDomains().join(','), {
		event_category: 'download_zip',
	});
};

كل شيء بسيط للغاية، وذلك باستخدام المكتبة com.jszip يتم إنشاء ملف مضغوط حيث يتم وضع ملفات التكوين. بعد إنشاء أرشيف مضغوط، يقوم JS بتغذية المتصفح باستخدام المكتبة FileSaver.js:

saveAs(content, 'nginxconfig.io-' + $scope.getDomains().join(',') + '.zip');

حيث يكون المحتوى هو كائن blob الناتج في الأرشيف المضغوط.

حسنًا، كل ما كان علي فعله هو إضافة زر آخر بجواره وعندما قمت بالنقر عليه، لم أكن أحفظ أرشيف ZIP الناتج في المتصفح، ولكن أحصل على رمز Base64 منه. بعد العبث قليلاً، حصلت على طريقتين، بدلاً من تنزيل Zip واحد فقط:

$scope.downloadZip = function() {
	generateZip(function (content) {
		saveAs(content, 'nginxconfig.io-' + $scope.getDomains().join(',') + '.zip');
	});

	gtag('event', $scope.getDomains().join(','), {
		event_category: 'download_zip',
	});
};
$scope.downloadBase64 = function() {
	generateZip(function (content) {
		var reader = new FileReader();
		reader.readAsDataURL(content);
		reader.onloadend = function() {
			var base64 = reader.result.replace(/^data:.+;base64,/, '');
			// в переменной base64 как раз нужный мне zip архив в виде base64 строки
		}
	});

	gtag('event', $scope.getDomains().join(','), {
		event_category: 'download_base64',
	});
};

كما لاحظت، قمت بنقل إنشاء أرشيف Zip نفسه إلى طريقة generatorZip الخاصة، وهكذا. هذا هو AngularJS، والمؤلف نفسه يلتزم بعمليات الاسترجاعات ولم ينفذها من خلال الوعود. لا يزال downloadZip يستخدم saveAs كمخرج، بينما يفعل downloadBase64 شيئًا مختلفًا بعض الشيء. نقوم بإنشاء كائن FileReader الذي جاء إلينا بتنسيق html5 وهو موجود بالفعل متاح للاستخدام. والتي، في وقت ما، يمكن أن تصنع سلسلة Base64 من النقطة، أو بالأحرى، تصنع سلسلة DataURL، لكن هذا ليس مهمًا جدًا بالنسبة لنا، لأنه يحتوي DataURL على ما نحتاجه بالضبط. بينغو، كانت هناك عقبة صغيرة تنتظرني عندما حاولت وضع كل هذا في المخزن المؤقت. استخدم المؤلف المكتبة في المشروع clipboardjs، والذي يسمح لك بالعمل مع الحافظة بدون كائنات الفلاش، بناءً على النص المحدد. في البداية، قررت أن أضع Base64 الخاص بي في عنصر مع العرض: لا شيء؛ ولكن في هذه الحالة لم أتمكن من وضعه في الحافظة لأنه لا يحدث أي انفصال. ولذلك، بدلا من العرض: لا شيء؛ فعلتُ

position: absolute;
z-index: -1;
opacity: 0;

مما سمح لي بإخفاء العنصر من العرض وتركه فعليًا على الصفحة. لقد اكتملت المهمة، وعندما نقرت على الزر الخاص بي، تم وضع سطر مثل هذا في المخزن المؤقت:

echo 'base64string' | base64 --decode > config.zip

والذي قمت بلصقه ببساطة في وحدة التحكم على الخادم وتلقيت على الفور أرشيفًا مضغوطًا يحتوي على جميع التكوينات.
وبطبيعة الحال، أرسلت طلب سحب إلى المؤلف، لأن... المشروع نشط وحيوي، أود أن أرى تحديثات من المؤلف وأن يكون لدي زر خاص بي) للمهتمين، ها هو شوكة بلدي المشروع ونفسه طلب سحب، حيث يمكنك رؤية ما قمت بتصحيحه/إضافته.
تطور سعيد للجميع)

المصدر: www.habr.com