2015-03-02 8 views
3

Я начинаю с Node.js, но у меня возникают проблемы с моим первым приложением: У меня есть мое первое приложение, настроенное «app.js», с html-файл «new.html» и файл .css «formato.css». Проблема в том, что когда я открываю new.html в своем веб-браузере, он уважает то, что написано в файле .css, однако при запуске «node app.js» экран, который появляется, не уважает то, что находится на. css-файл. Как я могу это исправить?Мое приложение node.js не обнаруживает .css-файлы

app.js:

var http = require('http'); 
var url = require('url'); 
var fs = require('fs'); 
var qs = require('querystring'); 

var nuevoPostHTML= fs.readFileSync('vistas/post/new.html'); 

function nuevoPost(request, response){ 
    response.writeHead(200, {'Content-type': 'text/html; charset - utf8'}); 
    response.end(nuevoPostHTML); 
} 

function agregarNuevoPost(request, response){ 
parseBody(request, function(body){ 
    var post = { 
     title: body.title, 
     content: body.content 
    } 
    console.log("Title: " + post.title); 
    console.log("Content:" + post.content); 
}) 
response.end(); 
} 


//Utils 
function notFound(request, response){ 
response.writeHead(404); 
response.end('404: File not Found'); 
} 

function parseBody(request, callback){ 
var body = ''; 
request.on('data', function(chunk){ body += chunk;}) 
request.on('end', function(){callback(qs.parse(body));}) 
} 
//Rutas 
var regexNuevoPost = new RegExp('^/posts/new/?$'); 
var regexPost = new RegExp('^/posts/?$'); 


//Comienza servidor 
var server = http.createServer(function(request, response){ 
var nomPath = url.parse(request.url).pathname; 

if (regexNuevoPost.test(nomPath)){ 
    nuevoPost(request, response); 
}else if (regexPost.test(nomPath)){ 
    agregarNuevoPost(request,response); 

}else{ 
    notFound(request,response); 
} 
}); 

server.listen(8000); 
console.log('Listening on http://127.0.0.1:8000'); 

new.html:

<!DOCTYPE html> 
<html> 
<head> 
<title> 
    Nuevo Post 
</title> 
<link rel="stylesheet" type="text/css" href="formato.css" /> 
</head> 
<body> 
<h1> 
    Nuevo Post 
</h1> 
<form method="post" action="/posts" id="new_post" class="new_post"> 
    <div class="field"> 
    <label for="post_title">Titulo</label><br /> 
    <input type="text" name="title" id="post_title" size="30" /> 
    </div> 
    <div class="field"> 
    <label for="post_content">Contenido</label><br /> 
    <textarea name="content" cols="40" rows="20" id="post_content"> 
    </textarea> 
    </div> 
    <div class="actions"> 
    <input type="submit" value="Crear" id="post_submit" /> 
    </div> 
</form> 
<p> 
    <br /> 
    <a href="/posts">Back</a> 
</p> 

formato.css:

body { 
background-color: lightblue; 
} 

h1 { 
color: navy; 
margin-left: 20px; 
} 
+5

Я не вижу места, где ваш сервер служит файл CSS. Это говорит о том, что вы пришли от написания php, который по умолчанию имеет модуль, который автоматически позаботится об этом. Вы можете использовать это: http://expressjs.com/guide/using-middleware.html#express.static – m59

+0

вы можете рассмотреть возможность использования модуля '' node-static'' в вашем приложении –

ответ

0

В M59 штатах, вы должны служить файлы, используемые вашим sc НИИИТ.

Самый простой способ - использовать экспресс, поскольку он делает статичный контент довольно простым.

Хорошая рецензия: http://blog.modulus.io/nodejs-and-express-static-content

2

Вы должны использовать промежуточное программное обеспечение статического сервера для обслуживания статических активов. если вы собираетесь использовать фреймворк expressjs, у него есть встроенное промежуточное ПО serve-static.

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

// serve static assets 
app.use(express.static(__dirname + '/assets')); 

, если вы не будете использовать экспресс, вы можете просто использовать его middleware в проекте.

$ НАЯ инсталляции служат статическими

var serveStatic = require('serve-static'); 
var serve = serveStatic('/assets', {}); 

var server = http.createServer(function(req, res){ 
var done = finalhandler(req, res); 
serve(req, res, done); 
}); 
Смежные вопросы