Генерисање конфигурација за нгинк, историја једног захтева за повлачење

Поздрав, другови. Прелепо на мојим борбеним серверима Апацхе ради од 2006. године и током година његове администрације накупио сам доста конфигурација и шаблона. Пуно сам хвалио нгинк и некако се испоставило да сам чак и покренуо нгинк хуб на чворишту, похвали се м/
Пријатељи су ме замолили да им поставим развојну фарму и уместо да им вучем своје специфичне шаблоне, сетио сам се занимљивог пројекта нгинкцонфиг.ио, који разбацује конфигурације по полицама и припрема све за летс енцрипт итд. Помислио сам, зашто не? Међутим, разбеснела ме је чињеница да ми нгинкцонфиг нуди да преузмем зип архиву у претраживач, а да ми не дозвољава да је отпремим директно на сервер користећи вгет/фетцх/цурл. Какве глупости, зашто ми то треба у претраживачу, треба ми на серверу са конзоле. Љут, отишао сам на гитхуб да видим срж пројекта, што је довело до његовог рачвања и, као резултат, захтева за повлачењем. О чему не бих писао да није занимљиво 😉

Наравно, пре него што сам копао по изворима, погледао сам где Цхроме повлачи генерисану зип архиву са конфигурацијама, а тамо ме је чекала адреса која почиње са „блоб:“, упс. Већ је постало јасно да услуга успут ништа не генерише, у ствари, све то ради јс. Заиста, зип архиву генерише сам клијент, претраживач и јавасцрипт. Оне. лепота је у томе што пројекат нгинкцонфиг.ио може се једноставно сачувати као хтмл страница, поставити на неке народ.ру и то ће радити) Ово је веома смешно и занимљиво решење, међутим, ужасно је незгодно за подешавање сервера, у ствари, управо за оно што је овај пројекат створен. Преузмите генерисану архиву помоћу претраживача, а затим је пренесите на сервер користећи нц... 2019.? Поставио сам себи задатак да пронађем начин да преузмем резултујућу конфигурацију директно на сервер.
Након што сам одвојио пројекат, почео сам да размишљам о томе које су моје опције. Задатак је био компликован чињеницом да нисам желео да одступим од услова да пројекат остане чист фронт-енд, без икаквог бацк-енда. Наравно, најједноставније решење би било да подигнете нодејс и натерате га да генерише архиву са конфигурацијама користећи директне везе.
У ствари, није било много опција. Тачније, само један ми је пао на памет. Морамо да подесимо конфигурације и добијемо везу коју можемо да копирамо на конзолу сервера да бисмо добили зип архиву.
Неколико текстуалних датотека у резултујућој зип архиви тежило је прилично, буквално неколико килобајта. Очигледно решење је било да добијете басе64 стринг из генерисане зип архиве и баците га у бафер, док сте на серверу са командом у конзоли

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

могли бисмо да направимо ову исту зип датотеку.

нгинкцонфиг.ио је написан у АнгуларЈС-у, не могу ни да замислим који би километри кода били потребни да аутор није изабрао реактивни јс фрамеворк. Али могу савршено да замислим колико би све ово једноставније и лепше могло да се имплементира у ВуеЈС, иако је ово сасвим друга тема.
У ресурсима пројекта видимо метод за генерисање зип архиве:

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

све је прилично једноставно, користећи библиотеку јсзип Зип се креира где су смештене конфигурационе датотеке. Након креирања зип архиве, јс је шаље у претраживач користећи библиотеку ФилеСавер.јс:

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

где је садржај резултујући блоб објекат зип архиве.

Ок, све што је требало да урадим је да додам још једно дугме поред њега и када бих кликнуо на њега, не бих сачувао резултујућу зип архиву у претраживачу, већ бих преузео басе64 код из ње. Након што сам се мало петљао, добио сам 2 методе, уместо само једног довнлоадЗип-а:

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

Као што сте можда приметили, преместио сам генерисање саме зип архиве у приватни генезип метод и тако даље. Ово је АнгуларЈС, а сам аутор се држи повратних позива и није га имплементирао кроз обећања. довнлоадЗип је и даље сачувао као излаз, док је довнлоадБасе64 урадио нешто мало другачије. Креирамо ФилеРеадер објекат који нам је дошао у хтмл5 и већ је прилично доступан за употребу. Који у једном тренутку може да направи басе64 стринг од блоб-а, тачније да направи стринг ДатаУРЛ, али то за нас није толико важно, јер ДатаУРЛ садржи управо оно што нам треба. Бинго, сачекала ме је мала замка када сам покушао све ово да ставим у тампон. Аутор је у пројекту користио библиотеку цлипбоардјс, који вам омогућава да радите са међуспремником без флеш објеката, на основу изабраног текста. У почетку сам одлучио да свој басе64 ставим у елемент са дисплаи:ноне;, али у овом случају нисам могао да га ставим у међуспремник јер не долази до раздвајања. Стога, уместо дисплаи:ноне; урадио сам

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

што ми је омогућило да сакријем елемент од погледа и да га заправо оставим на страници. Воила, задатак је завршен, када сам кликнуо на своје дугме, у бафер је постављена оваква линија:

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

коју сам једноставно залепио у конзолу на серверу и одмах добио зип архиву са свим конфигурацијама.
И, наравно, послао сам захтев за повлачење аутору, јер... пројекат је активан и живахан, волео бих да видим ажурирања од аутора и да имам своје дугме) За заинтересоване, ево га моја виљушка пројекат и себе повуци захтев, где можете видети шта сам исправио/додао.
Срећан развој свима)

Извор: ввв.хабр.цом