Node.js вэб хуудас 2 -р хэсэг: 7 алхам

2024 Зохиолч: John Day | [email protected]. Хамгийн сүүлд өөрчлөгдсөн: 2024-01-30 11:03

2 -р хэсэгт тавтай морилно уу !!

Энэ бол миний Node.js вэбсайтын програмын хичээлийн 2 -р хэсэг юм. Би товч танилцуулга хэрэгтэй байгаа хүмүүс болон вэб хуудсан дээр бүрэн заавар авахыг хүсэж буй хүмүүсийг тусгаарласан тул энэ хичээлийг хоёр хэсэгт хуваасан.

Би сайтынхаа бүтээн байгуулалтыг хийх гэж байна. Таных арай өөр байж магадгүй тул миний дүрмийг дагаж, ашигласан техникийг сураарай. Та өөр HTML загвар сонгосны дараа урсгал нь арай өөр байх болно. Үүнийг санаж яваарай.

Алхам 1: Апп бүтэц

Тиймээс миний сайт буухиа үүсгүүрийг дагаж мөрддөг боловч би хаш гэхээсээ илүү бариул ашигладаг байсан. Хэрэв та хаш чулуунд дуртай бол үүнийг хий! Jade бол бүх хаалт, диверсгүй богино гар HTML юм. Хэрэв та ойлгохгүй байгаа бол youtube -д зочилж, HTML хичээл үзэхийг хүсч магадгүй юм.

Би HTML болон бариулыг ашиглахыг илүүд үздэг бөгөөд илүү тухтай байдаг. Бариултай экспресс төсөл үүсгэхийн тулд экспресс командыг ажиллуулна уу.

express -hbs nameofmyapp

Дараа нь бүх дунд хэрэгслийг суулгах 1-р хэсгийн алхамыг үргэлжлүүлээрэй.

Экспресс нь маш тодорхой аппликейшн бүтцийг бий болгодог бөгөөд node.js програмуудын ихэнх нь энэ хэлбэрийг дагаж мөрддөг.

Хавсаргасан зурган дээр та өөр өөр хавтас, файлуудыг харж болно, доор би энэ бүхнийг тайлбарлахыг хичээж байна.

бин

Энэ бол node.js таны серверийг ажиллуулахад эхлээд ажилладаг фолдер юм. Энэ нь www файлыг хараад энэ файлыг дагаж мөрдөх болно. Www файл нь node.js -ийг 3000 порт дээр сервер эхлүүлэхийг хэлдэг (энэ нь бараг бүх зүйл болж өөрчлөгдөж болно), мөн үйл явдал сонсогч гэх мэт бусад зүйлсийг хийх ёстой. Хамгийн гол нь таны аппликешныг тохируулсан порт юм.

зангилааны_модуль

Энэ фолдерт дунд бараа гэж нэрлэдэг. Дунд хэрэгсэл Би танд код бичихэд хялбар болгох нэмэлт програм хангамж гэж тайлбарлах дуртай. Theya нь үндсэндээ таны ашиглахад зориулагдсан бусад номын сан юм. Миний энэ төсөлд ашиглаж байсан зарим нэмэлт хэрэгслүүд бол Nodemailer, Passport, Nodemon, bycrypt болон бусад.

нийтийн

Энэ бол таны вэбсайтын бүх зураг, CSS, javascript хаашаа явах болно. Эдгээрийг вэб хуудсууд шууд ашигладаг.

замууд

Эдгээр нь таны сайтын замыг тодорхойлдог. Нүүр хуудас, нэвтрэх хуудас болон бусад.

үзэл бодол

Таны харж байгаагаар.hbs файлууд эсвэл.handlebars аль аль нь харагдах болно, энэ нь ажиллах болно, зүгээр л app.js файлыг удирдахад л хангалттай. Эдгээр нь хөтөч дээр харагдах html хуудсууд юм. Байршил бол таны байршлын үндсэн файл бөгөөд заримдаа өөрийн зохион байгуулалтын дэд хавтсанд байдаг. Байршлын үндсэн файл нь таны бусад бариулын файлуудыг дуудаж харуулдаг бөгөөд энэ нь бид код руу ороход илүү утга учиртай болно.

app.js

Энэ бол таны програмын үндсэн файл бөгөөд заримдаа үүнийг сервер гэж нэрлэдэг бөгөөд энэ нь зөвхөн тохиргооноос хамаарна. Энэ файл нь серверийн бүх тохиргоо, тэр ч байтугай зарим тусгай функцуудтай. Энэ нь бас алдаа зохицуулагч байх болно.

багц.json

Энэ файлыг express -ээр үүсгэсэн бөгөөд таны төсөлд ашиглахыг хүссэн бүх дунд програмыг npm -д хэлдэг. Та npm install-ийг ажиллуулсны дараа энэ файлд дуудагдсан бүх хэрэгслүүд node_modules фолдерт суулгагдах болно.

Алхам 2: Загвараа байрлуул

Та бүх HTML -г эхнээс нь үүсгэх эсвэл загвар ашиглах боломжтой. Би энэ сайтын загварыг ашигласан. Миний боловсруулсан бусад сайтуудыг би эхнээс нь кодчилсон. Сонголт нь таных бөгөөд энэ алхам нь загвар зохион байгуулалтыг тайлбарлах болно.

Миний вэб програм нь bootstrap загварыг ашигладаг бөгөөд энэ нь гайхалтай CSS хийхэд маш сайн байдаг. Загваруудыг олохын тулд энэ сайтад зочилно уу. Өмнөх алхамд дурдсанчлан шаардлагатай бүх css, js, img файлууд нь нийтийн хавтас дор байдаг. Эдгээр файлууд нь сайтыг энгийн текстээс илүү сайн харагдуулж, зургийг сайт дээр хэрхэн ашиглахыг харуулдаг.

Загвар хийх загварыг жолоодлоготой болгохын тулд хуудсыг хоёр хэсэгт хуваасан болно. Эхнийх нь "зохион байгуулалт" гэж нэрлэгддэг зүйл юм. Байршил бол таны сайт дээрх вэб хуудас бүрт харуулахыг хүсч буй шинж чанарууд юм. Миний хувьд энэ бол навигацийн самбар бүхий толгой хэсэг бөгөөд нэмэлт навигацийн болон дэлгэцийн хэсгүүдийг агуулсан хөл хэсэг юм.

Байршлын файл болон бусад бариулын файлууд нь харах хавтсанд байна. Уг ойлголт хэрхэн ажилладагийг харуулахын тулд би өмнө нь ашиглаж байсан экспресс генератороос илүү энгийн загварыг авч үзэх болно, тэгвэл та миний кодыг харж, харьцуулж үзээрэй.

Layout.handlebars файлыг үүсгэсэн

{{гарчиг}} {{{бие}}}

Жинхэнэ бариулын ид шид нь {{title}} ба {{{body}}} бариул дээр байдаг. Тиймээс эдгээр хоёр өөрөөр ажилладаг {{title}} нь index.js файлаас чиглэлд дамжуулагддаг хувьсагч бөгөөд үүнийг загвар руу шилжүүлсний дараа харуулдаг. {{{Body}}} шошго нь таны чиглүүлэлтийн js файл дахь рэндэрлэх функцэд юу гэж нэрлэгддэгийг авдаг. Манай тохиолдолд index.js дараах мөртэй байна.

res.render ('индекс', {гарчиг: 'Экспресс', тоо: userCount});

Энэ нь таны ашигладаг хөдөлгүүр, хаш, жолоо гэх мэтийг ашигладаг "индекс" файлыг дууддаг бөгөөд манай тохиолдолд index.handlebars.

Экспресс үүсгэсэн индекс.handlebars

{{гарчиг}}

{{Title}} -д тавтай морилно уу

Index.handlebars файлыг {{{body}}} таг руу хувьсагч шиг дамжуулж, таны вэб хуудсан дээр харуулна.

Энэ нь танд вэбсайтынхаа статик хэсэг болон хувьсах хэсгийг авах боломжийг олгоно. Энэ нь толгой ба хөлийг сайхан болгодог, учир нь та хуудсыг бүхэлд нь дахин хөрвүүлэх шаардлагагүй тул шинэ хуудас ачаалах үед зөвхөн зарим мэдээллийг өөрчилдөг.

Алхам 3: Холбоо барих маягт

Би холбоо барих маягтыг вэб хуудсандаа оруулсан бөгөөд ингэснээр хэн ч миний сайтын имэйл рүү асуулт, сэтгэгдэл бичих боломжтой болно.

