3 글 보임 - 1 에서 3 까지 (총 3 중에서)
-
글쓴이글
-
2024년 8월 1일 09:02 #128959
김도영참가자강의 보면서 하고 있는데
BSONError: Argument passed in must be a string of 12 bytes at new ObjectId (C:\Users\c\OneDrive\바탕 화면\홈페이지\node_modules\mongodb\node_modules\bson\lib\bson.cjs:2048:27) at C:\Users\c\OneDrive\바탕 화면\홈페이지\server.js:69:63 at Layer.handle [as handle_request] (C:\Users\c\OneDrive\바탕 화면\ 홈페이지\node_modules\express\lib\router\layer.js:95:5) at next (C:\Users\c\OneDrive\바탕 화면\홈페이지\node_modules\express\lib\router\route.js:149:13) at Route.dispatch (C:\Users\c\OneDrive\바탕 화면\홈페이지\node_modules\express\lib\router\route.js:119:3) at Layer.handle [as handle_request] (C:\Users\c\OneDrive\바탕 화면\ 홈페이지\node_modules\express\lib\router\layer.js:95:5) at param (C:\Users\c\OneDrive\바탕 화면\홈페이지\node_modules\express\lib\router\index.js:376:14) at Function.process_params (C:\Users\c\OneDrive\바탕 화면\홈페이지\node_modules\express\lib\router\index.js:421:3)
Node.js v20.15.0 [nodemon] app crashed - waiting for file changes before starting... 이런 오류가 뜹니다. server.js 코드는
const express = require('express'); const app = express(); app.set('view engine', 'ejs') app.use(express.json()) app.use(express.urlencoded({extended:true})) const { MongoClient, ObjectId } = require('mongodb');
app.listen(8080, function() { console.log('listen on 8080') })
let db const url = 'mongodb+srv://:@cluster0.lvgghli.mongodb.net/?retryWrites=true&w=majority&appName=Cluster0' new MongoClient(url).connect().then((client)=>{ console.log('DB연결성공') db = client.db('recipe') }).catch((err)=>{ console.log(err) })
app.use('/assets', express.static('assets')) app.use('/style,js', express.static('style,js')) app.use('/server.js', express.static('server.js')) app.use('/node_modules', express.static('node_modules')) .... app.get('/detail/:id', async (요청, 응답)=>{ let recipe = await db.collection('recipe').findOne({_id : new ObjectId('요청.params.id')}) 응답.render('detail.ejs', {recipe : recipe}) }) 이렇고 ejs파일은
<!DOCTYPE html> <html lang="ko"> <!--mobile page--> <head> <!-- Google tag (gtag.js) --> <script async src="https://www.googletagmanager.com/gtag/js?id=G-N34JYEQDLC"></script> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date());
gtag('config', 'G-N34JYEQDLC'); </script> <meta charset="UTF-8"> <meta name="viewport" content="width=400px, initial-scale=1.0"> <title>100recipes</title> <essepage:head> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@unocss/reset/tailwind.min.css"> <script src="https://cdn.jsdelivr.net/npm/@unocss/runtime"></script> <script defer src="https://cdn.jsdelivr.net/npm/alpinejs@3.x.x/dist/cdn.min.js"></script> </essepage:head> <link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link href="https://fonts.googleapis.com/css2?family=Playwrite+DE+Grund:wght@200&display=swap" rel="stylesheet"> <style> @import url('https://fonts.googleapis.com/css2?family=Playwrite+DE+Grund:wght@200&display=swap'); </style> <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-4428613353614776" crossorigin="anonymous"></script> <link rel="stylesheet" href="/style,js/style-discover.css"> <style> .detail-box { width: 80%; font-size: 30px; font-family: '맑은 고딕'; padding-top: 10px; } .detail-box h4 { font-weight: bold; position: fixed; top: 100px; } .detail-box p { position: fixed; top: 150px; } </style> </head> <body> <div class="align-center"> < img src="/assets/images/logo1.png" width="200px" style="text-align : center;"> </div class="button-position"> <div class="align-left" x-data="{ SlideMenuOpen: false, bodyElement: document.querySelector('body'), preventScroll() { this.bodyElement.style.overflow = 'hidden'; }, allowScroll() { this.bodyElement.style.overflow = 'auto'; } }"> <button @click="() => {preventScroll(); SlideMenuOpen = !SlideMenuOpen;}" style="font-size: 30px;"> ☰ </button>
<div class="fixed z-10 inset-0 w-screen h-screen bg-black bg-opacity-75" x-cloak x-show="SlideMenuOpen" x-transition:enter="transition ease-in-out duration-400" x-transition:enter-start="opacity-0" x-transition:enter-end="opacity-100" x-transition:leave="transition ease-in-out duration-300" x-transition:leave-start="opacity-100" x-transition:leave-end="opacity-0">
<div class="absolute top-0 left-0 max-w-full h-screen p-4 bg-zinc-100 overflow-auto" x-cloak x-show="SlideMenuOpen" @click.outside="() => {allowScroll(); SlideMenuOpen = false;}" x-transition:enter="transform transition ease-in-out duration-300" x-transition:enter-start="-translate-x-full" x-transition:enter-end="translate-x-0" x-transition:leave="transform transition ease-in-out duration-200" x-transition:leave-start="translate-x-0" x-transition:leave-end="-translate-x-full">
<div class="min-w-[200px] max-w-[300px]"> <div class="mb-4 flex justify-end"> <button type="button" @click="() => {allowScroll(); SlideMenuOpen = false;}"> <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-arrow-left" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"> <path stroke="none" d="M0 0h24v24H0z" fill="none"></path> <line x1="5" y1="12" x2="19" y2="12"></line> <line x1="5" y1="12" x2="11" y2="18"></line> <line x1="5" y1="12" x2="11" y2="6"></line> </svg> </button> </div>
<div> <a href="mobile-mypage.html">- My page</a><br> <a href="mobile-discover.html">- 탐색</a><br> <a href="mobile-serch.html">- 검색</a><br> <a href="mobile-write.html">- 글쓰기</a><br> <a href="mobile-credit.html">- credit</a><br> </div> </div> </div> </div> </div> <div class="align-rignt" style="font-size: 30px;"> <a href="mobile-login.html"; style="font-size: 20px;"> log-in⎆ </a> </div> <div class="detail-box"> <h4><%-recipe.title%></h4> <p><%-recipe.content%></p> </div> </body> </html> 이렇습니다.
-
글쓴이글
3 글 보임 - 1 에서 3 까지 (총 3 중에서)
- 답변은 로그인 후 가능합니다.