मूल HTML को Node.js में लोड कर रहा है

Question

मैं यह जानने की कोशिश कर रहा हूं कि मूल HTML फ़ाइल को कैसे लोड और रेंडर किया जाए ताकि मुझे कोड लिखना न पड़े:

response.write('...<p>blahblahblah</p>...');

Answer 1

मुझे बस fs लाइब्रेरी का उपयोग करने का एक तरीका मिला । मुझे यकीन नहीं है कि अगर यह सबसे साफ है।

var http = require('http'),
    fs = require('fs');


fs.readFile('./index.html', function (err, html) {
    if (err) {
        throw err; 
    }       
    http.createServer(function(request, response) {  
        response.writeHeader(200, {"Content-Type": "text/html"});  
        response.write(html);  
        response.end();  
    }).listen(8000);
});

मूल अवधारणा सिर्फ कच्चे फ़ाइल को पढ़ना और सामग्री को डंप करना है। फिर भी क्लीनर विकल्पों के लिए खुला है, हालांकि!

Comments

आप अपने मामले में fs.readFileSync का उपयोग करें, यह पृष्ठ के लिए अनिर्धारित के रूप में आने के लिए बुरा होगा। लेकिन हां, यह मूल html सर्वर बनाने का एक अच्छा तरीका है

— सामान्य

sys = require('util')क्योंकि सांत्वना के लिए कुछ भी मुद्रित नहीं है, की जरूरत नहीं है।

— बाकुदन

यह पूरी फ़ाइल को मेमोरी में, और प्रत्येक अनुरोध पर पढ़ता है। आपको वास्तव में फ़ाइल को बफ़र करने के बजाय डिस्क से स्ट्रीम करना चाहिए। इस तरह की चीज़ों के लिए अच्छी गुणवत्ता वाली लाइब्रेरियाँ मौजूद हैं, जैसे senchalabs.org/connect और github.com/cloudhead/node-static

— आकर्षित नोक

मुझे लगता है कि इसे राइटहेड (...) नहीं लिखा जाना चाहिए (...) ... Node.js response.writeHead ()

— डैनी बुलिस

@generalhenry बेहतर अभी तक, कॉल को कॉल के fs.readFileअंदर रखा जा सकता है http.createServer, जिससे त्रुटि को नियंत्रित किया जा सकता है। साथ उपयोग स्टीफन जवाब बयान सरल बात यह है कि नए उपयोगकर्ताओं को अनदेखा कर सकते है। if (err) { console.log('something bad'); return res.end('Oops! Something bad happened.');}return

— इन्नबलम

Answer 2

html फ़ाइल प्राप्त करने के लिए app.get का उपयोग करें। यह आसान है!!

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

app.get('/', function(request, response){
    response.sendFile('absolutePathToYour/htmlPage.html');
});

यह उसके जैसा आसान है। इस उपयोग के लिए एक्सप्रेस मॉड्यूल। एक्सप्रेस स्थापित करें:npm install express -g

Comments

आप यह बताना भूल गए कि आपके पास क्या है express।

— चीख

एक्सप्रेस अपग्रेडेड रेस.सेंडफाइल: resover.sendFile के बजाय stackoverflow.com/a/26079640/3166417 का

— itzhar

अच्छा जवाब। उन लोगों के लिए जो इस तरह से एक्सप्रेस टाइप का उपयोग करने से पहले app.get ....:var express = require('express'); var app = express();

— Eugenijus S.

उपयोग के npm install express --saveबजाय -g

— MrWater

Answer 3

आप fs ऑब्जेक्ट का उपयोग करके मैन्युअल रूप से फाइल इको कर सकते हैं, लेकिन मैं आपके जीवन को बहुत आसान बनाने के लिए ExpressJS फ्रेमवर्क का उपयोग करने की सलाह दूंगा ।

... लेकिन अगर आप इसे कठिन तरीके से करने पर जोर देते हैं:

var http = require('http');
var fs = require('fs');

