বেসিক এইচটিএমএল ভিউ রেন্ডার করবেন?


279

আমার কাছে একটি বেসিক নোড.জেএস অ্যাপ রয়েছে যা আমি এক্সপ্রেস ফ্রেমওয়ার্কটি ব্যবহার করে মাটি থেকে নামার চেষ্টা করছি। আমার আছে একটিviews ফোল্ডার আছে যেখানে আমার একটি index.htmlফাইল রয়েছে। ওয়েব ব্রাউজারটি লোড করার সময় আমি নিম্নলিখিত ত্রুটিটি পেয়েছি।

ত্রুটি: মডিউল 'এইচটিএমএল' খুঁজে পাওয়া যায় না

নীচে আমার কোড দেওয়া আছে।

var express = require('express');
var app = express.createServer();

app.use(express.staticProvider(__dirname + '/public'));

app.get('/', function(req, res) {
    res.render('index.html');
});

app.listen(8080, '127.0.0.1')

আমি এখানে কি মিস করছি?

উত্তর:


298

আপনার জাদে একটি সরল HTML পৃষ্ঠা অন্তর্ভুক্ত থাকতে পারে:

ভিউ / ইনডেক্স.জেডে

include plain.html

ভিউ / প্লেইন। html এ

<!DOCTYPE html>
...

এবং app.js এখনও জ্যাড রেন্ডার করতে পারে:

res.render(index)

1
কেবলমাত্র নোট করুন যে আমি যা চাই তা হ'ল কেবল একটি।
Html

1
আমরা কি এই পদ্ধতির সাথে একাধিক এইচটিএমএল / জেএস পৃষ্ঠাগুলি অন্তর্ভুক্ত করতে পারি?
ব্যবহারকারী 3398326

6
আপনি কেবলমাত্র এক্সপ্রেসের প্রাথমিক পরীক্ষার জন্য জেড টেম্পলেট ছাড়াই এইচটিএমএল পৃষ্ঠাটি রেন্ডার করতে সক্ষম হবেন না?
PositiveGuy

1
তাহলে কি আমাদের প্রতিটি এইচটিএমএল ফাইলের জন্য জেড টেম্পলেট তৈরি করতে হবে?
ক্রিস - জুন

4
সমাধানের চেয়ে হ্যাক বেশি of
ওজিল

226

এই উত্তরগুলির অনেকগুলি পুরানো।

এক্সপ্রেস 3.0.0 এবং 3.1.0 ব্যবহার করে, নিম্নলিখিত কাজ করে:

app.set('views', __dirname + '/views');
app.engine('html', require('ejs').renderFile);

এক্সপ্রেস 3.4+ এর জন্য বিকল্প বাক্য গঠন এবং ক্যাভ্যাটগুলির জন্য নীচের মন্তব্যগুলি দেখুন:

app.set('view engine', 'ejs');

তারপরে আপনি এর মতো কিছু করতে পারেন:

app.get('/about', function (req, res)
{
    res.render('about.html');
});

এটি ধরে নেয় viewsসাবফোল্ডারে আপনার মতামত রয়েছে এবং আপনি ejsনোড মডিউলটি ইনস্টল করেছেন । যদি তা না হয় তবে নোড কনসোলে নিম্নলিখিতটি চালান:

npm install ejs --save

@ মিশেলডৌসমান, চিয়ার্স, আমি উত্তরে সেই তথ্যটি অন্তর্ভুক্ত করেছি।
ড্রয় নোকস

কেন এই ক্ষেত্রে res.reender .html এক্সটেনশন প্রয়োজন তবে জেডের সাথে ডিফল্ট ক্ষেত্রে নয়। বয়লারপ্লেট কোড সহ, এটি কেবল রেস.রেন্ডারকে কল করে ('সূচক', {শিরোনাম: 'এক্সপ্রেস'}); তবে এখানে, এটি: res.render ('about.html');
অতিক্রম করা 21

6
এক্সপ্রেস ৩.৪.২ সহ: অ্যাপ.সেট ('ভিউ ইঞ্জিন', 'ইজেস');
Roland

3
তুমি তোমার package.json আপডেট করার জন্য 'ejs --save ইনস্টল npm' কম্যান্ড ব্যবহার করা উচিত
টম তৈমন

