英文:
What is the best way to upload and load files using a google cloud bucket?
问题
我是新手使用Google Cloud平台,需要将照片上传到Google Cloud存储桶。我编写了以下代码来上传文件:
const uploadToGCS = async (file, folder) => {
return new Promise((resolve, reject) => {
const folderPath = `${folder}/`
const newFileName = `${folderPath}${Date.now()}-${file.originalname}`
const blob = bucket.file(newFileName)
const blobStream = blob.createWriteStream()
blobStream.on('error', (err) => reject(err))
blobStream.on('finish', () => {
const publicUrl = `https://storage.googleapis.com/${bucket.name}/${blob.name}`
resolve(publicUrl)
})
blobStream.end(file.buffer)
})
}
然而,将这个URL保存在数据库中对于在客户端上显示照片并不实用。我已经了解了获取签名URL。这是可以帮助我的东西吗?
在使用Google Cloud平台的MERN应用程序中,上传和加载文件的最佳方式是什么?我不确定是否从存储桶中获取文件并将其作为响应发送到客户端是一种良好的做法,或者是否有一种通过URL访问照片的方式,以便在渲染卡片时设置照片源时看起来像这样:
<div className='mb-3 w-full rounded-lg overflow-hidden' style={{ aspectRatio: '1/1' }}>
<img
src={object.photo}
className='object-cover w-full h-full transform transition-all duration-500 hover:scale-110'
/>
</div>
任何帮助或提示将不胜感激。谢谢。
英文:
I am new to using Google Cloud Platform and I need to upload photos to a Google Cloud bucket. I wrote the following code to upload the file:
const uploadToGCS = async (file, folder) => {
return new Promise((resolve, reject) => {
const folderPath = `${folder}/`
const newFileName = `${folderPath}${Date.now()}-${file.originalname}`
const blob = bucket.file(newFileName)
const blobStream = blob.createWriteStream()
blobStream.on('error', (err) => reject(err))
blobStream.on('finish', () => {
const publicUrl = `https://storage.googleapis.com/${bucket.name}/${blob.name}`
resolve(publicUrl)
})
blobStream.end(file.buffer)
})
}
However, saving this URL in the database is not useful for displaying the photo on the client side. I have read about Get Signed Url. Is this something that could help me?
What is the best way to upload and load files in a MERN app using Google Cloud Platform? I am not sure if getting files in the web server from the bucket, and sending it as a response to the client is a good practice or if there is a way to access the photo through a URL, so that when I am rendering the card it has something like this when I set the photo source:
<div className='mb-3 w-full rounded-lg overflow-hidden' style={{ aspectRatio: '1/1' }}>
<img
src={object.photo}
className='object-cover w-full h-full transform transition-all duration-500 hover:scale-110'
/>
</div>
Any help or tip will be much appreciated. Thank you.
答案1
得分: 2
将此作为评论发布以供所有人查看。
您可以通过此指南开始找出上传对象的最佳方法。有许多方法可以使对象公开,并且有方法可以使存储桶中的所有对象都变为公开。阅读所有文档,以便您了解每种方法的利弊。
英文:
Posting this as a comment for everyone's visibility.
You can start finding out the best way to upload an object with this guide. There are many ways to make an object public and there are ways to make all objects in a bucket public. Read all the documentation so that you understand the pros/cons of each method.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论