如何在 Flask 中旋转图像？答案

【问题标题】：How to rotate the image in Flask?如何在 Flask 中旋转图像？
【发布时间】：2021-11-30 23:40:33
【问题描述】：

我正在编写一个 Flask 应用程序，用户可以在其中编辑照片并旋转它们。我添加了两个左右旋转的按钮：

<img class="card-img-top"
                         src="data:image/jpeg;base64,{{image}}"
                         alt="Edit pic"
                         name="originalPic">
<button class="btn" name="right_button"><i class="fa fa-rotate-right"></i></button>
<button class="btn" name="left_button"><i class="fa fa-rotate-left"></i></button>

在 python 代码中，我旋转了图像，但如果我在任何按钮上多次按下，图像不会继续旋转。如果我从右侧按钮切换并按下左侧按钮，它只会改变位置。另外，在python代码中，我使用的是HTML页面上显示的原始图像，但是如果用户旋转图片，它的位置会发生变化。如何在 Python 代码中传递旋转后的图像（图像的实际位置）？将图像实际旋转多少次，用户想要多少次，他按下任何按钮的次数就多少次。

def check_rotate(img):
    right_button_pushed = request.form.get('right_button')
    left_button_pushed = request.form.get('left_button')
    if type(right_button_pushed) == str:
        print('RIGHT')
        angle = 90
        rotated_image = img.rotate(angle)

    elif type(left_button_pushed) == str:
        print('LEFT')
        angle = -90
        rotated_image = img.rotate(angle)
    else:
        rotated_image = ''
    try:
        data = io.BytesIO()

        # First save image as in-memory.
        rotated_image.save(data, "PNG")

        # Then encode the saved image file.
        encoded_img_data = base64.b64encode(data.getvalue())
        return encoded_img_data  # rotated_image

    except AttributeError:
        pass

而我是这样使用上面的方法的：

@app.route('/', methods=['GET', 'POST'])
def index():
    original_image = "https://cdn.pixabay.com/photo/2017/09/25/13/12/cocker-spaniel-2785074__340.jpg"
    response = requests.get(original_image)
    img = Image.open(BytesIO(response.content))

    if request.method == 'POST':
        rotated_image = check_rotate(img) #How can I update the image to the image with the actual position of rotation?
        return render_template("index.html", image=rotated_image.decode('utf-8'))

【问题讨论】：

标签： python html image flask python-imaging-library

【解决方案1】：

我认为您会在发布请求时再次下载该图像。所以，图片只旋转一次。

【讨论】：

【解决方案2】：

您可以使用会话来标记您当前的角度图像

所以无论前端做什么，您都可以使用会话内存旋转图像

【讨论】：

【解决方案3】：

图片将被保存为文件，你只需使用 HTML 标签 'src' 获取它然后在浏览器上显示它，所以我认为你可以使用 CSS 旋转图片。给定一个盒子，使用 CSS 旋转盒子。

你不会真的想在每次按下并重新阅读时保存一张照片，即使你使用 ajax，我认为这仍然不是一个好主意。

【讨论】：

我想使用 Python 旋转图像，因为我将来会使用 opencv 库和其他库添加其他图像处理功能。如何使用 Python 多次旋转它来解决这个问题？ :)
用户点击->发送请求->flask接收请求->opencv旋转图像->opencv保存图像->flask重定向到原始路由并显示旋转图像。注意，不同的客户端可能同时操作同一张图片，需要考虑这一点。所以我建议使用 CSS。