Cannot read property "avatar" of null

Coding Help
#1

Hey guys, when i am getting to /search/profile/:id it renders profile fine. Everything works correctly, but i am getting Cannot read property "avatar" of null error. It shows avatar too, but i have no idea why i am getting this.

searched.ejs

<div align = "center" id = "user-cart">
  <script src = "https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.3.0/socket.io.js"></script>
  <br><img id = "image" height = "200px" width = "200px" src = "<%= user.avatar %>">
  <h1>Adı : <%= user.username.split("@").shift() %><br><br>
  Hesab ID : <%= user.id %><br><br>
  Dərslər : Javascript<br><br>
  Status : Yerindədir.<br><br>
  Vəzifə : <%= user.username.split("@").shift() === "test" ? "Owner" : "User" %> </h1>

server.js


app.get("/search/profile/:id", async(req, res) =>{
  const user = await User.findById(req.params.id);

   res.render("searched-profile", {
         user : user
})
})

searched-profile.ejs


<%- include('partials/blocks/searched.ejs');

Any idea?

Full Error :

TypeError: /app/views/searched-profile.ejs:10
    8|     <div align="center">
    9|       <link rel="stylesheet" href="/stil.css" />
 >> 10|        <%- include('partials/blocks/searched.ejs') %>
    11|     </div>
    12|   </head>
    13|   <body>
/app/views/partials/blocks/searched.ejs:3
    1| <div align = "center" id = "user-cart">
    2|   <script src = "https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.3.0/socket.io.js"></script>
 >> 3|   <br><img id = "image" height = "200px" width = "200px" src = "<%= user.avatar %>">
    4|   <h1>Adı : <%= user.username.split("@").shift() %><br><br>
    5|   Hesab ID : <%= user.id %><br><br>
    6|   Dərslər : Javascript<br><br>
Cannot read property 'avatar' of null
at eval (/app/views/partials/blocks/searched.ejs:12:31)
    at searched (/rbd/pnpm-volume/2efe52c0-18bc-402b-a0c2-84ca7b4acba0/node_modules/.registry.npmjs.org/ejs/3.1.5/node_modules/ejs/lib/ejs.js:691:17)
    at include (/rbd/pnpm-volume/2efe52c0-18bc-402b-a0c2-84ca7b4acba0/node_modules/.registry.npmjs.org/ejs/3.1.5/node_modules/ejs/lib/ejs.js:689:39)
at eval (/app/views/searched-profile.ejs:12:17)
    at searched-profile (/rbd/pnpm-volume/2efe52c0-18bc-402b-a0c2-84ca7b4acba0/node_modules/.registry.npmjs.org/ejs/3.1.5/node_modules/ejs/lib/ejs.js:691:17)
    at tryHandleCache (/rbd/pnpm-volume/2efe52c0-18bc-402b-a0c2-84ca7b4acba0/node_modules/.registry.npmjs.org/ejs/3.1.5/node_modules/ejs/lib/ejs.js:272:36)
    at View.exports.renderFile [as engine] (/rbd/pnpm-volume/2efe52c0-18bc-402b-a0c2-84ca7b4acba0/node_modules/.
#2

What does the User object look like? Does it have a key called avatar? Try logging User.avatar or just User in your project and see what it returns

1 Like
#3

yep it have an avatar key and it has a value too that’s how i rendering profile pictures it works fine but idk why am i getting this

#4

I am 100% certain that your variable user is null. (Due to the error message: Cannot read property "avatar" of null) - meaning this user variable isn’t passed properly.

I see that you are passing user to searched-profile.ejs, but the user variable is being used in searched.ejs file. I know you are doing include, but are you sure this is the right way?

I used .ejs code 2 years ago and I don’t recall ever passing a variable from an .ejs file to another .ejs file.

So I’m 99% sure your indirectly passing user variable is not supported by .ejs.

Hope this helps