Nginx için yapılandırmaların oluşturulması, bir çekme isteğinin geçmişi

Selamlar yoldaşlar. Savaş sunucularımda çok güzel nginx 2006'dan beri çalışıyor ve yönetim yılları boyunca çok sayıda yapılandırma ve şablon biriktirdim. Nginx'i çok övdüm ve bir şekilde ortaya çıktı ki hub'da bir nginx hub'ı da başlatmıştım, gösteriş yapıyorum m/
Arkadaşlarım benden kendileri için bir geliştirme çiftliği kurmamı istediler ve onlara özel şablonlarımı sürüklemek yerine ilginç bir proje aklıma geldi. nginxconfig.ioyapılandırmaları raflara dağıtan ve şifrelemeye izin verme vb. için her şeyi hazırlayan. Neden olmasın diye düşündüm. Ancak, nginxconfig'in bana zip arşivini wget/fetch/curl kullanarak doğrudan sunucuya yüklememe izin vermeden tarayıcıya indirmemi teklif etmesi beni çileden çıkardı. Ne saçmalık, neden tarayıcıda buna ihtiyacım var, konsoldan sunucuda ihtiyacım var. Öfkeli bir şekilde, projenin çatallanmasına ve sonuç olarak bir çekme talebine yol açan projenin cesaretini görmek için github'a gittim. İlginç olmasaydı hakkında yazmazdım 😉

Tabii kaynaklara dalmadan önce Chrome'un oluşturulan zip arşivini yapılandırmalarla nereye çektiğine baktım ve orada "blob:" ile başlayan bir adres beni bekliyordu, ayy. Hizmetin yol boyunca hiçbir şey üretmediği zaten belli oldu, aslında hepsi js tarafından yapılıyor. Aslında zip arşivi istemci, tarayıcı ve javascript'in kendisi tarafından oluşturulur. Onlar. işin güzelliği şu ki proje nginxconfig.io basitçe bir html sayfası olarak kaydedilebilir ve bazı sitelere yüklenebilir. narod.ru ve işe yarayacak) Bu çok komik ve ilginç bir çözüm, ancak sunucuları kurmak, aslında tam olarak bu projenin yaratıldığı şey için son derece sakıncalı. Oluşturulan arşivi bir tarayıcıyla indirin ve ardından nc kullanarak sunucuya aktarın... 2019'da mı? Ortaya çıkan yapılandırmayı doğrudan sunucuya indirmenin bir yolunu bulma görevini kendime koydum.
Projeyi çatalladıktan sonra seçeneklerimin neler olduğunu düşünmeye başladım. Projenin herhangi bir arka uç olmadan saf bir ön uç olarak kalması koşulundan sapmak istemediğim gerçeği nedeniyle görev karmaşıktı. Elbette en basit çözüm, nodejs'i yukarı çekmek ve doğrudan bağlantıları kullanarak yapılandırmaları içeren bir arşiv oluşturmaya zorlamak olacaktır.
Aslında çok fazla seçenek yoktu. Daha doğrusu aklıma sadece biri geldi. Zip arşivi almak için yapılandırmaları kurmamız ve sunucu konsoluna kopyalayabileceğimiz bir bağlantı almamız gerekiyor.
Ortaya çıkan zip arşivindeki birkaç metin dosyası oldukça ağırdı, kelimenin tam anlamıyla birkaç kilobayt. Açık çözüm, base64 dizesini oluşturulan zip arşivinden almak ve sunucudayken konsoldaki komutla arabelleğe atmaktı.

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

aynı zip dosyasını oluşturabiliriz.

nginxconfig.io AngularJS'de yazılmıştı, eğer yazar reaktif bir js çerçevesi seçmemiş olsaydı, kaç kilometrelik kodun gerekli olacağını hayal bile edemiyorum. Ancak bu tamamen farklı bir konu olmasına rağmen, tüm bunların VueJS'de ne kadar daha basit ve daha güzel uygulanabileceğini mükemmel bir şekilde hayal edebiliyorum.
Proje kaynaklarında zip arşivi oluşturmaya yönelik bir yöntem görüyoruz:

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

kütüphaneyi kullanarak her şey oldukça basit jszip Yapılandırma dosyalarının yerleştirildiği yerde bir zip oluşturulur. Zip arşivini oluşturduktan sonra js, kütüphaneyi kullanarak onu tarayıcıya besler. Dosya Koruyucu.js:

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

burada içerik, zip arşivinin sonuçta ortaya çıkan blob nesnesidir.

Tamam, tek yapmam gereken yanına bir buton eklemekti ve tıkladığımda ortaya çıkan zip arşivini tarayıcıya kaydetmeyecek, base64 kodunu ondan alacaktım. Biraz uğraştıktan sonra tek bir downloadZip yerine 2 yöntem buldum:

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

Fark etmiş olabileceğiniz gibi, zip arşivinin oluşturulmasını özel createdZip yöntemine vb. taşıdım. Bu AngularJS ve yazarın kendisi de geri aramalara sadık kalıyor ve bunu vaatlerle uygulamadı. downloadZip çıktı olarak saveAs'ı kullanmaya devam ederken downloadBase64 biraz farklı bir şey yaptı. Bize html5'te gelen ve zaten oldukça iyi olan bir FileReader nesnesi yaratıyoruz. mevcut kullanmak için. Bu, aynı anda bir blob'dan base64 dizesi oluşturabilir, daha doğrusu bir DataURL dizesi oluşturabilir, ancak bu bizim için o kadar önemli değil çünkü DataURL tam olarak ihtiyacımız olanı içeriyor. Bingo, tüm bunları ara belleğe almaya çalıştığımda küçük bir engel beni bekliyordu. Yazar projede kütüphaneyi kullandı panojsseçilen metne göre panoyla flash nesneleri olmadan çalışmanıza olanak tanır. Başlangıçta base64'ümü display:none; içeren bir öğeye yerleştirmeye karar verdim, ancak bu durumda onu panoya koyamadım çünkü herhangi bir ayrılık yaşanmaz. Bu nedenle display:none yerine; yaptım

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

bu da hem öğeyi görünümden gizlememe hem de aslında sayfada bırakmama olanak tanıdı. Voila, görev tamamlandı, butonuma tıkladığımda ara belleğe şöyle bir satır yerleştirildi:

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

bunu basitçe sunucudaki konsola yapıştırdım ve hemen tüm yapılandırmaları içeren bir zip arşivi aldım.
Ve tabii ki yazara bir çekme isteği gönderdim çünkü... proje aktif ve canlı, yazarın güncellemelerini görmek ve kendi düğmemin olmasını isterim) İlgilenenler için işte burada benim çatalım proje ve kendisi çekme isteği, neleri düzelttiğimi/eklediğimi görebileceğiniz yer.
Herkese mutlu gelişmeler)

Kaynak: habr.com