Энэ холбоо барих маягт нь Npm Mailer гэж нэрлэгддэг npm дунд хэрэгслийг ашигласан.

Node Mailer -ийг тохируулж байна

Зангилаа мэйл суулгахын тулд та доорх кодыг дээд түвшний файл дээрээ ажиллуулах хэрэгтэй, манай тохиолдолд myapp.

sudo npm nodemailer суулгана уу

Суулгасны дараа та app.js файлдаа хэдэн зүйлийг тохируулах хэрэгтэй болно.

Эхнийх нь зөвхөн хараат байдал бөгөөд энэ нь бид энэ дунд програмыг ашиглахаар төлөвлөж буйг хэлдэг.

var nodemailer = шаардлагатай ('nodemailer');

Хоёрдугаарт, манай тээвэрлэгч, тээвэрлэгч нь таны имэйл серверт холбогдоход хэрэглэгддэг, миний хувьд gmail.

// Тээвэрлэгч нь gmail акаунт авдаг байсан

var transporter = nodemailer.createTransport ({үйлчилгээ: 'gmail', auth: {төрөл: 'OAuth2', хэрэглэгч: '[email protected]', clientId: '139955258255-a3c6ilqu6rtocigde7cbrusicg7j00eh.apps.google': "Q775xefdHA_BGu3ZnY9-6sP-" refreshToken: "1 / 0HfdzyzW3FmnDPqeYkv19_py6zWgMCOqI9DSZ9kQWfc", accessToken: "ya29. GlvDBGA2Z_coEKjQOnXAnBLbTB0wQmS-sARqNGC3V2UATiywNb34IhFq4d7UQvhTobE6pi83-FB2-OvMWjC-MK-EKPMYmwxFe9AOZ7mY6kurYyQ7e1Mu8m8INxg7 '}})

Хэрэв өөр мэйл сервертэй nodemailer ашиглаж байгаа бол эндээс бичиг баримт, тусламжийг үзнэ үү.

Хүнээс хүнд хэдэн зүйл өөрчлөгдөх болно: user, clientId, clientSecret. refreshToken, accessToken.

Таны userId бол таны ашиглахыг хүсч буй имэйл юм, би сайттайгаа ижил нэртэй шинэ хаяг үүсгэсэн.

ClientId, clientSecret, refreshToken, accessToken -ийг таны Google акаунтаар дамжуулан олох шаардлагатай.

Хэрэв танд илүү их тусламж хэрэгтэй бол энэ видеог эндээс үзэх боломжтой.

Эдгээр бүх талбарыг бөглөсний дараа бид зурвасын дэлгэрэнгүй мэдээллийг оруулах болно.

Дараа нь бид маягтын бүх талбарыг оруулсан бөгөөд хүчин төгөлдөр хариултууд гэдгийг баталгаажуулах ёстой.

// Express Validatorapp.use (expressValidator ({errorFormatter: function (param, msg, value) {var namespace = param.split ('.')), Root = namespace.shift (), formParam = root; while (namespace.length)) {formParam + = '[' + namespace.shift () + ']';} буцаах {param: formParam, msg: msg, value: value};}}));

Бид одоо вэб хуудсан дээрх холбоо барих маягтаас мэдээлэл авч, мессеж илгээх шаардлагатай байна.

// Холбоо барих илгээх товчлуураас бичлэг оруулах, илгээсэн formapp.post ('/contact_Form', функц (req, res)) амжилттай гэсэн мессеж бүхий нүүр хуудас үүсгэх шаардлагатай. // // Нүүр хуудаснаас мэдээлэл авах. Hbs var name = req.body.name; var email = req.body.email; var phone = req.body.phone; var message = req.body.message; var mailOptions = {// нь мессеж илгээхдээ ашигласан мэдээллийг үүсгэдэг. ' Автомат имэйл ', руу:' [email protected] ', сэдэв:' Вэбсайттай харилцах маягт: ' + нэр, текст:' Та вэбсайтынхаа холбоо барих маягтаас шинэ зурвас хүлээн авсан болно. / N / n ' +' Энд дэлгэрэнгүй мэдээлэл байна: / n / nНэр: ' + нэр +' / n / nМэйл: ' + имэйл +' / n / nУтас: ' + утас +' / n / nМессеж: / n ' + мессеж} тээвэрлэгч.sendMail (mailOptions, function (err, res) {if (err) {console.log ('Error');} else {console.log ('Имэйл илгээсэн');}}) res.render ('index'); // render шинэ нүүр хуудас, үүнийг амжилтын мессежээр хэрхэн яаж хийхийг судлах, гарах хуудас гэх мэт))

Flash

Флэш нь үйлдэл хийсний дараа мессежийг харуулахад ашиглагддаг. Та маягт оруулах эсвэл талбарыг зөв оруулахгүй байх үед үүнийг харж болно.

Бусад npm дунд програмын нэгэн адил флаш суулгаарай.

sudo npm connect-flash суулгана уу

var flash = шаардлагатай ('connect-flash'); // дэлгэцийн зурвас дээр харуулах флаш функцтэй байсан

// Flashapp.use -ийг холбох (flash ());

Вэб хуудсан дээрх мессежийг түлхэж, шинэчилдэг флашыг идэвхжүүлнэ үү. Эдгээр нь амжилтанд хүрэх, эсвэл мэдээлэл буруу оруулсан гэх мэт мессежүүд юм.

// Глобал Варс

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; дараагийн ();});

Зарим нь флэштэй холбоотой хувьсагч хэрэгтэй.

Та холбоо барих маягт руу очно уу.

Алхам 4: Нэвтрэх хуудас

Энэ бол миний хийж чадах эсэхийг харахыг хүссэн зүйл байсан бөгөөд ирээдүйд үүнийг ашиглах болно. Би зүгээр л кодыг миний git репозиторт байгаа шиг тайлбарлахыг хүссэн юм.

Тиймээс энэ хэсэг нь хэд хэдэн npm дунд хэрэгслийг ашигладаг. Доорх тушаалуудыг ашиглан дараахь зүйлийг суулгана уу.

npm паспорт && npm суулгах паспорт-орон нутгийн && npm суулгах bcryptjs

&& нь нэг мөрөөр олон тушаалыг ажиллуулах боломжийг олгодог.

Нэвтрэх ба Хэрэглэгчид

Та өөрийн маршрутын хавтасны дор login.js болон user.js файл үүсгэх шаардлагатай болно. Энэ нь манай мэдээллийн санд хадгалагдах хэрэглэгчийг бий болгох, хэрэглэгчийн мэдээллийн санг шалгах замаар нэвтрэх боломжийг олгоход ашиглагдах болно.

user.js

var express = шаарддаг ('express'); var router = express. Router (); var passport = шаарддаг ('паспорт'); var LocalStrategy = шаарддаг ('паспорт-орон нутгийн'). Стратеги; var User = шаардлагатай ('../ загвар/хэрэглэгч'); // Бүртгүүлэх router.get ('/register', function (req, res) {res.render ('register');}); // Хэрэглэгчийн бүртгүүлэх router.post ('/register', function (req, res) {var name = req.body.name; var email = req.body.email; var username = req.body.username; var password = req.body.password; var password2 = req.body.password2; // Баталгаажуулалт req.checkBody ('нэр', 'Нэр шаардлагатай'). notEmpty (); req.checkBody ('имэйл', 'Имэйл оруулах шаардлагатай')).notEmpty (); req.checkBody ('имэйл', 'Имэйл буруу байна'). isEmail (); req.checkBody ('хэрэглэгчийн нэр', 'Хэрэглэгчийн нэр шаардлагатай'). notEmpty (); req.checkBody (' нууц үг ',' Нууц үг шаардлагатай '). notEmpty (); req.checkBody (' нууц үг2 ',' Нууц үг тохирохгүй байна '). тэнцүү (req.body.password); var error = req.validationErrors (); хэрэв (алдаа) {res.render ('бүртгүүлэх', {алдаа: алдаа});} өөр {var newUser = шинэ Хэрэглэгч ({нэр: нэр, имэйл: имэйл, хэрэглэгчийн нэр: хэрэглэгчийн нэр, нууц үг: нууц үг}); User.createUser (newUser, function (err, user) {if (err) throw err; console.log (user);}); req.flash ('success_msg', 'Та бүртгүүлсэн бөгөөд одоо нэвтэрч болно'); res.redirect (' /нэвтрэх ');}});

Үүнийг хэсэг хэсгээр нь задлах

Эхлээд бид шаардлагатай бүх дунд хэрэгслийг оруулаад дараа нь доор тайлбарласан загвар файлаа оруулна. Бид бүртгэлийн хаягаас чиглүүлж, регистрийн бариулын текстийг харуулдаг. Дараа нь чухал функц гарч ирнэ. Эдгээр нь манай мэдээллийн санд шинэ хэрэглэгч бүртгүүлэх боломжийг олгодог. Функц нь бүх талбарууд хүчин төгөлдөр бөгөөд маягтанд орсон эсэхийг шалгадаг. Дараа нь энэ нь алдааг шалгадаг бөгөөд хэрэв алдаа гараагүй бол өгөгдсөн мэдээллээр шинэ хэрэглэгч үүсгэнэ. Дараа нь нэвтрэх хуудас руу чиглүүлж, нэвтрэх боломжийг танд олгоно.

нэвтрэх.js

var express = шаарддаг ('илэрхийлэх');

var router = express. Router (); var паспорт = шаардлагатай ('паспорт'); var LocalStrategy = шаарддаг ('паспорт-орон нутгийн'). Стратеги; var User = шаардлагатай ('../ загвар/хэрэглэгч'); /* Хэрэглэгчдийн жагсаалтыг авах. */// Нүүр хуудас router.get ('/', функц (req, res) {res.render ('нэвтрэх');}); passport.use (шинэ LocalStrategy (функц (хэрэглэгчийн нэр, нууц үг, дууссан)) {User.getUserByUsername (хэрэглэгчийн нэр, функц (алдаа, хэрэглэгч)) {if (алдаа) алдаа гаргах; хэрэв (! хэрэглэгч) {буцаалт хийгдсэн (null, false, { зурвас: 'Үл мэдэгдэх хэрэглэгч'});} User.comparePassword (нууц үг, user.password, функц (err, isMatch) {if (err) алдаа гаргах; if (isMatch) {буцаагдсан (null, хэрэглэгч);} өөр { буцаалт хийгдсэн (null, false, {message: 'Буруу нууц үг'});}});});})); passport.serializeUser (функц (хэрэглэгч, дууссан) {хийгдсэн (null, user.id);}); passport.deserializeUser (функц (id, дууссан) {User.getUserById (id, функц (алдаа, хэрэглэгч) {хийсэн (алдаа, хэрэглэгч);});}); router.post ('/login', passport.authenticate ('local', {successRedirect: '/', failRedirect: '/login', failFlash: true}), функц (req, res) {res.redirect ('/ хяналтын самбар ');}); router.get ('/logout', function (req, res) {req.logout (); req.flash ('амжилт_msg', 'Та бүртгэлээс гарсан'); res.redirect ('/нүүр хуудас');});

module.exports = чиглүүлэгч;

Эхлээд бид шаардлагатай бүх дунд хэрэгслийг оруулаад дараа нь доор тайлбарласан загвар файлаа оруулна. Бид нэвтрэх хаягаас чиглүүлж, нэвтрэх бариулынхаа текстийг харуулдаг. Дараа нь бид паспортын зарим функцийг ашиглан хэрэглэгчийн нэр, нууц үгийг аваад мэдээллийн сантайгаа харьцуулж шалгадаг. Бид шифрлэгдсэн нууц үгийг ашиглах бөгөөд энэ нь бөөрөлзгөнө pi дээр нэвтрэхийг бага зэрэг удаашруулдаг. Үүнийг би дараа дэлгэрэнгүй тайлбарлах болно. Хэрэглэгчийн нэр, нууц үгийг баталгаажуулсны дараа та нүүр хуудсанд дахин чиглүүлэх болно, энэ нь индекс файлдаа үүнийг тохируулах үед хяналтын самбарыг харуулна. Бид эндээс гарах боломжийг бас нэмж байна.

Өмнө дурьдсанчлан бид мэдээллийн санг шалгах загварыг бий болгох шаардлагатай болно.

Үүнийг үндсэн програмын хавтасныхаа доор загвар гэж нэрлэсэн хавтас үүсгэх замаар хийдэг. Энэ фолдерт user.js файл бас хэрэгтэй.

загвар/хэрэглэгч.js

var mongoose = шаардлагатай ('mongoose');

var bcrypt = шаарддаг ('bcryptjs'); // Хэрэглэгчийн схем var UserSchema = mongoose. Schema ({хэрэглэгчийн нэр: {төрөл: String, индекс: үнэн}, нууц үг: {төрөл: String}, имэйл: {төрөл: String}, нэр: {төрөл: String}}); var User = module.exports = mongoose.model ('Хэрэглэгч', UserSchema);

module.exports.createUser = функц (newUser, backback) {

bcrypt.genSalt (10, функц (алдаа, давс) {bcrypt.hash (шинэ хэрэглэгчийн нууц үг, давс, функц (алдаа, хэш) {newUser.password = hash; newUser.save (дуудлага хийх);});)); } module.exports.getUserByUsername = функц (хэрэглэгчийн нэр, дуудлага) {var query = {хэрэглэгчийн нэр: хэрэглэгчийн нэр}; User.findOne (асуулга, дуудлага буцаах); } module.exports.getUserById = функц (id, backback) {User.findById (id, callback); } module.exports.comparePassword = функц (namizədPassword, хэш, дуудлага) {bcrypt.compare (namizədPassword, хэш, функц (алдаа, isMatch) {if (алдаа) алдаа гаргах; дуудлага хийх (null, isMatch);}); }

Энэхүү загвар нь манай хэрэглэгчийн параметрүүд хэрхэн харагдахыг, мөн тэдгээрт хэрхэн хандахыг тодорхойлсон болно. Бид нууц үгээ шифрлэх болно гэж би өмнө нь хэлсэн. Ингэснээр нууц үгийг зөрчсөн тохиолдолд мэдээллийн санд хадгалахгүй. Нууц үгийг дунд бараа bcrypt ашиглан хэш хийдэг.

Алхам 5: Замын хөдөлгөөний тоолуур

Би хэдэн өвөрмөц хэрэглэгчид миний вэб хуудсанд зочилж, "хит" тоог тоолохыг хүсч байсан. Үүнийг хийх олон арга бий, би үүнийг хэрхэн яаж хийхийг тайлбарлах болно.

Энэ нь mongodb цуглуулгыг ашиглан миний хуудсанд хичнээн олон хэрэглэгч зочилсон, өвөрмөц зочин бүр хэдэн удаа зочилсоныг хянадаг.

Бид mongoDB -ийг байгуулах талаар аль хэдийн ярьсан тул би үүнийг дахин давтахгүй.

Эмхэтгэхийн тулд та мэдээллийн санд хоёр цуглуулга нэмэх шаардлагатай болж магадгүй юм. Үүнийг хийхийн тулд та UI ашиглаж байгаа бол RoboMongo -г суулгаж болно, гэхдээ хэрэв та над шиг толгойгүй бөөрөлзгөнө pi ашиглаж байгаа бол дараах тушаалуудыг ашиглах болно.

Монго бүрхүүл

DB -ийг засварлах, мэдээлэл авах эсвэл цуглуулга үүсгэхийн тулд толгойгүй толгой дээрх mongo бүрхүүл хэрэгтэй болно.

Гүйх

монго

Энэ нь бүрхүүлийг нээх болно.

Цуглуулга нэмэх

Миний хувьд мэдээллийн санг loginapp гэж нэрлэдэг бөгөөд та үүнийг хүссэнээрээ нэрлэж болно.

nameofyourdb -ийг ашиглана уу

Манай сайтад зочилж буй хэрэглэгчдийн бүх IP хаягийг хадгалах цуглуулга хэрэгтэй байна.

db.creatCollection ("ip")

Дараа нь бид манай сайтын өвөрмөц хитүүдийг тоолох цуглуулга бүтээдэг. Үүнийг id -ээр эхлүүлж, 0 -ээс эхлэн тоолно.

db.createCollection ("тоолох", {id: "тоолуурыг цохих", тоо: 0})

IP хаягийг хянах

Үүнийг хийхийн тулд бид хэрэглэгчид манай нүүр хуудсанд зочлохдоо Ip -ийг татаж, бидний тоог нэмэгдүүлж, дараа нь харьцуулахын тулд хадгалах болно.

Бид mongoose схемээ хадгалахын тулд зарим загвар үүсгэж, homepage.js файлдаа зарим код нэмэх хэрэгтэй.

Бид count.js болон ip.js үүсгэж, тэдгээрийг өөрсдийн загварын хавтсанд хадгалдаг.

IP.js файл бол бидний IP хаягийн схем юм

var mongoose = шаардлагатай ('mongoose'); // mongo -д зориулсан багц зохицуулагч

// Count 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 ('нүүр хуудас', {count: userCount}); }); });

Энэ нь хэн нэгэн манай нүүр хуудас руу орох бүрт тохиолддог, энэ тохиолдолд theinternet.onthewifi.com/homepage.

Энэ нь хэрэглэгчийн IP4 эсвэл ip6 -ийн IP хаягийг шалгаад дараа нь энэ утгыг манай count.js файлд хадгалагдсан функц болох count.get.collection руу илгээдэг газарт хадгалдаг.

Хэрэглэгчийн өвөрмөц байдлыг шалгасны дараа тоолох утгыг бариулын хувьсагч хэлбэрээр нүүр хуудсанд буцааж илгээдэг.

Count.js файл дараах байдалтай байна.

//count.jsvar mongo = шаардлагатай ('mongodb'); // мэдээллийн санг дэмждэг var mongoose = шаардлагатай ('mongoose'); // mongo mongoose.connect -ийн багц зохицуулагч ('mongodb: // localhost/loginapp'); var db = mongoose.connection; var Ip = шаардлагатай ('../ model/ip'); // Count Schema var CountSchema = mongoose. Schema ({id: {type: String,}, count: {type: Number,}}); var Count = module.exports = mongoose.model ('Count', CountSchema); module.exports.getCount = функц (тоолох, ipc, Public_ip, дуудлага хийх) {// тоолох нь тест, буцаан залгах функц ipc.findOne ({ip: Public_ip}, функц (алдаа, iptest) {if (! iptest) // нэмэх мэдээллийн санд байхгүй бол шинэ ip, тоолуурыг шинэчлэх {var new_ip = new Ip ({ip: Public_ip, count: 1}); db.collection ('ip'). save (new_ip); // шинэ ip нэмэх мэдээллийн сан count.update (// шинэчлэх хит тоолуур {id: "hit counter"}, {$ inc: {count: 1}})} өөр // тодорхой IP тоолуурыг шинэчлэх, хэн хамгийн их зочилдогийг харах {ipc.update ({ip: Public_ip}, {$ inc: {count: 1}})}}); }

Энэ нь тоолох схем болон бидний.getCount функцийг бий болгодог.. GetCount функц нь DB -ийг хэрэглэгчдийн IP -д шалгадаг бөгөөд хэрэв олсон бол функц нь тухайн хэрэглэгчийн тоог нэмэгдүүлдэг, харин тоолуурыг тоолох тоолуурыг биш юм. Гэсэн хэдий ч хэрэв хэрэглэгчид ip олдохгүй бол энэ нь ip хэрэглэгчидтэй цуглуулах шинэ объект үүсгэж, тоолуурыг 1 -ээр нэмэгдүүлэх болно.

Дараа нь үүнийг буцааж вэб хуудсанд харуулна.

Тэнд танд IP хянах хит тоолуур байна.

Алхам 6: Блог

Би одоогоор програм хангамж, ухаалаг байшин, полароидын талаар өөрийн сонирхолд төвлөрсөн блог хөгжүүлэхийг хичээж байна. Тиймээс би блог хэсгийг үүсгэсэн. Блог нь статик html хуудас болон жолооны хүрээг ашигладаг. Блог хөтлөх ажлыг хөнгөвчлөхийн тулд илүү сайн технологийг судалсны дараа hugo ашиглан вэбсайтаа шинэчилсэн. Hugo бол статик html генератор юм. Би энэ талаар доор дурдсан хичээл дээр илүү дэлгэрэнгүй ярих болно.

Алхам 7: Дууссан

Та энд миний бөөрөлзгөнө pi дээр байршуулсан node.js вэбсайт дээрх гүнзгийрүүлсэн зааварчилгааг үзээрэй. Хэрэв танд асуулт, санал байвал доор үлдээнэ үү.

Энэ нь бусад хүмүүст тусална гэж найдаж байна.

Hugo ашиглан энэ сайтад өөрөөр хандахын тулд вэб хуудасны статик үүсгэгч миний бусад зааврыг үзнэ үү (удахгүй).