こんにちは。現在Express、multer、Cloudinaryを使って画像投稿機能を作っています。
formで画像を投稿しCloudinaryのサーバーにアップロードすることはできましたが、肝心の画像がWebに表示されません。
consol.log(imagePath)でresult.urlのurlが定義されていませんと出ます、Cloudinaryの画像パスの取得の仕方が間違えっているのでしょうか?
どうかご享受お願いします。
OS:Win10
参考にしたサイト:画像投稿
app.js
Javascript
1let multer = require('multer') 2let upload = multer({dest: './public/images/uploads/'}) //ローカルで画像を保存する場所 3var cloudinary = require('cloudinary') 4cloudinary.config({ 5 cloud_name: '[CLOUD_NAME]', 6 api_key: '[API_KEY]', 7 api_secret: '[API_SECRET]' 8}); 9 10 11app.post('/create', upload.single('image_file'), function(req, res) { //upload.singleでfileを取得 12 let path = req.file.path 13 let zid = req.params.id 14 var title_db = req.body.zatuTitle 15 var content_db = req.body.zatuarea 16 cloudinary.uploader.upload(path, function(error, result) { 17 var imagePath = result.url 18 consol.log(imagePath) 19 var que = 'INSERT INTO zatu (image_path, title, content, id, created_at) VALUES ("' + imagePath + '", ' + '"' + title_db + '", ' + '"' + content_db + '", ' + '"' + zid + '", ' + '"' + createdAt + '")'; 20 connection.query(que, function(error, results) { 21 res.redirect('/'); 22 }); 23 }); 24});
top.ejs
HTML
1<div class="images"> 2 <% if(item.image_path) { %> 3 <a href="<%= item.image_path %>" class="zatu_image" style="background-image:url(<%= item.image_path %>);"></a> 4 <% } %> 5 </div>
あなたの回答
tips
プレビュー