小编Ten*_*cte的帖子

所以我有一个包含两个图像元素的网页.它基本上是一个上传图像的网站,它使用隐写术加密秘密按摩.我想展示其他方面看不到的区别,我发现了Resemble.js,它是一个比较图像的库.它获取两个文件作为参数,我想使用我的图像源而不是文件,因为我不想保存生成的图像.

总而言之,我想摆脱请求并通过HTML中的源获取我的图像,但我不知道如何使用Resemble.js,因为它只接受文件.

如何生成第二个图像:

cover.src = steg.encode(textarea.value, img, { 
  "width": img.width, 
  "height": img.height
});

使用文件的JavaScript:

(function () {
  var xhr = new XMLHttpRequest();
  var xhr2 = new XMLHttpRequest();
  var done = $.Deferred();
  var dtwo = $.Deferred();

  try {
    xhr.open('GET', 'static/original.png', true);
    xhr.responseType = 'blob';
    xhr.onload = function (e) { done.resolve(this.response); };
    xhr.send();

    xhr2.open('GET', 'static/encoded.png', true);
    xhr2.responseType = 'blob';
    xhr2.onload = function (e) { dtwo.resolve(this.response); };
    xhr2.send();
  } catch (err) {
    alert(err);
  }

  $('#example-images').click(function () {
    $.when(done, dtwo).done(function (file, file1) …

我有这个ajax请求

$(function() {
    $('#left').bind('click', function() {
        var form = $('form#data')[0]; // 
        var formData = new FormData(form);

        $.ajax({
            url: "{{ url_for('encode') }}",
            type: 'POST',
            data: formData,
            async: false,
            success: function (data) {
                $("#img-2").attr("src", "{{url_for('static', filename='encoded.png')}}");
                $("#diff").show();
            },
            cache: false,
            contentType: false,
            processData: false
            });

        });
});

当按钮被点击时，这个烧瓶函数就会运行。

@app.route('/encode', methods=['GET', 'POST'])
def encode():
    a = request.form['text']
    img = request.files['files']
    img.save("./static/original.png")
    secret = lsb.hide(img, a)
    secret.save("./static/encoded.png")
    return "ok"

我遇到的问题是网页会在一瞬间变成，因为它应该设置图像并显示按钮差异。但在那之后网页重新加载并重置为索引页面。我真的不知道如何防止这种情况发生。我究竟做错了什么？