为什么Node.js无法识别图像路径

Question

I'm trying to get my images to load up using node the relative path; however it keeps giving me a 404 error (not found). Here is my code:

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

app.use(express.static("public"));
app.set("view engine", "ejs");
app.get("/", function(req,res){
  res.render("home");
});


app.get("/fallinlovewith/:thing", function(req, res){
  var thing = req.params.thing; 
  res.render("love", {thingVar: thing});
});


app.get("/posts", function(req, res) {
    var posts = [
        {title: "Post 1", author: "Susy" },
        {title: "My adorable pet Bunny!", author: "Bob" },
        {title: "Can you belive this pomsky?", author: "Ethan" },
      ];

  res.render("posts", {posts: posts});
});

app.listen(process.env.PORT, process.env.IP, function(){
console.log("server started");
});

Here is my home.ejs file

<% include  partials/header %>
<h1>This is the home page</h1>
<img src="https://i.ytimg.com/vi/gp3ZKiwZMvg/hqdefault.jpg">
<img src="public/images/rsz_biopic.jpg"></img>
<% include  partials/footer %>

My css file, and image src http path are both working, It's just the relative path. If anyone could help out that would be awesome!

Answer 1

Change <img src="public/images/rsz_biopic.jpg"></img> to <img src="images/rsz_biopic.jpg"></img> . Basically, remove public .

You already name public the folder for static files app.use(express.static("public")); . It shouldn't be used again in the path for the files.

<% include  partials/header %>
<h1>This is the home page</h1>
<img src="https://i.ytimg.com/vi/gp3ZKiwZMvg/hqdefault.jpg">
<img src="images/rsz_biopic.jpg"></img>
<% include  partials/footer %>

Answer 2

Add to top of file:

var path = require('path'),

You need to define that path in node.

Change:

app.use(express.static("public"));

To:

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

This way "/public" is a valid location