Node.js ድረ -ገጽ ክፍል 2: 7 ደረጃዎች

2024 ደራሲ ደራሲ: John Day | [email protected]. ለመጨረሻ ጊዜ የተሻሻለው: 2024-01-30 07:31

ወደ ክፍል 2 እንኳን በደህና መጡ !!

ይህ የእኔ Node.js ድር ጣቢያ ማመልከቻ አጋዥ ስልጠና ክፍል 2 ነው። አጭር መግቢያ የሚያስፈልጋቸውን እና በድረ -ገጽ ላይ ሙሉ መማሪያ የሚሹትን ስለሚለይ ይህንን ትምህርት በሁለት ከፍዬዋለሁ።

በጣቢያዬ ፈጠራ ውስጥ እሄዳለሁ። የእርስዎ የተለየ ሊሆን ይችላል ፣ ስለዚህ የእኔን ይከተሉ እና ያገለገሉትን ዘዴዎች ይማሩ። አንዴ የተለየ የኤችቲኤምኤል አብነት ከመረጡ ፍሰቱ በመጠኑ የተለየ ይሆናል። ይህንን ልብ ይበሉ።

ደረጃ 1 የመተግበሪያ መዋቅር

ስለዚህ ጣቢያዬ የፍጥነት ማመንጫውን ይከተላል ፣ ሆኖም እኔ ከጃድ ይልቅ እጀታዎችን እጠቀም ነበር። ጄድን ከወደዱ ይሂዱ! ጄድ ያለ ሁሉም ቅንፎች እና ዲቪዎች አጭር የእጅ ኤችቲኤምኤል ነው። ዩቲዩብን ለመጎብኘት እና አንዳንድ የኤችቲኤምኤል ትምህርቶችን ለመመልከት እንደሚፈልጉ ካልተረዱ።

በኤችቲኤምኤል እና በእጅ መያዣዎች የበለጠ እመርጣለሁ እና እጠቀምበታለሁ ፣ ያ እኔ የተጠቀምኩት ነው። በእጅ መያዣዎች አማካኝነት ፈጣን ፕሮጀክት ለመፍጠር ፈጣን ትዕዛዙን ያሂዱ።

express --hbs ስምofmyapp

ከዚያ ሁሉንም መካከለኛ ዕቃዎችን ለመጫን በክፍል 1 ውስጥ ያለውን ደረጃ መከተልዎን ይቀጥሉ።

ኤክስፕረስ በጣም የተወሰነ የመተግበሪያ መዋቅርን ይፈጥራል እና በጣም ጠቃሚ አንድ በጣም node.js ትግበራዎች ይህንን ቅጽ በተወሰኑ ልዩነቶች ይከተላሉ።

በተያያዘው ፎቶ ውስጥ የተለያዩ አቃፊዎችን እና ፋይሎችን ማየት ይችላሉ ፣ ከዚህ በታች እነዚህን ሁሉ ለማብራራት እሞክራለሁ።

መጣያ

Node.js አገልጋይዎን ሲጀምር ይህ መጀመሪያ የሚሄድ አቃፊ ነው። እሱ ወደ www ፋይል ይመለከታል እና ይህንን ፋይል ለመተግበር ይከተላል። የ www ፋይል node.js ወደብ 3000 ላይ አገልጋይ እንዲጀምር ይነግረዋል (ይህ ወደማንኛውም ነገር ሊለወጥ ይችላል) እና እንደ ክስተት አድማጭ እና የመሳሰሉትን ሌሎች አንዳንድ ነገሮችን ያድርጉ። ዋናው አስፈላጊ ነገር የእርስዎ መተግበሪያ የተቋቋመበት ወደብ ነው።

node_modules

በዚህ አቃፊ ውስጥ መካከለኛ ዕቃዎች የሚባሉት ናቸው። መካከለኛ ዕቃዎች ነገሮችን ኮድ እንዲያደርጉልዎት እንደ ተጨማሪ ሶፍትዌር መግለፅ እወዳለሁ። እርስዎ እንዲጠቀሙባቸው አስቀድመው የተሰሩ ተግባራት ያላቸው ሌሎች ቤተ-መጻሕፍት ናቸው። ለዚህ ፕሮጀክት የተጠቀምኩባቸው አንዳንድ ተጨማሪ መካከለኛ ዕቃዎች ኖዴማየር ፣ ፓስፖርት ፣ ኖዴሞን ፣ ባይክሪፕት እና ሌሎችም ነበሩ።

የህዝብ

ለድር ጣቢያዎ ሁሉም ምስሎችዎ ፣ ሲኤስኤስ እና ጃቫስክሪፕት የሚሄዱበት ይህ ነው። እነዚህ በቀጥታ በድረ -ገጾቹ ይጠቀማሉ።

መንገዶች