8
তোমার এজেএস লাগবে কেন?
PositiveGuy

71

এক্সপ্রেস.জেএস গাইড থেকে: রেন্ডারিং দেখুন

ফাইলের নামগুলি ফর্মটি দেখুন Express.ENGINE, যেখানে ENGINEমডিউলটির প্রয়োজন হবে। উদাহরণস্বরূপ ভিউটি layout.ejsভিউ সিস্টেমটিকে বলবেrequire('ejs') , লোড হওয়াexports.render(str, options) মডিউলটি এক্সপ্রেস মেনে চলার পদ্ধতিটি রফতানিapp.register() করতে হবে , তবে এক্সটেনশানগুলি ফাইল করার জন্য ইঞ্জিনগুলিকে মানচিত্র করতে ব্যবহার করা যেতে পারে, যাতে foo.htmlজেড দ্বারা উদাহরণস্বরূপ রেন্ডার করা যায়।

সুতরাং হয় আপনি নিজের সাধারণ রেন্ডারার তৈরি করেন বা আপনি কেবল জেড ব্যবহার করেন:

 app.register('.html', require('jade'));

আরো সম্পর্কে app.register

দ্রষ্টব্য যে এক্সপ্রেস 3 এ এই পদ্ধতির নাম পরিবর্তন করা হয়েছে app.engine


57
Note- app.register এক্সপ্রেস 3 নতুন নামকরণ app.engine হয়েছে
Spongeboy

8
অ্যান্ড্রু হোময়ারের উত্তর দেখুন। এটা আসল উত্তর।
ডেভিড বেটজ

7
অন্য কোনও উত্তর থেকে, এক্সপ্রেস 4 এর জন্য আমি ব্যবহার করে শেষ করেছিapp.engine('.html', require('ejs').renderFile);
CrazyPyro

এক্সপ্রেস 4 এ, আপনি এটিও ব্যবহার করতে পারেন: app.set ('ভিউ ইঞ্জিন', 'জ্যাড');
ড্যানিয়েল হুয়াং

48

আপনি এইচটিএমএল ফাইলটি পড়ে এটি পাঠাতেও পারেন:

app.get('/', (req, res) => {
    fs.readFile(__dirname + '/public/index.html', 'utf8', (err, text) => {
        res.send(text);
    });
});

23
এই সমাধানটি খারাপ কারণ ফাইলগুলির কোনও ক্যাশিং নেই; এটি প্রতিটি অনুরোধের জন্য পড়া হয়।
মার্সেল ফ্যালিয়ের

2
এটি ম্যানুয়ালি ক্যাশে করা সম্ভাব্যভাবে বেশ সহজ। কেবল পঠন ফাইলটি একটি ভেরিয়েবল সংরক্ষণ করুন এবং কেবলমাত্র পুনরায় পড়ুন, যদি সেই পরিবর্তনশীলটি ফাঁকা থাকে। আপনি একটি জেএস অবজেক্ট ব্যবহার করতে পারেন এবং টাইমস্ট্যাম্প সহ বিভিন্ন ফাইলগুলিকে বিভিন্ন ভেরিয়েবলে সঞ্চয় করতে পারেন। নিশ্চিত যে এটি বেশিরভাগ লোকের চেয়ে বেশি কাজ করবে তবে নোডে নতুন লোকের পক্ষে এটি ভাল। এটি বোঝা সহজ
নামান গোয়েল

5
বাবা। এটি কনভেনশন-ভিত্তিক, প্রবাহিত আর্কিটেকচারের পুরো পয়েন্টকে (এমভিসির মতো) পরাস্ত করে।
ডেভিড বেটজ

@ মার্সেলফ্যালিয়ের আপনি ধরে নিচ্ছেন যে তিনি ফাইলটি ক্যাশে করতে চান, বা তিনি কোনও কাস্টম ক্যাচিং সমাধান ব্যবহার করতে চান না। উত্তরের জন্য আপনি keegan3d ধন্যবাদ।
বেনি

@ মার্সেলফ্যালিয়ের তারপরে, সঠিক সমাধান কী? আমি অন্যান্য উত্তরগুলি দেখতে পাচ্ছি যাগুলি নির্ভর করে নতুন নির্ভরতা। এটি কেবল এইচটিএমএল ফাইল পরিবেশন করার জন্য প্রয়োজনীয়?
জে কার্লোসআর

