मूल HTML दृश्य रेंडर करें

279

मेरे पास एक मूल नोड.जेएस ऐप है जिसे मैं एक्सप्रेस फ्रेमवर्क का उपयोग करके जमीन से हटाने की कोशिश कर रहा हूं। मेरे पास एक viewsफ़ोल्डर है जहाँ मेरे पास एक index.htmlफ़ाइल है। लेकिन वेब ब्राउजर को लोड करते समय मुझे निम्न त्रुटि प्राप्त होती है।

त्रुटि: मॉड्यूल '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')

मुझे यहां क्या समझ नहीं आ रहा है?

javascript  html  node.js  mongodb  express 
— aherrick
स्रोत

जवाबों:

298

आप एक सादे HTML पृष्ठ में जेड शामिल कर सकते हैं:

विचारों में / index.jade

include plain.html

विचारों में / सादे। html

<!DOCTYPE html>
...

और app.js अभी भी जेड प्रदान कर सकते हैं:

res.render(index)
— एंड्रयू Homeyer
स्रोत
1
बस ध्यान दें कि मैं जो चाहता था वह केवल एक। Html फ़ाइल की सेवा के लिए था क्योंकि मेरा ऐप सिंगल पेज था;)
— डायोसनी
1
क्या हम इस विधि के साथ कई HTML / JS पृष्ठ शामिल कर सकते हैं?
— user3398326
6
क्या आप एक्सप्रेस के शुरुआती परीक्षण के लिए जेड पेज को बिना जेड टेम्पलेट के रेंडर करने में सक्षम नहीं होना चाहिए?
— PositiveGuy
1
तो क्या हमें अपनी प्रत्येक HTML फाइल के लिए जेड टेम्पलेट बनाना होगा?
— क्रिस - जूनियर
4
एक समाधान के बजाय एक हैक का अधिक।
— ओजिल
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
— आकर्षित नोक
स्रोत
@MichaelDausmann, चीयर्स, मैंने उस जानकारी को उत्तर में शामिल किया है।
— ड्रू नोक
इस मामले में res.render को .html एक्सटेंशन की आवश्यकता क्यों है लेकिन जेड के साथ डिफ़ॉल्ट केस में नहीं। बॉयलरप्लेट कोड के साथ, यह सिर्फ res.render ('इंडेक्स', {शीर्षक: 'एक्सप्रेस'}) कहता है; लेकिन यहाँ, यह है: res.render ('about.html');
— ट्रान्सेंडेंस
6
एक्सप्रेस 3.4.2 के साथ: app.set ('व्यू इंजन', 'ejs');
— रोलैंड
3
आपको अपने पैकेज को अपडेट करने के लिए कमांड 'npm install ejs --save' का उपयोग करना चाहिए। Json
— Tom Teman
8
आपको ईजे की आवश्यकता क्यों है?
— पॉजिटिव
71

Express.js गाइड से: रेंडरिंग देखें

देखें फ़ाइल नाम प्रपत्र लेते हैं 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
नोट- app.register का नाम बदलकर app.engine in Express 3 कर दिया गया है
— Spongeboy
8
एंड्रयू Homeyer से जवाब देखें। यह वास्तविक उत्तर है।
— डेविड बेट्ज़
7
कुछ अन्य जवाब से, एक्सप्रेस 4 के लिए मैं का उपयोग कर समाप्त हो गयाapp.engine('.html', require('ejs').renderFile);
— CrazyPyro
एक्सप्रेस 4 में, आप भी इस्तेमाल कर सकते हैं: app.set ('व्यू इंजन', 'जेड');
— डैनियल हुआंग
48

आप HTML फ़ाइल भी पढ़ सकते हैं और उसे भेज सकते हैं:

app.get('/', (req, res) => {
    fs.readFile(__dirname + '/public/index.html', 'utf8', (err, text) => {
        res.send(text);
    });
});
— keegan3d
स्रोत
23
यह समाधान खराब है क्योंकि फाइलों का कोई कैशिंग नहीं; यह हर अनुरोध के लिए पढ़ा जाता है।
— मार्सेल फॉलिएर
2
इसके संभावित रूप से इसे आसानी से कैश करना आसान है। बस रीड फ़ाइल को एक वैरिएबल स्टोर करें, और केवल फिर से पढ़ें, यदि वह वैरिएबल खाली है। आप जेएस ऑब्जेक्ट का उपयोग भी कर सकते हैं और विभिन्न चर में विभिन्न फ़ाइलों को स्टोर कर सकते हैं, टाइमस्टैम्प के साथ। यकीन है कि ज्यादातर लोगों की तुलना में इसका अधिक काम होगा, लेकिन यह नए लोगों के साथ नोड के लिए अच्छा है। यह समझना आसान है
— नमन गोयल
5
ओह। यह सम्मेलन-उन्मुख, सुव्यवस्थित आर्किटेक्चर (जैसे एमवीसी) के पूरे बिंदु को पराजित करता है।
— डेविड बेट्ज़
@MarcelFalliere आप मान रहे हैं कि वह फ़ाइल को कैश करना चाहता है, या कि वह कस्टम कैशिंग समाधान का उपयोग नहीं करना चाहता है। उत्तर के लिए धन्यवाद keegan3d।
— बेनी
@MarcelFalliere फिर, सही समाधान क्या है? मुझे अन्य उत्तर दिखाई देते हैं जो नई निर्भरता की आवश्यकता होती है। क्या यह केवल HTML फ़ाइलों की सेवा के लिए आवश्यक है?
— JCarlosR
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 ('view engine', 'html'); app.set ('विचार', __dirname + '/ views'); एक आदर्श के लिए प्रस्तुत करना
— टूम Trouvaille
8
यह थोड़ा अजीब है ... आपको स्थैतिक फ़ाइलों के रूप में HTML की सेवा करनी चाहिए। इससे आपको बेहतर कैशिंग का लाभ भी मिलता है। एक कस्टम "html संकलक" बनाना गलत लगता है। यदि आपको किसी रूट के भीतर से फ़ाइल भेजने की आवश्यकता है (जिसे आपको बहुत कम करने की आवश्यकता है) तो बस पढ़ें और भेजें। अन्यथा केवल स्थैतिक html पर पुनर्निर्देशित।
— enyo
2
@ यह टिप्पणी अजीब लग रही है, पर विचार करने के लिए कि आप जो कह रहे हैं वह कैसे करना चाहिए यह प्रश्न पूछा जा रहा है, और आपका जवाब सिर्फ यह करना है। आप कैशिंग के साथ एक स्थिर HTML कैसे सेवा करते हैं?
— कीयोटिक
3
मुझे एक त्रुटि दिखाई दे रही है app.register। शायद यह 3.0.0.rc3 एक्सप्रेस में पदावनत किया गया है? TypeError: Object function app(req, res){ app.handle(req, res); } has no method 'register'
— ड्रू नोक
1
@enyo, आप भाप से ढके वास्तुकला के बिंदु से चूक गए। जब पैटर्न नियंत्रक / दृश्य (या / प्रोसेसर / दृश्य, जो भी आपकी विशिष्ट वास्तुकला है), आप एक्सटेंशन के अप्रचलित मॉडल के साथ उस से विचलन नहीं कर सकते। आपको अपने HTML को अन्य सभी की तरह प्रदान की गई सामग्री के रूप में व्यवहार करना होगा। यह सूखी रहो, दोस्त।
— डेविड बेट्ज़
22 
app.get('/', function (req, res) {
res.sendfile(__dirname + '/public/index.html');
});
— सिर का इशारा
स्रोत
5
Sendfile उत्पादन मोड में कैश नहीं है इसलिए यह एक अच्छा समाधान नहीं है।
— तेओ च्योंग पिंग
1
@SeymourCakes अगर मैं गलत हूँ तो कृपया मुझे सही करें, लेकिन मुझे लगता है कि sendFile अब कैशिंग का समर्थन करता है: devdocs.io/express/index#res.sendFile
— KhoPhi
19

यदि आप express@~3.0.0 का उपयोग कर रहे हैं तो अपने उदाहरण से नीचे की रेखा बदलें:

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
html पेज को स्टेटिक के रूप में परोसने में क्या अंतर है? इसे एक्सप्रेस के साथ नॉन-स्टैटिक लोड करना है?
— 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 टेम्पलेट का उपयोग दृश्य इंजन के रूप में करना। वहाँ आप * .ejs फ़ाइलों को देखने में कच्चे HTML लिख सकते हैं।

— जैक
स्रोत
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>

उत्पादन:

नमस्ते दुनिया

— KARTHIKEYAN.A
स्रोत
7

यदि आपको दृश्य निर्देशिका का उपयोग करने की आवश्यकता नहीं है , तो बस नीचे दी गई सार्वजनिक निर्देशिका में HTML फ़ाइलों को स्थानांतरित करें।

और फिर, इस लाइन को '/ views' के बजाय app.configure में जोड़ें।

server.use (express.static (__ dirname + '/ public'));
— स्पेक्ट्रम
स्रोत
5

नोड में Html पेज रेंडर करने के लिए निम्नलिखित प्रयास करें,

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

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

  • आपको इसके ejsमाध्यम से मॉड्यूल स्थापित करने की आवश्यकता है npm:

       npm install ejs --save
— ट्रोजन
स्रोत
इस समाधान ने मेरे लिए काम किया। हालांकि मैंने स्थिर विकल्प की भी कोशिश की। क्या आप इसके पीछे के तंत्र की व्याख्या कर सकते हैं। धन्यवाद!
— हरशाद
4

मेरी परियोजना के लिए मैंने यह संरचना बनाई है:

index.js
css/
    reset.css
html/
    index.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);
— Znarkus
स्रोत
3

1) सबसे अच्छा तरीका है स्थैतिक फ़ोल्डर सेट करें। आपकी मुख्य फ़ाइल में (app.js | server.js | ???):

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

public / css / form.html
सार्वजनिक / css / style.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.0 के साथ, केवल एक चीज जो आपको करनी है, वह है 2 पंक्तियों को app.js में टिप्पणी करें:

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

और फिर अपनी स्थिर फ़ाइल को / सार्वजनिक निर्देशिका में छोड़ दें। उदाहरण: /public/index.html

— u84six
स्रोत
3

मैंने 2 लाइन से नीचे जोड़ा और यह मेरे लिए काम करता है

    app.set('view engine', 'html');
    app.engine('html', require('ejs').renderFile);
— नरेन चेजारा
स्रोत
यह मुझे निम्न त्रुटि देता है "त्रुटि: फ़ंक्शन नहीं पा सकता है। मॉड्यूल 'ejs' को Function.Module._resolveFilename (मॉड्यूल.js: 338: 15) फ़ंक्शन में दें। मॉड्यूल। लोड (मॉड्यूल। जेएस: 280): 25) मॉड्यूल। जेएस: 364: 17) की आवश्यकता पर (मॉड्यूल। जेएस: 380: 17) "
— लाइगब ऑर्ग
@LygubOrg npm install ejs --saveआपकी कार्यशील निर्देशिका में चलता है।
— A1rPun
1
क्या html फ़ाइल को सेवित करने के लिए केवल निर्भरता जोड़ना आवश्यक है?
— JCarlosR
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

