前台在线查看图片

原创已于 2025-06-26 09:40:39 修改 · 369 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#前端 #javascript #开发语言

于 2025-06-26 09:38:57 首次发布

// 如果content-type不规范 可以使用:

const previewWindow = window.open('', '_blank');
previewWindow.document.write(`
    <html>
        <head>
            <style>
                body, html {
                    margin: 0;
                    padding: 0;
                    width: 100%;
                    height: 100%;
                    overflow: hidden; /* 禁用滚动条 */
                }
                img {
                    max-width: 100%;
                    max-height: 100%;
                    object-fit: contain; /* 保持比例，完整显示 */
                    position: absolute;
                    top: 50%;
                    left: 50%;
                    transform: translate(-50%, -50%); /* 居中 */
                }
            </style>
        </head>
        <body>
            <img src="${url}" />
        </body>
    </html>
`);

// 如果content-type规范后台在上传时已指定: