Question

我正在尝试弄清楚如何在查看控制台或源代码时隐藏图像的url。

我已经看到其他人在问这个问题，以防止用户下载图像，但这不是问题-实际上，他们应该能够下载/保存图像。

真正的原因是因为我的用户正在将我网站上的图像上传到cloudinary之类的第三方存储服务。我不希望用户知道图像的去向，因为恐怕他们可以操纵发送或接收的数据。即使只是在检查发送/接收的图像确实是图像URL而不是恶意代码或任何东西之后，这也只是一种附加的安全措施。

对于在控制台中隐藏URL的建议是什么？我完全不知道从哪里开始。

详细说明：用户单击我网站上的“浏览文件”，然后单击“上载”。文件被传输到cloudinary进行存储。然后，我的网站从cloudinary获取图像URL，将该URL存储在我的数据库中，并在用户个人资料的div框中显示它们。像这样：

<div class="listing_img" style="background-image:url('.$img_url.');"></div>

其中$ img_url是数据库中的一行。

排序类似于图像存储网站，但不完全是，人们不会来我的网站存储图像。用户将不会在任何阶段能看到哪些API URL它们的图象被发送到，当然，除非他们看到“IMG SRC = akdklasdjakl”浏览器控制台内。

我不确定这是否是正确的方法，但这似乎不是一个坏主意。

Answer 1

您可以尝试使用data-uri添加的图像数据，而不是图像的URL - 您会为内嵌图片。因此，在CSS，你可以尝试：

style="background:url(data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOVSKu..... etc) no-repeat;"

例如：

这使用远程映像，但是您可以使用本地文件路径-甚至那些没有文档根目录的文件路径。

    $source='http://jumanjipets.co.uk/wp-content/uploads/2018/02/koi.jpg';
    $contents=file_get_contents( $source );

    printf( "<img src='data:image/jpeg;base64, %s' />", base64_encode( $contents ) );

Answer 2

另一种方法是通过您自己的服务器提供图像。只需坚持例如的约定。图片 ID 将它们转换回原始图片网址。

用户获得带有 .. ... import {CartModule} from '@vue-storefront/core/modules/cart'; import {MyAwesomeCart} from "modules/cart/index"; export function registerClientModules() { registerModule(CartModule); // original module registerModule(MyAwesomeCart); // your new overwiritng module ... .. 的页面。

将以“^/img”开头的 url 重定向到脚本以检索服务器上的图像并从那里返回图像。

<img src="/img-1.jpg">

用户看不到原始来源。只有您可以将图片 ID 链接到来源。

有没有一种方法来隐藏从普通用户的图片网址？

2 个答案: