Rumah  >  Soal Jawab  >  teks badan

python - Masalah avatar projek flasky <flask web>

Bagaimana untuk menukar kepada avatar tempatan tersuai? Adakah terdapat sebarang kod yang dilaksanakan? Sila berikan saya pautan Terima kasih

Alamat imej tempatan: ./static/avatar/1.jpg-9.jpg

Kod saya seperti ini:

def gravatar(self, size=100, default='identicon', rating='g'):
    import random
    return '%d.jpg' % random.randint(1, 9)
    

Panggilan adalah seperti ini:
<img class="img-rounded profile-thumbnail" src="{{ url_for('static', filename='avatar/') }}{{ current_user.avatar_hash }}"> ;

Gambar tidak boleh dimuatkan selepas saya mengubahsuainya seperti ini.

某草草某草草2686 hari yang lalu864

membalas semua(1)saya akan balas

  • 女神的闺蜜爱上我

    女神的闺蜜爱上我2017-06-12 09:24:28

    Selamat datang untuk berkomunikasi, saya juga sedang belajar Flask, tetapi saya tidak menggunakan contoh gavatar dalam buku, jadi saya tidak tahu di mana masalah anda...

    Mengenai avatar tempatan, saya mempunyai produk separuh siap yang ditulis oleh saya sendiri untuk rujukan, yang melaksanakan ajax muat naik avatar ke pelayan User 模型里添加了一个 avatar 字段, 存放头像路由相应的 url 路径, 通过访问头像路由得到头像文件. 上传的头像根据用户 idAVATARS_PER_FOLDER 个头像文件存放在 /static/img/avatr/n/ 中, 文件名是 u{id}.jpg

    Saya tidak dapat menerangkannya secara terperinci kerana kekangan masa, dialu-alukan untuk berkomunikasi~


    pelan tindakan belakang -

    : app/backend/views.py

    Kendalikan muat naik avatar dan pulangkan avatar

    @backend.route("/avatar/<int:id>", methods=["GET", "POST"])
    def avatar(id):
        # 设置头像存储路径
        avatar_folder = current_app.config["UPLOAD_FOLDER"] + "avatar/"
        # 按照 id 计算头像存储位置
        r = id // current_app.config["AVATARS_PER_FOLDER"]
        save_location = avatar_folder + str(r)
        # jpg
        filename = "u{}.jpg".format(id)
    
        # 处理头像上传
        # TODO: CSRF 保护
        if request.method == "POST" and request.is_xhr:
            # base64 -> img
            img_b64 = request.form.get("img")
            img_b64 = re.sub(r"data:image/.+;base64,", "", img_b64)
            img = Image.open(BytesIO(base64.b64decode(img_b64)))
            # 保存文件
            if not os.path.exists(save_location):
                os.mkdir(save_location)
            img.save(os.path.join(save_location, filename))
            # 更新数据库
            u = User.query.get_or_404(id)
            u.avatar = url_for("backend.avatar", id=id)
            db.session.add(u)
            # 返回响应
            return jsonify(result="success")
    
    return send_from_directory(save_location, filename)

    halaman html -

    : app/templates/user_settings.html

    Kendalikan muat naik avatar dan kemas kini paparan melalui ajax

    <p class="settings_avatar">
        <a class="avatar" href="#">
            <img alt="头像" class="img-circle" src="{{ current_user.avatar }}">
        </a>
        <input id="upload_avatar" type="file" accept="image/*">
    </p>

    Pemalam localResizeIMG digunakan di sini untuk memampatkan imej, mendapatkan pengekodan base64 imej, dan meneruskan fungsi

    untuk memuat naik secara tidak segerak, paparan avatar akan dikemas kini

    <script>
        $(function() {
            var URL_ROOT = {{ request.url_root | tojson | safe }};
            var id = {{ current_user.id }}
        
            $("#upload_avatar").on("change", function() {
                // 使用了
                lrz(this.files[0])
                .then(function (rst)
                    upload_avatar(URL_ROOT, id, rst);
                })
                .catch(function (err) {
                    alert(err);
                })
                .always(function () {});
            })
        })
        function upload_avatar(URL_ROOT, id, rst) {
            r = "backend/avatar/" + id;
            $.post(
                URL_ROOT+r,
                {
                    img: rst.base64,
                },
                function(data) {
                    if (data.result === "success") {
                        $(".settings_avatar .avatar .img-circle").attr("src", rst.base64);
                    }
                }
            )
        }
    </script>

    balas
    0
  • Batalbalas