ለ nginx ውቅሮች ማመንጨት፣ የአንድ ጎታ ጥያቄ ታሪክ

ሰላም ጓዶች። በእኔ የውጊያ አገልጋዮች ላይ ቆንጆ ሲንክስ ከ 2006 ጀምሮ እየሰራ ነው እና በአስተዳደሩ ዓመታት ውስጥ ብዙ አወቃቀሮችን እና አብነቶችን አከማችቻለሁ። Nginxን በጣም አወድሼዋለሁ እና በሆነ መንገድ በ hub ላይ nginx hubን እንደጀመርኩ ታወቀኝ፣ ም/ አሳይ
ጓደኞቼ ለእነሱ የልማት እርሻ እንዳዘጋጅላቸው ጠየቁኝ እና የእኔን ልዩ አብነቶች ከመጎተት ይልቅ አንድ አስደሳች ፕሮጀክት ትዝ አለኝ nginxconfig.io, በመደርደሪያዎች ላይ አወቃቀሮችን የሚበተን እና ሁሉንም ነገር ለማመስጠር ወዘተ ያዘጋጃል. አሰብኩ፣ ለምን አይሆንም? ነገር ግን wget/fetch/curl ን ተጠቅሜ በቀጥታ ወደ አገልጋዩ እንድሰቀል ሳይፈቅድ nginxconfig የዚፕ ማህደሩን ወደ አሳሹ እንዳወርድ ስለሚሰጠኝ ተናድጄ ነበር። ምን የማይረባ ነገር, በአሳሹ ውስጥ ለምን እፈልጋለሁ, ከኮንሶል ውስጥ በአገልጋዩ ላይ ያስፈልገኛል. ተናድጄ የፕሮጀክቱን አንጀት ለማየት ወደ github ሄድኩ፣ ይህም ወደ ሹካው እንዲመራ እና በዚህም የተነሳ የመጎተት ጥያቄን አመጣ። አስደሳች ባይሆን ኖሮ የማልጽፈው 😉

በእርግጥ፣ ወደ ምንጮቹ ከመቆፈሬ በፊት፣ Chrome የመነጨውን ዚፕ ማህደር ከውቅሮች ጋር የት እንደሚጎትተው ተመለከትኩኝ፣ እና እዚያ “ብሎብ:” የሚል አድራሻ እየጠበቀኝ ነበር፣ ኦፕ። አገልግሎቱ በመንገድ ላይ ምንም ነገር እንደማይፈጥር ቀድሞውኑ ግልጽ ሆኗል, በእርግጥ, ሁሉም በ js ነው. በእርግጥ የዚፕ ማህደር በደንበኛው፣ በአሳሹ እና በጃቫስክሪፕት በራሱ የተፈጠረ ነው። እነዚያ። ውበቱ ፕሮጀክቱ ነው nginxconfig.io በቀላሉ እንደ ኤችቲኤምኤል ገጽ ሊቀመጥ ይችላል፣ ለአንዳንዶቹ ተሰቅሏል። narod.ru እና ይሰራል) ይህ በጣም አስቂኝ እና አስደሳች መፍትሄ ነው, ሆኖም ግን, አገልጋዮችን ለማቀናበር በጣም ምቹ አይደለም, በእውነቱ, ይህ ፕሮጀክት ለተፈጠረው ነገር በትክክል. የተፈጠረውን ማህደር በአሳሽ ያውርዱ እና በ2019 nc... በመጠቀም ወደ አገልጋዩ ያስተላልፉት? የተገኘውን ውቅረት በቀጥታ ወደ አገልጋዩ የማውረድበትን መንገድ የመፈለግ ስራን ለራሴ አዘጋጅቻለሁ።
ፕሮጀክቱን ሹካ ካደረግኩ በኋላ ምርጫዎቼ ምን እንደሆኑ ማሰብ ጀመርኩ. ፕሮጀክቱ ያለ ምንም የኋላ ጫፍ ንጹህ የፊት-ፍጻሜ ሆኖ እንዲቀጥል ከሚለው ቅድመ ሁኔታ ማፈንገጥ ስላልፈለግኩ ስራው የተወሳሰበ ነበር። እርግጥ ነው፣ ቀላሉ መፍትሔ nodejs ን ማንሳት እና ቀጥታ አገናኞችን በመጠቀም ከውቅሮች ጋር ማህደር እንዲፈጥር ማስገደድ ነው።
በእውነቱ፣ ብዙ አማራጮች አልነበሩም። ይበልጥ በትክክል፣ ወደ አእምሮ የመጣው አንድ ብቻ ነው። የዚፕ ማህደር ለማግኘት አወቃቀሮችን ማዘጋጀት እና ወደ አገልጋይ ኮንሶል መቅዳት የምንችልበትን አገናኝ ማግኘት አለብን።
በውጤቱ ዚፕ ማህደር ውስጥ ያሉ በርካታ የጽሑፍ ፋይሎች ትንሽ፣ በጥሬው ጥቂት ኪሎባይት መዘኑ። ግልፅ የሆነው መፍትሄ ቤዝ64 ገመዱን ከተፈጠረው ዚፕ ማህደር አውጥቶ ወደ መያዣው ውስጥ መጣል ነበር፣ በኮንሶሉ ውስጥ ያለው ትዕዛዝ ባለው አገልጋይ ላይ እያለ

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