http.createServer(function(req, res){
    fs.readFile('test.html',function (err, data){
        res.writeHead(200, {'Content-Type': 'text/html','Content-Length':data.length});
        res.write(data);
        res.end();
    });
}).listen(8000);

Comments

हाँ, यह लगभग एक ही चीज़ है जिसके साथ मैं कैम करता हूं। एक्सप्रेस सुझाव के लिए भी धन्यवाद। यह बहुत प्यारा है, और मुझे पूरा यकीन है कि मैं इसे अपने अगले प्रोजेक्ट के लिए इस्तेमाल करूंगा। मेरा लक्ष्य यह पता लगाना था कि हुड के नीचे यह कैसे होता है इससे पहले कि मैं रूपरेखा को मेरे लिए भारी उठाने देता हूं।

— डेविड ग्रैनाडो

एंटी वायरस के फ़ायरवॉल को इस कदम को निष्क्रिय किया जा सकता है

— मोहम्मद फ़रहानी

Answer 4

मुझे पता है कि यह एक पुराना सवाल है, लेकिन जैसा कि किसी ने भी इसका उल्लेख नहीं किया है मुझे लगा कि यह जोड़ने लायक था:

यदि आप सचमुच स्टैटिक कंटेंट परोसना चाहते हैं ('a' about 'पेज, इमेज, css, इत्यादि) तो आप स्टैटिक कंटेंट सर्व करने वाले मॉड्यूल में से एक का उपयोग कर सकते हैं, उदाहरण के लिए नोड-स्टैटिक। (ऐसे अन्य हैं जो बेहतर / बदतर हो सकते हैं - search.npmjs.org को आज़माएं।) पूर्व-प्रसंस्करण के थोड़े समय के साथ आप फिर स्थैतिक से गतिशील पृष्ठों को फ़िल्टर कर सकते हैं और उन्हें सही अनुरोध हैंडलर को भेज सकते हैं।

Comments

उत्तर नोड फ़ाइल को सही ढंग से लोड नहीं करता है, नोड-स्टेटिक का उपयोग करके मेरी समस्या हल करता है।

— अज।

Answer 5

यह संभवत: कुछ बेहतर होगा क्योंकि आप फ़ाइल को डाउनलोड कर रहे होंगे बजाय कि इसे fs.readFile जैसी मेमोरी में लोड किए।

var http = require('http');
var fs = require('fs');
var path = require('path');
var ext = /[\w\d_-]+\.[\w\d]+$/;

http.createServer(function(req, res){
    if (req.url === '/') {
        res.writeHead(200, {'Content-Type': 'text/html'});
        fs.createReadStream('index.html').pipe(res);
    } else if (ext.test(req.url)) {
        fs.exists(path.join(__dirname, req.url), function (exists) {
            if (exists) {
                res.writeHead(200, {'Content-Type': 'text/html'});
                fs.createReadStream('index.html').pipe(res);
            } else {
                res.writeHead(404, {'Content-Type': 'text/html'});
                fs.createReadStream('404.html').pipe(res);
        });
    } else {
        //  add a RESTful service
    }
}).listen(8000);

Answer 6

यह मुहम्मद नेस्वाइन के जवाब का अपडेट है

Express 4.x में, sendfile को हटा दिया गया है और sendFile फ़ंक्शन का उपयोग किया जाना है। अंतर है Sendfile सापेक्ष पथ लेता है और SendFile पूर्ण पथ लेता है। इसलिए, __dirname का उपयोग पथ को हार्डकोड करने से बचने के लिए किया जाता है।

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

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

Answer 7

यह pipeविधि का उपयोग करने के लिए अधिक लचीला और सरल तरीका है ।

var fs = require('fs');
var http = require('http');

http.createServer(function(request, response) {
  response.writeHead(200, {'Content-Type': 'text/html'});

  var file = fs.createReadStream('index.html');
  file.pipe(response);

}).listen(8080);

console.log('listening on port 8080...');

Answer 8

सबसे अच्छा तरीका है कि मैं एक्सप्रेस के साथ html फ़ाइलों के साथ एक्सप्रेस का उपयोग कर रहा हूँ क्योंकि एक्सप्रेस बहुत लाभ देता है। यदि आप चाहें तो आप इसे एक हरोकू प्लेटफॉर्म तक बढ़ा सकते हैं..बस कह रहे हैं :)

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


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

app.listen(3000);



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

स्वच्छ और श्रेष्ठ .. !!!

Answer 9

ऐसा करने का आसान तरीका है, अपनी सभी फाइलों को index.html सहित या सभी संसाधनों जैसे CSS, JS आदि के साथ किसी फ़ोल्डर में सार्वजनिक रूप से डाल दें या आप जो चाहें उसे नाम दे सकते हैं और अब आप एक्सप्रेस js का उपयोग कर सकते हैं और बस ऐप बता सकते हैं _dirname का उपयोग इस प्रकार करें:

अपने server.js में एक्सप्रेस का उपयोग करके इन्हें जोड़ते हैं

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

और यदि आप निर्देशिका को सार्वजनिक निर्देशिका के तहत नई निर्देशिका जोड़ना चाहते हैं और उस पथ का उपयोग करें "/ public / YourDirirame"

तो हम यहां क्या कर रहे हैं? हम ऐप नाम के एक्सप्रेस उदाहरण बना रहे हैं और अगर सार्वजनिक निर्देशिका सभी संसाधनों का उपयोग करने के लिए हम एड्रेस दे रहे हैं। उम्मीद है की यह मदद करेगा !

Answer 10

एक्सप्रेस मॉड्यूल का उपयोग करने के बारे में कैसे?

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

    app.get('/',function(request,response){
       response.sendFile(__dirname+'/XXX.html');
    });

    app.listen('8000');

उसके बाद, आप ब्राउज़र का उपयोग / स्थानीयहोस्ट करने के लिए कर सकते हैं: 8000

Answer 11

   var http = require('http');
   var fs = require('fs');

  http.createServer(function(request, response) {  
    response.writeHeader(200, {"Content-Type": "text/html"});  
    var readSream = fs.createReadStream('index.html','utf8')
    readSream.pipe(response);
  }).listen(3000);

 console.log("server is running on port number ");

Comments

मैं यह नहीं लगता कि response.writeHeader(),, बल्कि response.writeHead()।

— एडविन

response.writeHeader()और response.writeHead()दोनों वैध हैं।

— देके

Answer 12

मुझे लगता है कि यह एक बेहतर विकल्प होगा क्योंकि यह यूआरएल को सर्वर से चलाता है:

var http = require('http'),
    fs = require('fs');

const hostname = '<your_machine_IP>';
const port = 3000;

const html=fs.readFile('./index.html', function (err, html) {
    if (err) {
        throw err; 
    }
        http.createServer(function(request, response) {  
        response.writeHeader(200, {"Content-Type": "text/html"});  
        response.write(html);  
        response.end();  
    }).listen(port, hostname, () => {
            console.log(`Server running at http://${hostname}:${port}/`);
        })
}); 

Answer 13

आप इस स्निपेट का उपयोग भी कर सकते हैं:

var app = require("express");
app.get('/', function(req,res){
   res.sendFile(__dirname+'./dir/yourfile.html')
});
app.listen(3000);

Answer 14

यदि आप पाइप का उपयोग करते हैं तो यह वास्तव में सरल है। निम्नलिखित सर्वर .js कोड स्निपेट है।

var http = require('http');
var fs = require('fs');

function onRequest(req, res){

    console.log("USER MADE A REQUEST. " +req.url);
    res.writeHead(200, {'Content-Type': 'text/html'});
    var readStream = fs.createReadStream(__dirname + '/index.html','utf8'); 
    
/*include your html file and directory name instead of <<__dirname + '/index.html'>>*/

    readStream.pipe(res);

}

http.createServer(onRequest).listen(7000);
console.log('Web Server is running...');

Comments

यदि कोई भी मनमाने ढंग से नेस्टेड निर्देशिकाओं में मनमानी फ़ाइलों को वापस करने के लिए इसे विस्तारित करने की कोशिश करता है, तो सुनिश्चित करें कि आप यह जांचते हैं कि जिस निर्देशिका को आपके उपयोगकर्ता ने पारित किया है, वह ऐसी कोई चीज़ नहीं है ../। अगर कुछ नहीं करना था, लेकिन __dirname + "/index.html'कुछ को बदलना है __dirname + requestedPageFromHeader, तो मेरा मानना ​​है कि परिणामी कोड में यह भेद्यता होगी। निर्देशिका पाथिंग कैरेक्टर्स ~तब तक ठीक रहेंगे जब तक आप इसमें शामिल हैं __dirname +- यदि उपयोगकर्ता यह निर्धारित कर सकता है कि पथ की शुरुआत के लिए आपको भी जाँच करनी होगी।

— जॉन

Answer 15

मुझे पता है कि यह एक पुराना सवाल है - यहाँ एक सरल फ़ाइल सर्वर उपयोगिता है यदि आप कनेक्ट या एक्सप्रेस का उपयोग नहीं करना चाहते हैं; बल्कि http मॉड्यूल।

var fileServer = require('./fileServer');
var http = require('http');
http.createServer(function(req, res) {
   var file = __dirname + req.url;
   if(req.url === '/') {
       // serve index.html on root 
       file = __dirname + 'index.html'
   }
   // serve all other files echoed by index.html e.g. style.css
   // callback is optional
   fileServer(file, req, res, callback);

})
module.exports = function(file, req, res, callback) {
    var fs = require('fs')
        , ext = require('path').extname(file)
        , type = ''
        , fileExtensions = {
            'html':'text/html',
            'css':'text/css',
            'js':'text/javascript',
            'json':'application/json',
            'png':'image/png',
            'jpg':'image/jpg',
            'wav':'audio/wav'
        }
    console.log('req    '+req.url)
    for(var i in fileExtensions) {
       if(ext === i) {    
          type = fileExtensions[i]
          break
       }
    }
    fs.exists(file, function(exists) {
       if(exists) {
          res.writeHead(200, { 'Content-Type': type })
          fs.createReadStream(file).pipe(res)
          console.log('served  '+req.url)
          if(callback !== undefined) callback()
       } else {
          console.log(file,'file dne')
         }  
    })
}

Answer 16

जेड के बजाय ईजे का उपयोग करें

npm install ejs

app.js

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

./routes/index.js

exports.index = function(req, res){
res.render('index', { title: 'ejs' });};

Answer 17

यह एक बहुत पुराना प्रश्न है ... लेकिन अगर आपका उपयोग मामला केवल एक विशेष एचटीएमएल पेज को तदर्थ आधार पर ब्राउज़र को भेजने के लिए है, तो मैं इस तरह से कुछ सरल का उपयोग करूंगा:

var http = require('http')
,       fs = require('fs');

var server = http.createServer(function(req, res){
  var stream = fs.createReadStream('test.html');
  stream.pipe(res);
});
server.listen(7000);

Answer 18

हम कनेक्ट फ्रेम वर्क के साथ html डॉक्यूमेंट लोड कर सकते हैं। मैंने अपने प्रोजेक्ट के पब्लिक फोल्डर में अपना html डॉक्यूमेंट और संबंधित इमेजेस रखी हैं, जहाँ नीचे कोड और नोड मॉड्यूल मौजूद हैं।

//server.js
var http=require('http');
var connect=require('connect');

var app = connect()
  .use(connect.logger('dev'))
  .use(connect.static('public'))
  .use(function(req, res){
   res.end('hello world\n');
 })

http.createServer(app).listen(3000);

मैंने fs की रीडफाइल () विधि की कोशिश की है, लेकिन यह छवियों को लोड करने में विफल रहता है, इसीलिए मैंने कनेक्ट फ्रेमवर्क का उपयोग किया है।

Answer 19

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

यहाँ एक्सप्रेस सर्वर का उपयोग करके होस्ट स्थिर HTML फ़ाइलों के लिए मेरा सरल डेमो कोड है!

आशा है कि यह आपके लिए मदद करता है!

// 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}!
    `);
});