質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
Node.js

Node.jsとはGoogleのV8 JavaScriptエンジンを使用しているサーバーサイドのイベント駆動型プログラムです。

データベース

データベースとは、データの集合体を指します。また、そのデータの集合体の共用を可能にするシステムの意味を含めます

文字コード

文字コードとは、文字や記号をコンピュータ上で使用するために用いられるバイト表現を指します。

Q&A

0回答

933閲覧

【Node.Jsでデータベースからブラウザに表示させる方法】

fayol

総合スコア0

Node.js

Node.jsとはGoogleのV8 JavaScriptエンジンを使用しているサーバーサイドのイベント駆動型プログラムです。

データベース

データベースとは、データの集合体を指します。また、そのデータの集合体の共用を可能にするシステムの意味を含めます

文字コード

文字コードとは、文字や記号をコンピュータ上で使用するために用いられるバイト表現を指します。

0グッド

0クリップ

投稿2021/12/23 03:45

編集2022/01/12 10:55

前提・実現したいこと

  1. データベースからブログ記事を検索
  2. ブラウザに表示

Node.jsでブログを作ろうとしています。
フレームワーク: Express
データベース: MongoDB (スキーマ作成のためにmongoose)
テンプレートエンジン: ejs

問題は、
ブラウザにはきちんと記事が表示できているにも関わらず、
TypeErrorがコンソールに出力されてしまうことです。

みなさまの知恵をお借りしたいと思います、よろしくお願いします。

発生している問題・エラーメッセージ

JS

1TypeError: /home/vagrant/myblog/views/layout/article.ejs:10 2 8| <link rel="stylesheet" href="/styles/article.css" type="text/css"> 3 9| <link rel="stylesheet" href="/styles/footer.css" type="text/css"> 4 >> 10| <title><%= article.title %></title> 5 11| <meta name="description" content="<%= article.description %> "> 6 12| </head> 7 8Cannot read properties of null (reading 'title')

該当のソースコード

app.get('/:category/:slug', async (req, res) => { const article = await ArticleDB.findOne({ slug: req.params.slug }).lean() if (article == null) { res.redirect('/') } JSON.stringify(article) console.log(article) res.render('./layout/article', { article: article }) })

該当のソースコード

<head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="/styles/normalize.css" type="text/css"> <link rel="stylesheet" href="/styles/article.css" type="text/css"> <link rel="stylesheet" href="/styles/footer.css" type="text/css"> <title><%= article.title %></title> <meta name="description" content="<%= article.description %> "> </head>

試したこと

データベースから取り出したデータの中身を確認
結果は以下の通りで、欲しいデータを取得できているのですが、なぜか一番最後にnullがくっついています。
配列というわけでもないので、このnullだけを切り離すことができませんでした。
いったん文字列に変換して直接除去する方法も考えましたが、あまりスマートな方法ではないように思います。

article

1{ 2 _id: new ObjectId("619b20353704b5b57a7159ba"), 3 title: 'This is an article for SEO part 2', 4 category: 'SEO', 5 description: 'SEO is important. ', 6 markdown: '# title\r\n## subtitle ', 7 createdAt: 2021-11-23T15:45:36.204Z, 8 slug: 'this-is-an-article-for-seo-part-2', 9 sanitizedHtml: '<h1>title</h1>\n<h2 id="subtitle">subtitle</h2>\n', 10 __v: 0 11} 12null

データ型を確認
Object.prototype.toString.call(article)で記事データのデータ型を確認しました。
やはり、オブジェクト型とnullが一緒になって入っています。

[object Object] [object Null]

補足情報(FW/ツールのバージョンなど)

node.js: v16.13.0
express: express@4.17.1
mongoose: mongoose@6.0.12
MongoDB: 5.0.3
Ubuntu: 18.04.3 LTS

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

退会済みユーザー

退会済みユーザー

2021/12/23 04:08

articleを取得する箇所のコードも質問文中に書いてください。
miyabi-sun

2021/12/23 04:13

> Java Javaとか関係無しにエラーメッセージですよね?これ 因みにJavaとJavaScriptはインドとインドネシアくらい違うので もし省略するならJSにしましょう。 > ejs 君はJavaScriptファイルでしょ! > res.redirect('/') `return res.redirect('/')`にしてあげてください。 後続の処理も継続するのでそれでちまちまとエラーが出ているのでは? > 結果は以下の通り 「以下」の結果がないのは回答するには致命的かと思います 編集ボタンから追記をおねがいします。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだ回答がついていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問