45

এটা চেষ্টা কর. এটা আমার জন্য কাজ করে.

app.configure(function(){

  .....

  // disable layout
  app.set("view options", {layout: false});

  // make a custom html template
  app.register('.html', {
    compile: function(str, options){
      return function(locals){
        return str;
      };
    }
  });
});

....

app.get('/', function(req, res){
  res.render("index.html");
});

2
উপরের সঠিক কনফিগারেশনটিতে সমস্যা ছিল, তাই আমি ".html" থেকে ডটটি সরিয়ে এটিকে যুক্ত করেছি: app.set ('ভিউ ইঞ্জিন', 'এইচটিএমএল'); app.set ('দর্শন', __dirname + '/ ভিউ'); একটি নিখুঁত রেন্ডারের জন্য
বিজো ট্রাভাইল

8
এটি কিছুটা অদ্ভুত ... আপনার এইচটিএমএল স্ট্যাটিক ফাইল হিসাবে পরিবেশন করা উচিত। এটি আপনাকে আরও ভাল ক্যাচিংয়ের সুবিধাও দেয়। একটি কাস্টম "এইচটিএমএল সংকলক" তৈরি করা ভুল বলে মনে হচ্ছে। আপনাকে যদি কোনও রুটের মধ্যে থেকে কোনও ফাইল পাঠাতে হয় (যা আপনার খুব কমই করা দরকার) কেবল এটি পড়ুন এবং প্রেরণ করুন। অন্যথায় কেবল স্থির এইচটিএমএল এ পুনঃনির্দেশ করুন।
enyo

2
@ প্রত্যেকেই এই মন্তব্যটিকে বিজোড় বলে মনে হচ্ছে, আপনি যা বলছেন তা কীভাবে করা উচিত তা বিবেচনা করে জিজ্ঞাসা করা হচ্ছে প্রশ্ন, এবং আপনার উত্তরটি কেবল এটি করা। আপনি কীভাবে ক্যাচিং সহ একটি স্থির এইচটিএমএল পরিবেশন করবেন?
কিয়োটিক

3
আমি একটি ত্রুটি চালু আছে app.register। সম্ভবত এটি এক্সপ্রেস 3.0.0.rc3 এ অবচয় করা হয়েছে? TypeError: Object function app(req, res){ app.handle(req, res); } has no method 'register'
ড্র নোকস

1
@ ইনিও, আপনি বাষ্পীভূত স্থাপত্যের বিন্দুটি মিস করেছেন। যখন প্যাটার্নটি নিয়ামক / দর্শন (বা / প্রসেসর / ভিউ, আপনার নির্দিষ্ট আর্কিটেকচার যাই হোক না কেন), আপনি এক্সটেনশনের অপ্রচলিত মডেলের সাহায্যে এ থেকে বিচ্যুত করতে পারবেন না। আপনার এইচটিএমএলকে অন্য কিছুর মতো রেন্ডারযুক্ত সামগ্রী হিসাবে বিবেচনা করা দরকার। এটা শুকনো, বন্ধু।
ডেভিড বেটজ

22
app.get('/', function (req, res) {
res.sendfile(__dirname + '/public/index.html');
});

5
প্রযোজন ফাইলে উত্পাদন মোডে ক্যাশে হয় না তাই এটি ভাল সমাধান নয়।
টিও চুং পিং

1
@ সিমুরকেকস দয়া করে আমাকে ভুল করলে দয়া করে আমাকে সংশোধন করুন, তবে আমার কাছে মনে হয় সেন্ডফিল এখন ক্যাশে সমর্থন করে: devdocs.io/express/index#res.sendFile
খোফি ফিলি

19

আপনি যদি এক্সপ্রেস@~৩.০.০ ব্যবহার করছেন তবে আপনার উদাহরণ থেকে নীচের লাইনটি পরিবর্তন করুন:

app.use(express.staticProvider(__dirname + '/public'));

এই জাতীয় কিছু:

app.set("view options", {layout: false});
app.use(express.static(__dirname + '/public'));

এক্সপ্রেস এপিআই পৃষ্ঠায় বর্ণিত হিসাবে আমি এটি তৈরি করেছি এবং এটি কবজির মতো কাজ করে। এই সেটআপের সাথে আপনাকে অতিরিক্ত কোড লিখতে হবে না যাতে এটি আপনার মাইক্রো উত্পাদন বা পরীক্ষার জন্য ব্যবহার করা যথেষ্ট সহজ হয়ে যায়।

সম্পূর্ণ কোড নীচে তালিকাভুক্ত:

var express = require('express');
var app = express.createServer();

app.set("view options", {layout: false});
app.use(express.static(__dirname + '/public'));

app.get('/', function(req, res) {
    res.render('index.html');
});

app.listen(8080, '127.0.0.1')

1
আপনি app.use(express.static(__dirname + '/public'));সার্ভারটি চালু করার পরে কেন পুনরাবৃত্তি করবেন app.listen?
ফতুহোকু

2
এইচটিএমএল পৃষ্ঠাটিকে স্থির বনাম হিসাবে পরিবেশন করার ভিন্নতা কী? কেবল প্রকাশের সাথে এটি অ-স্থিতিশীলভাবে লোড করা হয়?
PositiveGuy

14

আমিও একই সমস্যার মুখোমুখি হয়েছি express 3.Xএবং node 0.6.16। উপরের প্রদত্ত সমাধানটি সর্বশেষ সংস্করণে কাজ করবে না express 3.x। তারা app.registerপদ্ধতিটি এবং app.engineপদ্ধতি যুক্ত করেছে। যদি আপনি উপরের সমাধানটি চেষ্টা করে থাকেন তবে আপনি নিম্নলিখিত ত্রুটিটি দিয়ে শেষ করতে পারেন।

node.js:201
        throw e; // process.nextTick error, or 'error' event on first tick
              ^
TypeError: Object function app(req, res){ app.handle(req, res); } has no method 'register'
    at Function.<anonymous> (/home/user1/ArunKumar/firstExpress/app.js:37:5)
    at Function.configure (/home/user1/ArunKumar/firstExpress/node_modules/express/lib/application.js:399:61)
    at Object.<anonymous> (/home/user1/ArunKumar/firstExpress/app.js:22:5)
    at Module._compile (module.js:441:26)
    at Object..js (module.js:459:10)
    at Module.load (module.js:348:31)
    at Function._load (module.js:308:12)
    at Array.0 (module.js:479:10)
    at EventEmitter._tickCallback (node.js:192:40)

ত্রুটি বার্তা থেকে মুক্তি পেতে। নিম্নলিখিতটি আপনার লাইনে যুক্ত করুনapp.configure function

app.engine('html', require('ejs').renderFile);

দ্রষ্টব্য: আপনাকে ejsটেমপ্লেট ইঞ্জিন ইনস্টল করতে হবে

npm install -g ejs

উদাহরণ:

app.configure(function(){

  .....

  // disable layout
  app.set("view options", {layout: false});

  app.engine('html', require('ejs').renderFile);

....

app.get('/', function(req, res){
  res.render("index.html");
});

দ্রষ্টব্য: সহজ সমাধান হ'ল ইঞ্জিন হিসাবে ejs টেমপ্লেটটি ব্যবহার করা। সেখানে আপনি * .জেস ফাইলগুলিতে কাঁচা এইচটিএমএল লিখতে পারেন।


3
আপনার কি ejsবিশ্বব্যাপী ইনস্টল করতে হবে ?
ড্রয় নোকস

এটি আমাকে বলুন এটি 'index.html' ফাইলটি খুঁজে
পাচ্ছে না

9

ফোল্ডার কাঠামো:

.
├── index.html
├── node_modules
   ├──{...}
└── server.js

server.js

var express = require('express');
var app = express();

app.use(express.static('./'));

app.get('/', function(req, res) {
    res.render('index.html');
});

app.listen(8882, '127.0.0.1')

index.html

<!DOCTYPE html>
<html>
<body>

<div> hello world </div>

</body>
</html>

আউটপুট:

ওহে বিশ্ব


7

আপনার যদি ভিউ ডিরেক্টরিটি ব্যবহার করতে না চান তবে এইচটিএমএল ফাইলগুলিকে নীচে সর্বজনীন ডিরেক্টরিতে সরান ।

এবং তারপরে, এই লাইনটিকে '/ ভিউ'-এর পরিবর্তে অ্যাপ-কনফিগারে যুক্ত করুন।

সার্ভার.উজ (এক্সপ্রেস.স্ট্যাটিক (__ ডায়ারনেম + '/ পাবলিক'));

5

নোডে এইচটিএমএল পৃষ্ঠাটি রেন্ডার করতে নিম্নলিখিত চেষ্টা করে দেখুন,

app.set('views', __dirname + '/views');

app.engine('html', require('ejs').renderFile);
  • আপনাকে লাইক ejsদিয়ে মডিউল ইনস্টল করতে হবে npm:

       npm install ejs --save

এই সমাধানটি আমার পক্ষে কাজ করেছিল। যদিও আমি স্থির বিকল্পটি চেষ্টা করেছিলাম tried আপনি কি এর পেছনের প্রক্রিয়াটি ব্যাখ্যা করতে পারেন? ধন্যবাদ!
হার্শাদ

4

আমার প্রকল্পের জন্য আমি এই কাঠামোটি তৈরি করেছি:

index.js
css/
    reset.css
html/
    index.html

এই কোডটি /অনুরোধের জন্য সূচক /css/reset.css। যথেষ্ট সহজ, এবং সর্বোত্তম অংশটি হ'ল এটি স্বয়ংক্রিয়ভাবে ক্যাশে শিরোনাম যুক্ত করে

var express = require('express'),
    server = express();

server.configure(function () {
    server.use('/css', express.static(__dirname + '/css'));
    server.use(express.static(__dirname + '/html'));
});

server.listen(1337);

3

1) সর্বোত্তম উপায় হ'ল স্থির ফোল্ডার সেট করা। আপনার মূল ফাইলে (app.js | server.js | ???):

app.use(express.static(path.join(__dirname, 'public')));

পাবলিক / সিএসএস / ফর্ম। html পাবলিক / সিএসএস / স্টাইল।
CSS

তারপরে আপনি "পাবলিক" ফোল্ডার থেকে স্থির ফাইল পেয়েছেন:

http://YOUR_DOMAIN/form.html
http://YOUR_DOMAIN/css/style.css

2)

আপনি নিজের ফাইল ক্যাশে তৈরি করতে পারেন।
Fs.readFileSync পদ্ধতি ব্যবহার করুন

var cache = {};
cache["index.html"] = fs.readFileSync( __dirname + '/public/form.html');

app.get('/', function(req, res){    
    res.setHeader('Content-Type', 'text/html');
    res.send( cache["index.html"] );                                
};);

খারাপ না! এখানে একটি সম্পূর্ণ ফাইল ডেমো! https://gist.github.com/xgqfrms-GitHub/7697d5975bdffe8d474ac19ef906e906
xgqfrms

3

এক্সপ্রেস 4.0.০.০ এর সাথে আপনাকে কেবল একটাই করতে হবে অ্যাপ.জেজে 2 লাইনের মন্তব্য:

/* app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'jade'); */ //or whatever the templating engine is.

এবং তারপরে আপনার স্ট্যাটিক ফাইলটিকে / পাবলিক ডিরেক্টরিতে ফেলে দিন। উদাহরণ: /public/index.html


3

আমি 2 লাইনের নিচে যুক্ত করেছি এবং এটি আমার পক্ষে কাজ করে

    app.set('view engine', 'html');
    app.engine('html', require('ejs').renderFile);

এটি আমাকে নিম্নোক্ত ত্রুটিটি দেয় "ত্রুটি: ফাংশন.মডিউল._স্রেসফিলিউম (মডিউল.জেএস: 338: 15) এ মডিউল 'ইজেস' খুঁজে পাওয়া যায় না। মডিউল.আরলোড (মডিউল.জেএস: 280: 25) মডিউল.রেকায়ারে ( মডিউল.জেএস: 364: 17) এ প্রয়োজনীয় (মডিউল.জেএস: 380: 17) "
লিগব অরগ

@ লাইগুবআর্গ npm install ejs --saveআপনার কার্যনির্বাহী ডিরেক্টরিতে চালিত হন।
আরপুন

1
কেবলমাত্র এইচটিএমএল ফাইল পরিবেশন করার জন্য কি নির্ভরতা যুক্ত করা দরকার?
জ্যাকার্লোসআর

