上传图像并将其保存在 NuxtJs 的公共文件夹中
P粉141911244
P粉141911244 2024-03-29 17:28:07
[Vue.js讨论组]

如何让用户上传 img 并将其存储在公共文件夹中?

我正在制作简单的应用程序,使用户(餐厅经理)能够插入新的食物及其图像。

我让用户用表单上传一个img,我需要将其保存在Nuxt项目的public文件夹中。

食物信息通过 $fecth 和 POST 方法插入,然后从 POST 中提取并插入到数据库中

INSERT INTO menu (food_name, price, course ) 
        VALUES (?, ?, ?)`,
[plateName, platePrice, course]
FORM:
<input class="form-control" type="file" v-on:change="uploadImg()" id="formFile">
<label for="formFile" class="form-label">Add Image</label>
methods {
    uploadImg(){

        ???

    },
    addFood() {
      $fetch("/api/insert/", {
        method: "POST",
        body: {
            plateName: this.plateName,
            platePrice: this.platePrice,
            course: this.plateSelect,
            }
      })
      .then(() => window.location.href = "/inserimento")
      .catch((e) => alert(e))

    },

P粉141911244
P粉141911244

全部回复(1)
P粉765570115

这不是一个可行的解决方案,因为最终用户可能会出现恶意行为并发送垃圾邮件查询。因此,过度填充您的服务器并使其崩溃或填满整个磁盘。

最重要的是,它不会被优化、正常服务或任何其他事情(没有捆绑步骤)。
相反,我建议您将其上传到某个后端,对其进行优化(可以使用 Cloudinary 等服务来完成)并将其托管在 AWS S3 或类似的设备上(最好是在 CDN 上)。

这是一个更具可扩展性、更安全且持久的解决方案。

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号