简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
当用户提交图像时，是否可以动态更新图像'图库”？
P粉715228019
P粉715228019 2024-02-04 11:28:23
0
1
520

我正在创建一个网站，展示我祖父的所有照片。由于我没有所有照片，而且还会有其他人来来去去，我认为有一个网站让他们可以提交照片然后查看它们的“数据库”会很不错。

目前，我有一个 InfinityFree 网站和一个 github 网站。 InfinityFree 非常擅长提供一个具有优秀编辑器的 Web 平台，但我一生都无法弄清楚服务器端的事情（即用户如何提交文件以及如何查看它们）。两者都有相同的代码，但我尝试使用 InfinityFree 上不可用的 node.js，这就是我暂时离开并将代码移至 github 的原因。

我不知道该去哪里，因为我所做的搜索都没有产生有意义的答案。我是否应该采取一条路线来学习如何获取然后存储然后在网站上显示照片？

目前这是我的代码。它是网站的基本骨干。现在它所做的只是显示用户选择的图像。

<!doctype html>
<html>
<head>
    <div class="header">
        <h1>Welcome!</h1>
        <p>Here is a site to view and submit photos of _________</p>
    </div>
    
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    
    <style>
    body {
        font-family: Arial;
        margin: 0;
    }
        
    .header {
        padding: 70px;
        text-align: center;
        background: #663399;
        color: white;
        position: relative;
        top: -35px;
    }
            
    .header h1 {
        font-size: 65px;
        margin-top: 0;
        position: relative;
        top: 0px;
    }
    
    .header p {font-size: 25px;}

    .content {padding:20px;}
    </style>
</head>
    
<body>
    <script>
    function handleImageUpload() 
    {
        var image = document.getElementById("upload").files[0];
        var reader = new FileReader();
        reader.onload = function(e) {
        document.getElementById("display-image").src = e.target.result;
        }
        reader.readAsDataURL(image);
    } 
    </script>
    
    <input type="file" onchange="handleImageUpload()" id="upload" multiple />
    <img id="display-image" src="#" alt="your image" />

</body>
</html>````


I am just struggling to see how I have not found a useful video, website, or text discussing how to do this.
It seems as though this should be well-documented and/or easy to implement.
Maybe I am just crazy.

P粉715228019
P粉715228019

全部回复(1)
P粉713846879
P粉7138468792024-02-05 09:10:33 1 楼

这是关于如何上传的指南并在 mongodb 上检索图像

那么你需要一个全栈托管平台我为你推荐Cyclic（用户友好且免费） ）

然后您上传到 MongoDb 的任何图像都会出现在您的网站上 如果您愿意，您也可以将上传表单设为单独的页面，这只是为了向您展示其工作原理

使用 firebase 的另一种方式 这里

点赞 +0
添加回复
热门专题
更多>
热门文章
热门教程
更多>
相关教程
热门推荐
最新课程
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责声明 Sitemap
PHP中文网：公益在线PHP培训，帮助PHP学习者快速成长！