3

এক্সপ্রেস রুটে res.sendFile () ফাংশন চেষ্টা করুন।

var express = require("express");
var app     = express();
var path    = require("path");


app.get('/',function(req,res){
  res.sendFile(path.join(__dirname+'/index.html'));
  //__dirname : It will resolve to your project folder.
});

app.get('/about',function(req,res){
  res.sendFile(path.join(__dirname+'/about.html'));
});

app.get('/sitemap',function(req,res){
  res.sendFile(path.join(__dirname+'/sitemap.html'));
});

app.listen(3000);

console.log("Running at Port 3000");

এখানে পড়ুন: http://codeforgeek.com/2015/01/render-html-file-expressjs/


3

আমি কেবল একটি এইচটিএমএল ফাইল সরবরাহ করার জন্য এজের উপর নির্ভর করতে চাইনি, তাই আমি কেবল ছোট রেন্ডারার নিজেই লিখেছিলাম:

const Promise = require( "bluebird" );
const fs      = Promise.promisifyAll( require( "fs" ) );

app.set( "view engine", "html" );
app.engine( ".html", ( filename, request, done ) => {
    fs.readFileAsync( filename, "utf-8" )
        .then( html => done( null, html ) )
        .catch( done );
} );

2

আমি একটি এক্সপ্রেস RESTful এপিআই সহ একটি কৌণিক অ্যাপ সেট আপ করার চেষ্টা করছিলাম এবং সহায়ক না হলেও এটি একাধিকবার এই পৃষ্ঠায় অবতরণ করেছি। আমি যে কাজটি পেয়েছি তা এখানে:

app.configure(function() {
    app.use(express.static(__dirname + '/public'));         // set the static files location
    app.use(express.logger('dev'));                         // log every request to the console
    app.use(express.bodyParser());                          // pull information from html in POST
    app.use(express.methodOverride());                      // simulate DELETE and PUT
    app.use(express.favicon(__dirname + '/public/img/favicon.ico'));
});

তারপরে আপনার এপিআই রুটের কলব্যাকটি দেখতে দেখতে: res.jsonp(users);

আপনার ক্লায়েন্টের পাশের কাঠামোটি রাউটিং পরিচালনা করতে পারে। এক্সপ্রেস হল এপিআই পরিবেশনার জন্য।

আমার বাড়ির রুটটি এমন দেখাচ্ছে:

app.get('/*', function(req, res) {
    res.sendfile('./public/index.html'); // load the single view file (angular will handle the page changes on the front-end)
});


2

এক্সপ্রেস সার্ভারের একটি সম্পূর্ণ ফাইল ডেমো এখানে!

https://gist.github.com/xgqfrms-GitHub/7697d5975bdffe8d474ac19ef906e906

আশা করি এটি আপনার পক্ষে সাহায্য করবে!

// simple express server for HTML pages!
// ES6 style

const express = require('express');
const fs = require('fs');
const hostname = '127.0.0.1';
const port = 3000;
const app = express();

let cache = [];// Array is OK!
cache[0] = fs.readFileSync( __dirname + '/index.html');
cache[1] = fs.readFileSync( __dirname + '/views/testview.html');

app.get('/', (req, res) => {
    res.setHeader('Content-Type', 'text/html');
    res.send( cache[0] );
});

app.get('/test', (req, res) => {
    res.setHeader('Content-Type', 'text/html');
    res.send( cache[1] );
});

app.listen(port, () => {
    console.log(`
        Server is running at http://${hostname}:${port}/ 
        Server hostname ${hostname} is listening on port ${port}!
    `);
});


1

নিম্নলিখিত কোডগুলি আপনার কোডে যুক্ত করুন

  1. "জেড" কে "ejs" এবং "XYZ" (সংস্করণ) এর সাথে "*" প্যাকেজ.জসন ফাইলের সাথে প্রতিস্থাপন করুন

      "dependencies": {
       "ejs": "*"
      }
  2. তারপরে আপনার app.js এ ফাইলটিতে নিম্নলিখিত কোড যুক্ত করুন:

    app.engine('html', require('ejs').renderFile);

    app.set('view engine', 'html');

  3. এবং ফোল্ডারে ভিউতে সমস্ত। এইচটিএমএল ফাইলগুলি রাখুন