እነዚህ ለጣቢያዎ መንገዶችን የሚወስኑ ናቸው። እንደ መነሻ ገጽ ፣ የመግቢያ ገጽ እና ሌሎችም።

እይታዎች

እርስዎ ማየት የሚችሉት እይታዎች.hbs ፋይሎች ወይም.handlebars ናቸው ፣ እሱ ይሠራል ፣ እሱ የመተግበሪያውን jj ፋይል መጠቀሚያ ብቻ ይወስዳል። እነዚህ በአሳሹ ላይ የሚታዩ የእርስዎ የእጅ መያዣዎች html ገጾች ናቸው። አቀማመጥ የእርስዎ ዋና የአቀማመጥ ፋይል ሲሆን አንዳንድ ጊዜ በራሱ አቀማመጥ ንዑስ አቃፊ ውስጥ ነው። ዋናው የአቀማመጥ ፋይል ወደ ሌሎች የእጅ መያዣ ፋይሎችዎ ይደውላል እና ያሳያቸዋል ፣ ወደ ኮዱ ውስጥ ስንገባ ይህ የበለጠ ምክንያታዊ ይሆናል።

app.js

ይህ የእርስዎ ዋና የመተግበሪያ ፋይል ነው ፣ አንዳንድ ጊዜ ይህ አገልጋይ ይባላል ፣ በማዋቀር ላይ ብቻ የተመሠረተ ነው። ይህ ፋይል ለአገልጋዩ ሁሉም ውቅረት እና አንዳንድ ልዩ ተግባራትም አሉት። እንዲሁም የስህተት ተቆጣጣሪ ይሆናል።

ጥቅል. json

ይህ ፋይል በኤክስፕረስ የተፈጠረ እና በፕሮጀክትዎ ውስጥ ሊጠቀሙባቸው የሚፈልጓቸውን የመካከለኛ ዕቃዎች ሁሉ ለ npm ይነግረዋል። አንዴ የ npm መጫንን ከሮጡ ፣ በዚህ ፋይል ውስጥ የተጠሩ ሁሉም መካከለኛ ዕቃዎች በ node_modules አቃፊ ውስጥ ይጫናሉ።

ደረጃ 2 - አብነትዎን ያስተካክሉ

ሁሉንም ኤችቲኤምኤልዎን ከባዶ መፍጠር ይችላሉ ወይም አብነት መጠቀም ይችላሉ። ለዚህ ጣቢያ አብነት ተጠቅሜያለሁ። እኔ የረዳኋቸው ሌሎች ጣቢያዎች ከባዶ ኮዴ አድርጌአለሁ። ምርጫው የእርስዎ ነው ፣ ይህ ደረጃ የአብነት አቀማመጥን ያብራራል።

የእኔ የድር ትግበራ አስገራሚ ሲኤስኤስ (CSS) በመሥራት ረገድ ጥሩ የሆነውን የ bootstrap አብነት ይጠቀማል። አብነቶችን ለማግኘት ይህንን ጣቢያ ይጎብኙ። ቀደም ባለው ደረጃ እንደተገለፀው ሁሉም አስፈላጊ css ፣ js እና img ፋይሎች በሕዝብ አቃፊ ስር ናቸው። እነዚህ ፋይሎች ጣቢያው ከቀላል ጽሑፍ እና ምስሎች በጣቢያው ላይ እንዴት ጥቅም ላይ እንደሚውሉ የተሻለ ያደርጉታል።

የእጅ አምዶች አብነት ዘይቤ ከአብነት ጋር እንዲሠራ ለማድረግ ገጾቹ በሁለት ክፍሎች ተከፍለዋል። የመጀመሪያው “አቀማመጥ” ተብሎ የሚጠራው ነው። አቀማመጡ በጣቢያዎ ውስጥ ባለው እያንዳንዱ ድረ -ገጽ ላይ እንዲታይ የሚፈልጓቸው ንብረቶች ናቸው። በእኔ ሁኔታ ይህ የአሰሳ አሞሌ ያለው እና ራስጌው ተጨማሪ የማሰሻ እና የማሳያ ቁርጥራጮችን የያዘው ግርጌ ነው።

የአቀማመጥ ፋይል እና ሌሎች የእጅ መያዣ ፋይሎች በእይታዎች አቃፊ ውስጥ ናቸው። ጽንሰ -ሐሳቡ እንዴት እንደሚሰራ ለማሳየት ቀደም ሲል ከተጠቀሙበት የፍጥነት ማመንጫ (ጄኔሬተር) የበለጠ ቀለል ያለ አቀማመጥ እሄዳለሁ ፣ ከዚያ የእኔን ኮድ ማየት እና ማወዳደር ይችላሉ።

ኤክስፕረስ የመነጨ አቀማመጥ.handlebars ፋይል

{{title}} {{{{body}}})

እውነተኛው እጀታ አስማት በእጀታዎቹ {{title}} እና {{{body}}} ውስጥ ነው። ስለዚህ እነዚህ ሁለቱ በተለየ መንገድ ይሠራሉ {{title}} በመንገድ ላይ ከ index.js ፋይል የተላለፈ ተለዋዋጭ ነው ፣ አንዴ ወደ አብነት ከተላለፈ ይታያል። የ {{{body}}}} መለያ በመንገድ js ፋይልዎ ውስጥ ባለው የማቅረቢያ ተግባር ውስጥ የተጠራውን ሁሉ ይወስዳል። በእኛ ሁኔታ index.js ውስጥ ይህ መስመር አለው

res.

በእኛ ሁኔታ ኢንዴክስ.handlebars።

ኤክስፕረስ የመነጨ መረጃ ጠቋሚ

{{ርዕስ}}

እንኳን ወደ {{title}} በደህና መጡ

የ index.handlebars ፋይል እንደ ተለዋዋጭ ወደ የ {{{አካል}}} መለያ ተላልፎ በድር ገጽዎ ላይ ይታያል።

ይህ የድር ጣቢያዎ የማይንቀሳቀስ ክፍል እና ተለዋዋጭ ክፍል እንዲኖርዎት ያስችልዎታል። አዲስ ገጽ በሚጭኑበት ጊዜ ፣ አንዳንድ መረጃዎች ብቻ ይለወጣሉ ፣ መላውን ገጽ እንደገና መስጠት ስለሌለዎት ይህ ራስጌዎችን እና ግርጌዎችን ጥሩ ያደርገዋል።

ደረጃ 3 የእውቂያ ቅጽ

ማንኛውም ሰው በጣቢያዬ ኢሜል ፣ በጥያቄዎች ወይም በአስተያየቶች በኢሜል እንዲልክ የእውቂያ ቅጽን በድረ -ገቤ ውስጥ አካትቻለሁ።

ይህ የእውቂያ ቅጽ ኖድ ሜይለር የሚባለውን npm መካከለኛ-ዕቃዎችን ተጠቅሟል።

የመስቀለኛ ደብዳቤን በማቀናበር ላይ

መስቀለኛ-ኢሜል ለመጫን ከዚህ በታች ያለውን ኮድ በከፍተኛ ደረጃ ፋይልዎ ውስጥ ማሄድ ያስፈልግዎታል ፣ በእኛ ሁኔታ ፣ myapp።

sudo npm ጫን nodemailer

አንዴ ከተጫነ በእርስዎ app.js ፋይል ውስጥ ጥቂት ነገሮችን ማዘጋጀት ያስፈልግዎታል።

የመጀመሪያው ጥገኝነት ብቻ ነው ፣ ይህ ይህንን መካከለኛ ዕቃ ለመጠቀም እንዳሰብን መስቀለኛ መንገዱን ይነግረናል።

var nodemailer = ይጠይቁ ('nodemailer');

ሁለተኛው የእኛ አጓጓዥ ነው ፣ አጓጓዥው ከእርስዎ የመልእክት አገልጋይ ጋር ለመገናኘት ያገለግላል ፣ በእኔ ሁኔታ gmail።

// አጓጓp የጂሜል አካውንት ለማግኘት ያገለግል ነበር

var ትራንስፖርተር = nodemailer.createTransport ({service: 'gmail', auth: {type: 'OAuth2', user: '[email protected]', clientId: '139955258255-a3c6ilqu6rtocigde7cbrusicg7j00eh.apps.google 'Q775xefdHA_BGu3ZnY9-6sP-' refreshToken: '1 / 0HfdzyzW3FmnDPqeYkv19_py6zWgMCOqI9DSZ9kQWfc' accessToken: 'ya29. GlvDBGA2Z_coEKjQOnXAnBLbTB0wQmS-sARqNGC3V2UATiywNb34IhFq4d7UQvhTobE6pi83-FB2-OvMWjC-mk-EKPMYmwxFe9AOZ7mY6kurYyQ7e1Mu8m8INxg7 «}})

ኖደማየርን ከሌላ የደብዳቤ አገልጋይ ጋር የሚጠቀሙ ከሆነ እባክዎን ሰነዶችን እና እገዛን እዚህ ይመልከቱ።

ጥቂት ነገሮች ከሰው ወደ ሰው ይለወጣሉ - ተጠቃሚ ፣ ደንበኛ ፣ ደንበኛ ምስጢር። refreshToken ፣ እና accessToken።

የእርስዎ ተጠቃሚId ለመጠቀም የሚፈልጉበት ኢሜል ነው ፣ እንደ ጣቢያዬ ተመሳሳይ የሆነ አዲስ አደረግሁ።

ደንበኛው አይዲ ፣ ደንበኛ ምስጢር ፣ አድስ ቶክ እና መዳረሻ ቶከን በጉግል መለያዎ በኩል ማግኘት አለባቸው።

ተጨማሪ እገዛ ከፈለጉ ይህንን ቪዲዮ እዚህ መከተል ይችላሉ።

አንዴ እነዚያ መስኮች ከተሞሉ በኋላ የመልእክታችንን ዝርዝሮች እንጨምራለን።

በመቀጠል በእኛ ቅጽ ውስጥ ያሉት ሁሉም መስኮች መግባታቸውን እና ትክክለኛ ምላሾች መሆናቸውን ማረጋገጥ አለብን።

// Express Validatorapp.use (expressValidator ({errorFormatter: function (param ፣ msg ፣ value) {var namespace = param.split ('.') ፣ Root = namespace.shift () ፣ formParam = root;) {formParam + = '[' + namespace.shift () + ']' ';} {param: formParam ፣ msg: msg ፣ value: value} ፤}}));

አሁን በእኛ ድረ -ገጽ ላይ ካለው የእውቂያ ቅጽ መረጃን ማግኘት እና መልእክት መላክ አለብን።

// ከእውቂያ ማስረከቢያ አዝራር ይለጥፉ ፣ ለቀረበው formsapp.post ('/contact_Form' ፣ ተግባር (req ፣ res)) የመነሻ ገጽን መፍጠር ያስፈልጋል {// መረጃን ከእውቂያ ቅጽ ፣ ከ homepage.hbs var ስም ያግኙ = req.body.name; var email = req.body.email; ራስ -ሰር ኢሜል ፣ ለ ‹[email protected]› ፣ ርዕሰ ጉዳይ ፣ ‹የድር ጣቢያ የእውቂያ ቅጽ› + ስም ፣ ጽሑፍ - ከድር ጣቢያዎ የእውቂያ ቅጽ አዲስ መልእክት ደርሶዎታል። / n / n ' +' እዚህ ዝርዝሮቹ ናቸው / n / n ስም ፦ ' + ስም +' / n / n ኢሜይል ፦ ' + ኢሜይል +' / n / n ስልክ ፦ ' + ስልክ +' / n / n መልዕክት ፦ / n ' + መልእክት} አጓጓዥ.sendMail (mailOptions ፣ ተግባር (ስህተት ፣ ዳግም) {ከሆነ (ስህተት) {console.log ('ስህተት') ፤} ሌላ {console.log ('ኢሜል የተላከ') ፤}}) res.render ('ኢንዴክስ') ፤ // ይስጡ አዲስ የመነሻ ገጽ ፣ እንደ መውጫ ገጽ በመሳሰሉ በስኬት መልእክት ይህንን እንዴት ማድረግ እንደሚቻል ይመልከቱ))

ብልጭታ

ብልጭታዎች ድርጊቶች ከተደረጉ በኋላ መልዕክቶችን ለማሳየት ያገለግላሉ። ቅጽ ሲያስገቡ ይህንን ማየት ይችላሉ ፣ ወይም ወደ መስክ በትክክል ካልገቡ።

ልክ እንደሌሎች npm መካከለኛ ዕቃዎች ብልጭታ ይጫኑ።

sudo npm ጫን-ፍላሽ ጫን

var ፍላሽ = ይጠይቁ ('connect-flash'); // በማያ ገጽ መልዕክቶች ላይ ለማሳየት የፍላሽ ተግባር ነበረው

// Flashapp.use ን ያገናኙ (ፍላሽ ());

በድረ -ገጹ ላይ መልዕክቶችን የሚገፋ እና የሚያዘምን ፍላሽ አንቃ። እነዚህ እንደ ስኬት ያሉ ነገሮችን የሚናገሩ ወይም መረጃ በተሳሳተ መንገድ የገባባቸው መልእክቶች ናቸው።

// ግሎባል ቫርስ

app.use (ተግባር (req ፣ res ፣ next) {res.locals.success_msg = req.flash ('success_msg') ፤ res.locals.error_msg = req.flash ('error_msg') ፤ res.locals.error = req.flash ('ስህተት') ፤ res.locals.user = req.user || null; next ();});

አንዳንዶቹ ከብልጭታ ጋር የተገናኙ ተለዋዋጮች ያስፈልጋቸዋል።

እዚያ የተሰራ የእውቂያ ቅጽ ይሂዱ።

ደረጃ 4: የመግቢያ ገጽ

እኔ ማድረግ እችል እንደሆነ ለማየት የፈለግኩት ነገር ብቻ ነበር እና ምናልባት ወደፊት እጠቀምበታለሁ። በጊት ማከማቻዬ ውስጥ እንዳለ ኮዱን ለማብራራት ብቻ ፈልጌ ነበር።

ስለዚህ ይህ ክፍል ጥቂት ተጨማሪ npm መካከለኛ-ዕቃዎችን ይጠቀማል። ከዚህ በታች ያሉትን ትዕዛዞች በመጠቀም የሚከተለውን ይጫኑ።

npm ፓስፖርት ጫን && npm ጫን ፓስፖርት-አካባቢያዊ && npm ጫን bcryptjs

&&& በአንድ መስመር ብዙ ትዕዛዞችን እንዲያሄዱ ያስችልዎታል።

መግቢያ እና ተጠቃሚዎች

በመንገዶችዎ አቃፊ ስር የ login.js እና user.js ፋይል መፍጠር ያስፈልግዎታል። ይህ በእኛ የውሂብ ጎታ ውስጥ የሚከማች ተጠቃሚን ለመፍጠር እና የውሂብ ጎታውን በመፈተሽ ተጠቃሚው እንዲገባ ለመፍቀድ ጥቅም ላይ ይውላል።

user.js

var express = ይጠይቁ ('express'); var ራውተር = express. Router (); var ፓስፖርት = ይጠይቁ ('ፓስፖርት'); var LocalStrategy = ይጠይቁ ('ፓስፖርት-አካባቢያዊ')። ስትራቴጂ; var ተጠቃሚ = ይጠይቁ ('../ ሞዴሎች/ተጠቃሚ'); // ራውተር ይመዝገቡ። // ይመዝገቡ የተጠቃሚ ራውተር.ፖስት ('/ይመዝገቡ' ፣ ተግባር (req ፣ res) {var name = req.body.name; var email = req.body.email; var የተጠቃሚ ስም = req.body.username; var password = req.body.password; var password2 = req.body.password2; // ማረጋገጫ req.checkBody ('ስም' ፣ 'ስም ያስፈልጋል')))። የይለፍ ቃል '፣' የይለፍ ቃል ያስፈልጋል ')። not ባዶ () ፤ req.checkBody (' password2 '፣' የይለፍ ቃላት አይዛመዱም ')። እኩል (req.body.password); ስህተቶች) {res.render ('ይመዝገቡ' ፣ {ስህተቶች ፦ ስህተቶች}) ፤} ሌላ {var newUser = አዲስ ተጠቃሚ ((ስም ፣ ስም ፣ ኢሜይል ፣ ኢሜይል ፣ የተጠቃሚ ስም ፣ የተጠቃሚ ስም ፣ የይለፍ ቃል ፣ የይለፍ ቃል})) ፤ ተጠቃሚ.መፍጠር ተጠቃሚ (newUser ፣ ተግባር (ስህተት ፣ ተጠቃሚ) {(ስህተት ከሆነ) ስህተት ከጣለ ፣ console.log (ተጠቃሚ) ፤}) ፤ req.flash ('success_msg' ፣ 'እርስዎ ተመዝግበው አሁን መግባት ይችላሉ)) ፤ res.redirect (' /ግባ'); } });

ይህንን ወደታች ቁራጭ በመቁረጥ

በመጀመሪያ የሚያስፈልጉትን መካከለኛ ዕቃዎች ሁሉ አካተናል ፣ ከዚያ ከዚህ በታች የተብራራውን የእኛን የሞዴል ፋይል አካተናል። ከመመዝገቢያ መለያው እንጓዛለን እና የመመዝገቢያ መያዣ መያዣ ጽሑፋችንን እናሳያለን። ከዚያ አስፈላጊው ተግባር ይመጣል። እነዚህ በእኛ የውሂብ ጎታ ውስጥ አዲስ ተጠቃሚን እንድንመዘግብ ያስችለናል። ሁሉም መስኮች ልክ መሆናቸውን እና በቅጹ ውስጥ የተካተቱ መሆናቸውን ለማረጋገጥ ተግባሩ ይፈትሻል ፣ ካልሆነ ለእነሱ ይጠየቃል። ቀጥሎ ስህተቶችን ይፈትሻል ፣ እና ምንም ስህተቶች ካልተከሰቱ ከተሰጠው መረጃ ጋር አዲስ ተጠቃሚ ይፈጥራል። ከዚያ ወደ መግቢያ ገጹ ይመለሳል ፣ ይህም እንዲገቡ ያስችልዎታል።

login.js

var express = ይጠይቁ ('express');

var ራውተር = express. Router (); var ፓስፖርት = ያስፈልጋል ('ፓስፖርት'); var LocalStrategy = ይጠይቁ ('ፓስፖርት-አካባቢያዊ')። ስትራቴጂ; var ተጠቃሚ = ይጠይቁ ('../ ሞዴሎች/ተጠቃሚ'); /* የተጠቃሚዎችን ዝርዝር ያግኙ። */// የመነሻ ገጽ ራውተር.get ('/' ፣ ተግባር (req ፣ res) {res.render ('login') ፤}); passport.use (አዲስ LocalStrategy (ተግባር (የተጠቃሚ ስም ፣ የይለፍ ቃል ፣ ተከናውኗል)) message: 'Unknown User'});} User.comparePassword (password, user.password, function (err, isMatch) {if (ስህተት) ስህተት ከጣለ (isMatch) {መመለስ ተከናውኗል (ባዶ ፣ ተጠቃሚ) ፤} ሌላ { መመለስ ተከናውኗል (ባዶ ፣ ሐሰት ፣ {መልእክት ፦ 'ልክ ያልሆነ የይለፍ ቃል'});}});});}))); passport.serializeUser (ተግባር (ተጠቃሚ ፣ ተከናውኗል) {ተከናውኗል (ባዶ ፣ ተጠቃሚ.id) ፤}) ፓስፖርት. ራውተር. ዳሽቦርድ ');}); ራውተር.ጌት ('/logout' ፣ ተግባር (req ፣ res) {req.logout () ፤ req.flash ('success_msg' ፣ 'ዘግተው ወጥተዋል') ፤ res.redirect ('/መነሻ ገጽ') ፤});

module.exports = ራውተር;

በመጀመሪያ የሚያስፈልጉትን መካከለኛ ዕቃዎች ሁሉ አካተናል ፣ ከዚያ ከዚህ በታች የተብራራውን የእኛን የሞዴል ፋይል አካተናል። ከመግቢያ መለያው እንሄዳለን እና የመግቢያ እጀታ ጽሑፋችንን እናሳያለን። ከዚያ የገባውን የተጠቃሚ ስም እና የይለፍ ቃል ለመውሰድ አንዳንድ የፓስፖርት ተግባሮችን እንጠቀማለን እና በእኛ የውሂብ ጎታ ላይ እንፈትሻቸዋለን። እኛ እንጆሪ ፓይ ላይ መግባትን ትንሽ ዘገምተኛ ሊያደርግ የሚችል ኢንክሪፕት የተደረገ የይለፍ ቃል እንጠቀማለን። ይህንን የበለጠ በሚቀጥለው እገልጻለሁ። የተጠቃሚውን ስም እና የይለፍ ቃል ካረጋገጡ በኋላ ይህንን በመረጃ ጠቋሚ ፋይላችን ውስጥ ስናስቀምጠው ዳሽቦርዱን ወደሚያሳየው መነሻ ገጽ ይዛወራሉ። እንዲሁም እዚህ የመውጣት ችሎታን እዚህ እንጨምራለን።

ቀደም ሲል እንደጠቀስኩት እኛ የውሂብ ጎታውን ለመፈተሽ ሞዴል መፍጠርም ያስፈልገናል።

ይህ የሚከናወነው በዋናው የመተግበሪያ አቃፊዎ ውስጥ ሞዴሎች ተብለው የሚጠሩ አቃፊ በመፍጠር ነው። በዚህ አቃፊ ውስጥ የ user.js ፋይል ያስፈልጋል።

ሞዴል/user.js

var mongoose = ይጠይቁ ('ፍልፈል');

var bcrypt = ይጠይቁ ('bcryptjs'); // User Scheme var UserSchema = mongoose. Schema ({የተጠቃሚ ስም ፦ {type: String ፣ index: true} ፣ password) {type: String} ፣ email: {type: String} ፣ name: {type: String}}); var ተጠቃሚ = module.exports = mongoose.model ('ተጠቃሚ' ፣ UserSchema);

module.exports.createUser = ተግባር (newUser, callback) {

bcrypt.genSalt (10 ፣ ተግባር (ስህተት ፣ ጨው) {bcrypt.hash (newUser.password ፣ ጨው ፣ ተግባር (ስህተት ፣ ሃሽ) {newUser.password = hash; } module.exports.getUserByUsername = ተግባር (የተጠቃሚ ስም ፣ መልሶ ጥሪ) {var query = {የተጠቃሚ ስም: የተጠቃሚ ስም}; User.findOne (መጠይቅ ፣ መልሶ መደወያ); } module.exports.getUserById = ተግባር (መታወቂያ ፣ መልሶ መመለስ) {User.findById (መታወቂያ ፣ መልሶ መመለስ) } ሞዱል። }

ይህ ሞዴል የእኛ የተጠቃሚ መመዘኛዎች ምን እንደሚመስሉ እንዲሁም እንዴት እንደምንደርስባቸው ይዘረዝራል። የይለፍ ቃሎቻችንን ኢንክሪፕት እንደሚያደርግ ከዚህ በፊት ጠቅሻለሁ። ጥሰት በሚከሰትበት ጊዜ ማንም የይለፍ ቃል በውሂብ ጎታ ውስጥ እንዳይከማች ነው። የይለፍ ቃሎቹ የመካከለኛ ዕቃዎችን ብክሪፕት በመጠቀም ታጥበዋል።

ደረጃ 5 - የትራፊክ ቆጣሪ

ምን ያህል ልዩ ተጠቃሚዎች የእኔን ድረ -ገጽ እንደጎበኙ ለማየት እና የ "ስኬቶችን" ቁጥር ለመቁጠር ፈለግሁ። ይህንን ለማድረግ ብዙ መንገዶች አሉ ፣ እንዴት እንደሄድኩ እገልጻለሁ።

ይህ ምን ያህል ተጠቃሚዎች የእኔን ገጽ እንደጎበኙ እና እያንዳንዱ ልዩ ጎብitor ስንት ጊዜ እንደጎበኘ ለመከታተል የ mongodb ስብስብን ይጠቀማል።

ሞንጎዲቢን ስለማዋቀር ቀደም ብለን ስለ ተነጋገርን እንደገና አልሄድም።

ለማጠናቀር ሁለት ስብስቦችን ወደ የውሂብ ጎታዎ ማከል ያስፈልግዎታል። ይህንን ለማድረግ እርስዎ በይነገጽን የሚጠቀሙ ከሆነ ሮቦሞንጎን መጫን ይችላሉ ፣ ሆኖም ግን እኔ እንደ እኔ ጭንቅላት የሌለበት እንጆሪ ፓይ የሚጠቀሙ ከሆነ የሚከተሉትን ትዕዛዞች ይደሰታሉ።

የሞንጎ ቅርፊት

ዲቢቢ ለማርትዕ ፣ መረጃ ለማግኘት ወይም ስብስብ ለመፍጠር ራስ በሌለው አሃድ ላይ የሞንጎ ቅርፊት ያስፈልግዎታል።

አሂድ

ሞንጎ

ይህ ቅርፊቱን ይከፍታል።

ስብስብ ያክሉ

በእኔ ሁኔታ የውሂብ ጎታ ሎጊናፕ ተብሎ ይጠራል ፣ የፈለጉትን መሰየም ይችላሉ።

የአንተን ስም ይጠቀሙ

ጣቢያችንን ለሚጎበኙ ተጠቃሚዎች ሁሉንም የአይፒ አድራሻችንን ለመያዝ ስብስብ እንፈልጋለን።

db.creatCollection ("ip")

በመቀጠል ለጣቢያችን ልዩ ዘፈኖችን ለመቁጠር ስብስብ እንፈጥራለን። ይህ በመታወቂያ ተጀምሯል እና ከ 0 ጀምሮ መቁጠር።

db.createCollection ("ቆጠራ" ፣ {id: "hit counter" ፣ count: 0})

የአይፒ አድራሻዎችን ይከታተሉ

ይህንን ለማድረግ ተጠቃሚዎችን አይፒን የመነሻ ገፃችንን ሲጎተቱ ፣ ቆጠራችንን ከፍ እና በኋላ እነሱን ለማነጻጸር እናስቀምጣቸዋለን።

የእኛን ፍልፈል መርሃግብሮች ለማከማቸት አንዳንድ ሞዴሎችን መፍጠር እና በ homepage.js ፋይልችን ላይ አንዳንድ ኮድ ማከል አለብን።

እኛ count.js እና ip.js ን እንፈጥራለን እና በእኛ ሞዴሎች አቃፊ ውስጥ እናከማቸዋለን።

የ ip.js ፋይል ለአይፒ አድራሻችን ንድፍ ብቻ ነው

var mongoose = ይጠይቁ ('ፍልፈል'); // የጥቅል ተቆጣጣሪ ለሞንጎ

// Schema var IpSchema = mongoose. Schema ({ip: {type: String,} ፣ count: {type: Number,}}); var Ip = module.exports = mongoose.model ('Ip' ፣ IpSchema);

የክትትል መከታተልን ለመጀመር count.js በመነሻ ገፃችን ይጠራል። ከዚህ በታች እንደሚከተለው ይደረጋል።

//Homepagerouter.get('/ '፣ ተግባር (req ፣ res) {publicIp.v4 ()። ከዚያ (ip => {Public_ip = ip; console.log ("ipv4:"+ Public_ip) ፤ // =>' 46.5.21.123 '}) ፤ publicIp.v6 ()። ከዚያ (ip => {console.log ("ipv6" + ip) ፤ Public_ip = ip; // =>' fe80:: 200: f8ff: fe21: 67cf ' });

Count.getCount (ስብስብ ፣ ipc ፣ Public_ip ፣ ተግባር (ቆጠራ) {

}); count = db.collection ('count'). findOne ({id: "hit counter"} ፣ ተግባር (ስህተት ፣ ቆጠራ) {userCount = count.count; res.render ('homepage' ፣ {count: userCount}); }); });

ይህ የሚሆነው አንድ ሰው ወደ መነሻ ገጻችን በሄደ ቁጥር በዚህ ሁኔታ theinternet.onthewifi.com/homepage ነው።

የተጠቃሚውን አይፒ ፣ ip4 ወይም ip6 ይፈትሻል ፣ ከዚያ ያንን እሴት ወደ እሱ በሚልክበት ቦታ ያከማቻል count.get.collection ይህም በእኛ count.js ፋይል ውስጥ የተከማቸ ተግባር ነው።

የተጠቃሚውን ልዩነት ከፈተሸ በኋላ ተመልሶ የመቁጠር እሴቱን እንደ እጀታ ተለዋዋጭ ሆኖ ወደ መነሻ ገጹ ይለጥፋል።

የ count.js ፋይል እንደሚከተለው ነው።

//count.jsvar mongo = ይጠይቁ ('mongodb'); // የውሂብ ጎታውን ይደግፋል var mongoose = ይጠይቃል ('ፍልፈል'); // የጥቅል አያያዝ ለሞንጎ mongoose.connect ('mongodb: // localhost/loginapp'); var db = mongoose.connection; var Ip = ይጠይቁ ('../ ሞዴሎች/ip'); // Schema var CountSchema = mongoose. Schema ({id: {type: String,} ፣ count: {type: Number,}}); var Count = module.exports = mongoose.model ('ቆጠራ' ፣ CountSchema); module.exports.getCount = ተግባር (መቁጠር ፣ ipc ፣ Public_ip ፣ callback) {// ቆጠራ ፈተና ነው ፣ የመልሶ ማግኛ ተግባር ipc.findOne ({ip: Public_ip} ፣ ተግባር (ስህተት ፣ iptest) {ከሆነ (! iptest) // አክል በውሂብ ጎታ ውስጥ ከሌለ አዲስ አይፒ እና ቆጣሪ ያዘምኑ {var new_ip = new Ip ({ip: Public_ip ፣ count: 1}) ፣ db.collection ('ip')። አስቀምጥ (new_ip) ፤ // አዲስ ip ወደ የውሂብ ጎታ ቆጠራ። {ip: Public_ip} ፣ {$ inc: {count: 1}})}}); }

ይህ የቁጥር መርሃግብሩን እና የእኛን.getCount ተግባር ይፈጥራል። የ.getCount ተግባር DB ን ለተጠቃሚዎች አይፒ ይፈትሻል እና ካገኘው ፣ ተግባሩ የዚያ ተጠቃሚን ቆጠራ ይጨምራል ፣ የመምታቱን ቆጣሪ አይደለም። ሆኖም ተጠቃሚዎቹ አይፒ ካልተገኘ ከተጠቃሚዎች ip ጋር አዲስ የመሰብሰቢያ ነገር ይፈጥራል እና የተመታውን ቆጣሪ በ 1 ይጨምራል።

ይህ ተመልሶ ለድር ገጹ ይታያል።

እዚያ የ ip መከታተያ መምቻ ቆጣሪ አለዎት።

ደረጃ 6: ብሎግ

በአሁኑ ጊዜ ስለ ሶፍትዌሮች ፣ ስማርት ቤቶች እና ፖላሮይድስ በፍላጎቶቼ ላይ የተማከለ ብሎግ ለማዳበር እየሞከርኩ ነው። ስለዚህ የጦማር ክፍል ፈጠርኩ። ብሎጉ የማይንቀሳቀስ የኤችቲኤምኤል ገጾችን እና የእጅ መያዣዎችን ማዕቀፍ ይጠቀማል። ብሎግን ቀላል ለማድረግ የተሻሉ ቴክኖሎጂዎችን ከተመለከትኩ በኋላ ሁጎ በመጠቀም ድር ጣቢያዬን እንደገና ዲዛይን አድርጌአለሁ። ሁጎ የማይንቀሳቀስ ኤችቲኤምኤል ጀነሬተር ነው። ከዚህ በታች በተጠቀሰው መማሪያ ውስጥ ስለዚህ ጉዳይ የበለጠ እናገራለሁ።

ደረጃ 7: ተጠናቅቋል

እዚያ በኔ Raspberry pi ላይ በአከባቢው በተስተናገደው በ node.js ድርጣቢያዬ ላይ ጥልቅ ትምህርት ይማሩ። ጥያቄዎች ወይም አስተያየቶች ካሉዎት እባክዎን ከዚህ በታች ይተዋቸው።

ይህ እዚያ ያሉ ሌሎችን እንደሚረዳ ተስፋ አደርጋለሁ።

ሁጎ በመጠቀም ለዚህ ጣቢያ የተለየ አቀራረብ ፣ የማይንቀሳቀስ የድር ገጽ ጄኔሬተር የእኔን ሌላ መማሪያ (በቅርቡ ይመጣል) ይመልከቱ።