🥇nginx uchun konfiguratsiyalarni yaratish, bitta tortishish soʻrovi tarixi

Assalomu alaykum, o'rtoqlar. Mening jangovar serverlarimda chiroyli nginx 2006 yildan beri ishlamoqda va uning boshqaruvi yillari davomida men juda ko'p konfiguratsiyalar va shablonlarni to'pladim. Men nginxni juda maqtadim va qandaydir ma'lum bo'ldiki, men hatto hubda nginx markazini ham ishga tushirdim, m/
Do'stlar mendan ular uchun rivojlanish fermasini tashkil etishimni so'rashdi va ularga o'zimning maxsus shablonlarimni sudrab borish o'rniga, men qiziqarli loyihani esladim. nginxconfig.io, bu javonlarda konfiguratsiyalarni tarqatadi va hamma narsani shifrlash imkonini beradi va hokazo uchun tayyorlaydi. Men o'yladim, nega emas? Biroq, nginxconfig menga zip arxivini wget/fetch/curl yordamida to'g'ridan-to'g'ri serverga yuklashimga ruxsat bermasdan brauzerga yuklab olishni taklif qilgani meni g'azablantirdi. Qanday bema'nilik, nima uchun brauzerda menga kerak, konsoldan serverda kerak. G'azablanib, men github-ga loyihaning mohiyatini ko'rish uchun bordim, bu uning vilkasini va natijada tortishish so'roviga olib keldi. Agar qiziq bo'lmaganida yozmagan bo'lardim 😉

Albatta, manbalarni o'rganishdan oldin, men Chrome yaratilgan zip arxivini konfiguratsiyalar bilan qayerga tortayotganini ko'rib chiqdim va u erda "blob:" bilan boshlanadigan manzil meni kutayotgan edi. Xizmat yo'lda hech narsa yaratmasligi allaqachon ma'lum bo'ldi, aslida hammasi JS tomonidan amalga oshiriladi. Haqiqatan ham, zip arxivi mijoz, brauzer va javascriptning o'zi tomonidan yaratilgan. Bular. loyihaning go'zalligi shundaki nginxconfig.io oddiygina html sahifa sifatida saqlanishi mumkin, ba'zilariga yuklanadi narod.ru va u ishlaydi) Bu juda kulgili va qiziqarli yechim, ammo serverlarni o'rnatish uchun juda noqulay, aslida ushbu loyiha nima uchun yaratilgan. Yaratilgan arxivni brauzer orqali yuklab oling va keyin 2019 yilda nc... yordamida serverga o'tkazasizmi? Olingan konfiguratsiyani to'g'ridan-to'g'ri serverga yuklab olish yo'lini topish vazifasini oldimga qo'ydim.
Loyihani bekor qilgandan so'ng, men qanday variantlar borligi haqida o'ylay boshladim. Vazifa murakkablashdi, chunki men loyiha hech qanday orqa tomonsiz, sof front-end bo'lib qolishi shartidan chetga chiqishni xohlamadim. Albatta, eng oddiy yechim nodej-larni tortib olish va uni to'g'ridan-to'g'ri havolalar yordamida konfiguratsiyalar bilan arxiv yaratishga majbur qilishdir.
Aslida, ko'p variantlar yo'q edi. Aniqrog'i, faqat bittasi esga tushdi. Biz konfiguratsiyalarni o'rnatishimiz va zip arxivini olish uchun server konsoliga nusxalashimiz mumkin bo'lgan havolani olishimiz kerak.
Natijada paydo bo'lgan zip arxividagi bir nechta matnli fayllar biroz og'irlikda, tom ma'noda bir necha kilobayt edi. Aniq yechim yaratilgan zip arxividan base64 satrini olish va konsoldagi buyruq bilan serverda bo'lganda uni buferga tashlash edi.

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

biz xuddi shu zip faylni yaratishimiz mumkin.

nginxconfig.io AngularJS da yozilgan, agar muallif reaktiv JS ramkasini tanlamaganida qancha kilometr kod talab qilinishini tasavvur ham qila olmayman. Ammo bularning barchasini VueJS-da qanchalik sodda va chiroyliroq amalga oshirish mumkinligini juda yaxshi tasavvur qila olaman, garchi bu butunlay boshqa mavzu.
Loyiha resurslarida biz zip arxivini yaratish usulini ko'ramiz:

$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',
	});
};

hamma narsa juda oddiy, kutubxona yordamida jszip Konfiguratsiya fayllari joylashtirilgan joyda zip yaratiladi. Zip arxivini yaratgandan so'ng, JS kutubxonadan foydalangan holda uni brauzerga yuboradi FileSaver.js:

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

bu erda kontent zip arxivining hosil bo'lgan blob ob'ektidir.

OK, men qilishim kerak bo'lgan narsa uning yoniga boshqa tugmani qo'shish edi va men uni bosganimda, natijada olingan zip arxivini brauzerga saqlamayman, lekin undan base64 kodini olaman. Biroz ovora bo'lganimdan so'ng, men bitta downloadZip o'rniga ikkita usulni oldim:

$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',
	});
};

E'tibor bergan bo'lsangiz kerak, men zip arxivining avlodini xususiy GenereZip usuliga o'tkazdim va hokazo. Bu AngularJS va muallifning o'zi qayta qo'ng'iroqlarga sodiq qoladi va uni va'dalar orqali amalga oshirmagan. downloadZip hali ham saveA ni chiqish sifatida bajardi, downloadBase64 esa biroz boshqacha ish qildi. Biz html5 da bizga kelgan va allaqachon to'liq bo'lgan FileReader ob'ektini yaratamiz kirish mumkin foydalanish uchun. Bu bir vaqtning o'zida blobdan base64 satrini yaratishi mumkin, to'g'rirog'i, DataURL qatorini yaratadi, ammo bu biz uchun unchalik muhim emas, chunki DataURL bizga kerakli narsalarni o'z ichiga oladi. Bingo, bularning barchasini buferga qo'yishga harakat qilganimda, meni bir oz snag kutdi. Muallif loyihada kutubxonadan foydalangan clipboardjs, bu sizga tanlangan matn asosida flesh-ob'ektlarsiz almashish buferi bilan ishlash imkonini beradi. Dastlab, men base64-ni displey:none; bo'lgan elementga qo'yishga qaror qildim, lekin bu holda men uni vaqtinchalik xotiraga joylashtira olmadim, chunki ajralish sodir bo'lmaydi. Shuning uchun, o'rniga display:none; Men qildim

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

Bu menga elementni ko'zdan yashirish va uni sahifada qoldirish imkonini berdi. Voila, vazifa bajarildi, men tugmani bosganimda, buferga shunday qator qo'yildi:

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

Men shunchaki serverdagi konsolga joylashtirdim va darhol barcha konfiguratsiyalar bilan zip arxivini oldim.
Va, albatta, men muallifga tortishish so'rovini yubordim, chunki ... loyiha faol va jonli, men muallifdan yangilanishlarni ko'rishni va o'zimning tugmachamga ega bo'lishni xohlayman) Qiziqqanlar uchun bu erda mening vilkalarim loyiha va men pull talab, siz men tuzatgan/qo'shgan narsalarni ko'rishingiz mumkin.
Hammaga omadli rivojlanish)

Manba: www.habr.com

Nginx uchun konfiguratsiyalarni yaratish, bitta tortish so'rovi tarixi

a Izoh qo'shish Bu savolga javob bekor