চিয়ার্স :)


1

সরল এইচটিএমএল এর জন্য আপনার কোনও এনপিএম প্যাকেজ বা মিডওয়্যারের প্রয়োজন নেই

শুধু এটি ব্যবহার করুন:

app.get('/', function(req, res) {
    res.sendFile('index.html');
});

1

এটি অত্যন্ত দু: খজনক যে এটি প্রায় ২০২০ এর মত প্রকাশের পরেও অবজেক্টের sendFileপদ্ধতি ব্যবহার না করে কোনও HTML পৃষ্ঠার রেন্ডার করার কোনও উপায় যোগ করেনি response। ব্যবহার sendFileকরা কোনও সমস্যা নয় তবে আকারে এটির পক্ষে যুক্তিটি পাস করা path.join(__dirname, 'relative/path/to/file')সঠিক মনে হয় না। কোনও ব্যবহারকারীকে __dirnameফাইলের পথে কেন যোগ দেওয়া উচিত ? এটি ডিফল্টরূপে করা উচিত। সার্ভারের মূলটি প্রকল্প ডিরেক্টরিটি ডিফল্ট করে কেন হতে পারে না? এছাড়াও, একটি স্থির HTML ফাইল রেন্ডার করার জন্য একটি টেম্প্লেটিং নির্ভরতা ইনস্টল করা আবার সঠিক নয়। আমি সমস্যাটি মোকাবেলার সঠিক উপায়টি জানি না, তবে যদি আমাকে কোনও স্থির এইচটিএমএল পরিবেশন করতে হয় তবে আমি এই জাতীয় কিছু করব:

const PORT = 8154;

const express = require('express');
const app = express();

app.use(express.static('views'));

app.listen(PORT, () => {
    console.log(`Server is listening at port http://localhost:${PORT}`);
});

উপরের উদাহরণটি ধরে নেওয়া হয়েছে যে প্রকল্প কাঠামোর একটি viewsডিরেক্টরি রয়েছে এবং এটির মধ্যে স্থির এইচটিএমএল ফাইল রয়েছে। উদাহরণস্বরূপ, ধরা যাক, viewsডিরেক্টরিটিতে দুটি HTML ফাইলের নাম রয়েছে index.htmlএবং about.htmlতারপরে অ্যাক্সেসের জন্য, আমরা পরিদর্শন করতে পারি: localhost:8153/index.htmlবা কেবল পৃষ্ঠাটি localhost:8153/লোড করতে index.htmlএবং localhost:8153/about.htmlলোড করতে about.htmlviewsডিরেক্টরিতে নিদর্শনগুলি সংরক্ষণ করে বা কেবলমাত্র ডিফল্ট dist/<project-name>ডিরেক্টরি ব্যবহার করে এবং সার্ভারের জেএসে নিম্নলিখিত রূপে এটি কনফিগার করে আমরা একটি প্রতিক্রিয়া / কৌণিক অ্যাপ্লিকেশন পরিবেশন করতে অনুরূপ পন্থা ব্যবহার করতে পারি :

app.use(express.static('dist/<project-name>'));

0

আমি অনুরোধগুলি "/" কে এক্সপ্রেস রুটে পরিচালনা করার মঞ্জুরি দিতে চেয়েছিলাম যেখানে তারা স্ট্যাটিক্স মিডলওয়্যার দ্বারা পরিচালিত হয়েছিল। এটি আমাকে সূচিপত্রের HTML নিয়মিত সংস্করণ বা অ্যাপ্লিকেশন সেটিংসের উপর নির্ভর করে জড়িত + মিনিফাইড জেএস এবং সিএসএস লোড করা এমন একটি সংস্করণ রেন্ডার করতে দেয়। অ্যান্ড্রু হোময়ারের উত্তরে অনুপ্রাণিত হয়ে , আমি সিদ্ধান্ত নিয়েছি যে আমার এইচটিএমএল ফাইলগুলি - অশোধিত - একটি ভিউ ফোল্ডারে টেনে আনুন, এক্সপ্রেসটি কনফিগার করুন

   app.engine('html', swig.renderFile);
   app.set('view engine', 'html');
   app.set('views', __dirname + '/views');  