मैं केवल HTML फ़ाइल वितरित करने के लिए ईजे पर निर्भर नहीं रहना चाहता था, इसलिए मैंने केवल छोटे रेंडरर को खुद लिखा है:

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}!
    `);
});
स्निपेट का विस्तार करें

— xgqfrms
स्रोत
1

अपने कोड में निम्नलिखित लाइन्स जोड़ें

  1. पैकेज में "ej" और "XYZ" (संस्करण) के साथ "जेड" बदलें।

      "dependencies": {
   "ejs": "*"
  }

  2. फिर अपने app.js फ़ाइल में निम्नलिखित कोड जोड़ें:

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

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

  3. और याद रखें फ़ोल्डर में सभी। HTML फाइलें रखें

चियर्स :)

— अमूल्य कश्यप
स्रोत
1

सादे HTML के लिए आपको किसी भी npm पैकेज या मिडलवेयर की आवश्यकता नहीं है

बस इसका उपयोग करें:

app.get('/', function(req, res) {
    res.sendFile('index.html');
});
— शिवम छेत्री
स्रोत
1

यह बहुत दुख की बात है कि यह 2020 के बारे में है फिर भी एक्सप्रेस ने ऑब्जेक्ट के sendFileतरीके का उपयोग किए बिना HTML पेज को रेंडर करने का एक तरीका नहीं जोड़ा है response। का उपयोग करना sendFileएक समस्या नहीं है, लेकिन तर्क के रूप में इसे पारित करना path.join(__dirname, 'relative/path/to/file')सही नहीं लगता है। उपयोगकर्ता __dirnameको फ़ाइल पथ में क्यों शामिल होना चाहिए ? यह डिफ़ॉल्ट रूप से किया जाना चाहिए। प्रोजेक्ट डायरेक्टरी को डिफाल्ट करके सर्वर का रूट क्यों नहीं हो सकता? इसके अलावा, एक स्थिर HTML फ़ाइल रेंडर करने के लिए सिर्फ एक अस्थायी निर्भरता स्थापित करना फिर से सही नहीं है। मुझे समस्या से निपटने का सही तरीका नहीं पता है, लेकिन अगर मुझे एक स्थिर 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निर्देशिका है और स्थिर HTML फाइलें इसके अंदर हैं। उदाहरण के लिए, मान लीजिए कि, चलो viewsनामक निर्देशिका दो HTML फ़ाइलों है index.htmlऔर about.html:, तो उपयोग करने के लिए उन्हें, हम यात्रा कर सकते हैं localhost:8153/index.htmlया सिर्फ localhost:8153/लोड करने के लिए index.htmlपेज और localhost:8153/about.htmlलोड करने के लिए about.html। हम viewsनिर्देशिका में कलाकृतियों को संग्रहीत करके या केवल डिफ़ॉल्ट 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

Server.js में, कृपया शामिल करें

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

यदि आप एक ऐसी HTML फ़ाइल परोसने का प्रयास कर रहे हैं, जिसमें ALREADY की सामग्री इसके अंदर मौजूद है, तो इसे 'रेंडर' करने की आवश्यकता नहीं है, इसे केवल 'सर्व' करने की आवश्यकता है। रेंडरिंग तब होता है जब आपके पास सर्वर अपडेट होता है या पेज पर ब्राउज़र को भेजे जाने से पहले कंटेंट को इंजेक्ट किया जाता है, और इसके लिए अतिरिक्त निर्भरता की आवश्यकता होती है, जैसे कि अन्य उत्तर दिखाते हैं।

यदि आप ब्राउज़र को उनके अनुरोध के आधार पर फ़ाइल में निर्देशित करना चाहते हैं, तो आपको इस तरह 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));

इस तरह आपको एक्सप्रेस के अलावा अतिरिक्त निर्भरता की आवश्यकता नहीं है। यदि आप बस सर्वर को अपनी पहले से बनाई गई html फाइलें भेजना चाहते हैं, तो ऊपर ऐसा करने का एक बहुत ही हल्का तरीका है।

— aleph_one
स्रोत
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>

अब अपने टर्मिनल में निम्न कोड चलाएँ

नोड index.js

— अहमद शरीफ
स्रोत
-1

मैं आमतौर पर इसका इस्तेमाल करता हूं

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

बस सावधान रहें क्योंकि यह / वेब निर्देशिका में कुछ भी साझा करेगा।

मुझे उम्मीद है यह मदद करेगा

— DiogoNeves
स्रोत
-2

यदि आप नोड के लिए एक्सप्रेस ढांचे का उपयोग कर रहे हैं

npm ejs स्थापित करें

फिर config फ़ाइल जोड़ें 

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)

;

निर्यात मॉड्यूल फ़ॉर्म से पृष्ठ को प्रस्तुत करें। जेएस के रूप में ejs फ़ाइल नाम के विस्तार के साथ विचारों में HTML फ़ाइल है form.html.ejs

इसके बाद फॉर्म बनाएं। js

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

— aruneshtechno
स्रोत
ये क्या गड़बड़ है?
— विघ्नेश राऊत
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.