ቤተ-መጽሐፍትን በመጠቀም ሁሉም ነገር ቀላል ነው። jszip የማዋቀሪያው ፋይሎች የሚቀመጡበት ዚፕ ይፈጠራል። የዚፕ ማህደርን ከፈጠሩ በኋላ፣ js ቤተ-መጽሐፍቱን ተጠቅሞ ወደ አሳሹ ይመግባዋል። FileSaver.js:

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

እርስዎ እንዳስተዋሉት፣ የዚፕ ማህደርን ትውልድ ወደ ግል የማመንጨት ዚፕ ዘዴ፣ ወዘተ. ይህ AngularJS ነው፣ እና ደራሲው ራሱ በመልሶ መደወል ላይ ተጣብቋል እና በተስፋ ቃል አልተተገበረም። ማውረጃ ዚፕ አሁንም እንደ ውፅዓት ማስቀመጥን አድርጓል፣ አውርድBase64 ግን ትንሽ የተለየ ነገር አድርጓል። በኤችቲኤምኤል 5 ውስጥ ወደ እኛ የመጣ እና ቀድሞውኑም የሆነ የፋይል አንባቢ ነገርን እንፈጥራለን ተደራሽ ለመጠቀም. በአንድ ጊዜ ቤዝ64 ሕብረቁምፊ ከብሎብ ሊሠራ ይችላል ፣ ወይም ይልቁንስ የ DataURL ሕብረቁምፊ ይሠራል ፣ ግን ይህ ለእኛ በጣም አስፈላጊ አይደለም ፣ ምክንያቱም DataURL በትክክል የምንፈልገውን ይዟል። ቢንጎ፣ ይህን ሁሉ በቋት ውስጥ ለማስቀመጥ ስሞክር ትንሽ ተንኮለኛ ጠበቀኝ። ደራሲው በፕሮጀክቱ ውስጥ ያለውን ቤተ-መጽሐፍት ተጠቅሟል clipboardjs, ይህም በተመረጠው ጽሑፍ ላይ በመመርኮዝ ከቅንጥብ ሰሌዳው ያለ ብልጭታ ነገሮች እንዲሰሩ ያስችልዎታል. መጀመሪያ ላይ የእኔን ቤዝ64 ማሳያ: የለም; ነገር ግን በዚህ አጋጣሚ ወደ ቅንጥብ ሰሌዳው ላይ ማስቀመጥ አልቻልኩም ምክንያቱም መለያየት አይከሰትም። ስለዚህ, ከማሳያ ይልቅ: የለም; ሰርሁ

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

ኤለመንቱን ከእይታ እንድደብቀው እና በእውነቱ በገጹ ላይ እንድተው አስችሎኛል። ቮይላ፣ ስራው ተጠናቀቀ፣ ቁልፌን ጠቅ ሳደርግ፣ እንደዚህ ያለ መስመር በመጠባበቂያው ውስጥ ተቀመጠ።

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

በቀላሉ በአገልጋዩ ላይ ባለው ኮንሶል ውስጥ የለጠፍኩት እና ወዲያውኑ ከሁሉም ውቅሮች ጋር የዚፕ ማህደር ደረሰኝ።
እና፣ ለጸሃፊው የጉብኝት ጥያቄ ልኬዋለሁ፣ ምክንያቱም... ፕሮጀክቱ ንቁ እና ሕያው ነው፣ ከጸሐፊው ማሻሻያዎችን ለማየት እና የራሴ ቁልፍ እንዲኖረኝ እፈልጋለሁ) ፍላጎት ላላቸው ሰዎች ፣ እዚህ አለ የእኔ ሹካ ፕሮጀክት እና እራሱ የመጫን ጥያቄእኔ ያስተካከልኩት/የጨመርኩትን ማየት የምትችልበት።
መልካም ልማት ለሁሉም)

ምንጭ: hab.com