এবং এর মতো একটি রুট হ্যান্ডলার তৈরি করেছে

 app.route('/')
        .get(function(req, res){
            if(config.useConcatendatedFiles){
                return res.render('index-dist');
            }
            res.render('index');       
        });

এটি বেশ ভাল কাজ করেছে।


0

সার্ভার.জেজে, দয়া করে অন্তর্ভুক্ত করুন

var express = require("express");
var app     = express();
var path    = require("path");


app.get('/',function(req,res){
  res.sendFile(path.join(__dirname+'/index.html'));
  //__dirname : It will resolve to your project folder.
});

0

আপনি যদি এমন কোনও এইচটিএমএল ফাইল পরিবেশন করার চেষ্টা করছেন যা এর মধ্যে ইতিমধ্যে এর সমস্ত সামগ্রী রয়েছে তবে এটির 'রেন্ডার' করার দরকার নেই, এটি কেবল 'পরিবেশিত' হওয়া দরকার। রেন্ডারিং হ'ল যখন আপনার ব্রাউজারে পৃষ্ঠাটি প্রেরণের আগে সার্ভার আপডেট থাকে বা কন্টেন্ট ইনজেক্ট করা হয় এবং অন্যান্য উত্তরগুলি দেখায় এটির জন্য এজেএস এর মতো অতিরিক্ত নির্ভরতা প্রয়োজন।

আপনি যদি কেবল ব্রাউজারকে তাদের অনুরোধের ভিত্তিতে কোনও ফাইলের দিকে পরিচালিত করতে চান তবে আপনার পুনরায় res.sendFile () ব্যবহার করা উচিত :

const express = require('express');
const app = express();
var port = process.env.PORT || 3000; //Whichever port you want to run on
app.use(express.static('./folder_with_html')); //This ensures local references to cs and js files work

app.get('/', (req, res) => {
  res.sendFile(__dirname + '/folder_with_html/index.html');
});

app.listen(port, () => console.log("lifted app; listening on port " + port));

এইভাবে আপনাকে এক্সপ্রেস ছাড়াও অতিরিক্ত নির্ভরতা লাগবে না। আপনি যদি সার্ভারটি ইতিমধ্যে তৈরি করা এইচটিএমএল ফাইলগুলি প্রেরণ করতে চান তবে উপরেরটি এটি করার জন্য খুব হালকা উপায়।


0

index.js

var express = require('express');
var app = express();
app.use(express.static(__dirname + '/public'));


app.get('/', function(req, res) {
    res.render('index.html');
});


app.listen(3400, () => {
    console.log('Server is running at port 3400');
})

আপনার index.html ফাইলটিকে সর্বজনীন ফোল্ডারে রাখুন

<!DOCTYPE html>
<html>
<head>
    <title>Render index html file</title>
</head>
<body>
    <h1> I am from public/index.html </h1>
</body>
</html>

এখন আপনার টার্মিনালে নিম্নলিখিত কোডটি চালান

নোড সূচক.জেএস


-1

আমি সাধারণত এটি ব্যবহার করি

app.configure(function() {
    app.use(express.static(__dirname + '/web'));
});

কেবল সাবধান হন কারণ এটি / ওয়েব ডিরেক্টরিতে যে কোনও কিছু ভাগ করে নেবে।

আমি আসা করি এটা সাহায্য করবে


-2

আপনি যদি node.js এ এক্সপ্রেস ফ্রেমওয়ার্ক ব্যবহার করেন

এনপিএম এজেএস ইনস্টল করুন

তারপরে কনফিগারেশন ফাইল যুক্ত করুন

app.set('port', process.env.PORT || 3000);
app.set('views', __dirname + '/views');
app.set('view engine', 'ejs');
app.set('view engine', 'jade');
app.use(express.favicon());
app.use(express.logger('dev'));
app.use(express.bodyParser());
app.use(express.methodOverride());
app.use(app.router)

;

রফতানি মডিউল form.js থেকে পৃষ্ঠাটি রেন্ডার করুন ejs ফাইলের নামটি এক্সটেনশন সহ ভিউ দির মধ্যে এইচটিএমএল ফাইল রয়েছে form.html.ejs

তারপরে form.js তৈরি করুন

res.render('form.html.ejs');


এই গন্ডগোল কি?
বিঘ্নেশ রাউত
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.