我正在从事一个项目,该项目涉及从各种网站获取图像并显示原始图像的缩略图或调整大小的版本。
由于我将一次获取许多图像,因此这需要更多时间,因为将加载原始图像文件。
我需要的是给定一个图像 url,我需要那个图像文件的调整大小的版本吗?这样我就不需要下载大型原始图像文件...
例如:
原始图像:500X800 约 500kb
我需要的是:100X150 一些 100kb 的图像文件..
可以使用 Jquery 吗?还是PHP?
它们是否具有 Jquery 或任何插件中的 imagecopyresampled(PHP) 之类的功能?
最佳答案
嗯,需要一次下载大文件来创建缩略图。
您可以通过 JQuery 向服务器请求缩略图,服务器下载文件,创建缩略图并在调整大小完成后将缩略图的 URL 发送回客户端。这样,客户将在准备就绪时逐渐收到缩略图。
编辑 经过一些试验后,我发现一旦 img 请求图片,即使您动态删除它的 src属性,下载继续。
所以我决定编写一个示例代码(没有太多的验证,它只适用于 jpeg,添加其他类型会很容易)。该解决方案分为 3 个部分:
HTML
首先,我使用了一个带有一些特定属性的空 div 来让 jQuery 加载什么。我需要向 Nuria Oliver 道歉,她拥有我能在网上找到的第一张“大图”。所以,这是一个示例 div:
<div class="thumbnail" data-source="http://www.nuriaoliver.com/pics/nuria1.jpg" data-thumbnail-width="100" data-thumbnail-height= "200"/></div>
我使用 thumbnail 作为 class 以便能够轻松找到我想要的 div。其他 data 参数允许我使用 source、width 和 height 配置缩略图。
JavaScript/jQuery
现在,我们需要找到所有这些请求缩略图的div...使用jQuery 非常容易。我们提取所有 data 设置并将它们放入一个数组中。然后,我们将查询提供给 PHP 页面并等待响应。在这样做的同时,我用一些显示“进度”的 HTML 填充 div
<script type="text/javascript">
$(".thumbnail").each(function() {
var img = $(this);
var thumbnailWidth = img.data("thumbnail-width");
var thumbnailHeight = img.data("thumbnail-height");
var thumbnailSource = img.data("source");
var innerDiv = "<div style='width:" + thumbnailWidth + "px; height:" + thumbnailHeight + "px'>Loading Thumbnail<br><img src='loading.gif'></div>";
img.html(innerDiv); // replace with placeholder
var thumbnailParams = {};
thumbnailParams['src'] = thumbnailSource;
thumbnailParams['width'] = thumbnailWidth;
thumbnailParams['height'] = thumbnailHeight;
$.ajax({
url: "imageloader.php",
data: thumbnailParams,
success: function(data) {
img.html("<img src='" + data + "'>");
},
});
})
</script>
PHP
在 PHP 方面,我做了一个快速测试,看看图片是否已经被缓存(我只使用文件名,这应该更复杂,但它只是给你举个例子)否则我下载图片,调整它的大小,将它存储在 thumbnail 文件夹中并返回 jQuery 的路径:
<?php
$url = $_GET["src"];
$width = $_GET["width"];
$height = $_GET["height"];
$filename = "thumbnail/" . basename($url);
if(is_file($filename)) // File is already cached
{
echo $filename;
exit;
}
// for now only assume JPG, but checking the extention should be easy to support other types
file_put_contents($filename, file_get_contents($url)); // download large picture
list($originalWidth, $originalHeight) = getimagesize($filename);
$original = imagecreatefromjpeg($filename); // load original file
$thumbnail = imagecreatetruecolor($width, $height); // create thumbnail
imagecopyresized($thumbnail, $original, 0, 0, 0, 0, $width, $height, $originalWidth, $originalHeight); // copy the thumbnail
imagedestroy($original);
imagejpeg($thumbnail, $filename); // overwrite existing file
imagedestroy($thumbnail);
echo $filename;
浏览器
那么,它到底做了什么?在浏览器中,当我打开页面时,我首先看到:
一旦服务器处理完图像,它就会自动更新为:
这是我们原始图片的缩略图版本,100x200。
我希望这涵盖了您需要的一切!
关于php - 在加载之前调整来自其他网站的外部图像的大小?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13746988/
我试图在一个项目中使用rake,如果我把所有东西都放到Rakefile中,它会很大并且很难读取/找到东西,所以我试着将每个命名空间放在lib/rake中它自己的文件中,我添加了这个到我的rake文件的顶部:Dir['#{File.dirname(__FILE__)}/lib/rake/*.rake'].map{|f|requiref}它加载文件没问题,但没有任务。我现在只有一个.rake文件作为测试,名为“servers.rake”,它看起来像这样:namespace:serverdotask:testdoputs"test"endend所以当我运行rakeserver:testid时
我的目标是转换表单输入,例如“100兆字节”或“1GB”,并将其转换为我可以存储在数据库中的文件大小(以千字节为单位)。目前,我有这个:defquota_convert@regex=/([0-9]+)(.*)s/@sizes=%w{kilobytemegabytegigabyte}m=self.quota.match(@regex)if@sizes.include?m[2]eval("self.quota=#{m[1]}.#{m[2]}")endend这有效,但前提是输入是倍数(“gigabytes”,而不是“gigabyte”)并且由于使用了eval看起来疯狂不安全。所以,功能正常,
我正在寻找执行以下操作的正确语法(在Perl、Shell或Ruby中):#variabletoaccessthedatalinesappendedasafileEND_OF_SCRIPT_MARKERrawdatastartshereanditcontinues. 最佳答案 Perl用__DATA__做这个:#!/usr/bin/perlusestrict;usewarnings;while(){print;}__DATA__Texttoprintgoeshere 关于ruby-如何将脚
鉴于我有以下迁移:Sequel.migrationdoupdoalter_table:usersdoadd_column:is_admin,:default=>falseend#SequelrunsaDESCRIBEtablestatement,whenthemodelisloaded.#Atthispoint,itdoesnotknowthatusershaveais_adminflag.#Soitfails.@user=User.find(:email=>"admin@fancy-startup.example")@user.is_admin=true@user.save!ende
我收到这个错误:RuntimeError(自动加载常量Apps时检测到循环依赖当我使用多线程时。下面是我的代码。为什么会这样?我尝试多线程的原因是因为我正在编写一个HTML抓取应用程序。对Nokogiri::HTML(open())的调用是一个同步阻塞调用,需要1秒才能返回,我有100,000多个页面要访问,所以我试图运行多个线程来解决这个问题。有更好的方法吗?classToolsController0)app.website=array.join(',')putsapp.websiteelseapp.website="NONE"endapp.saveapps=Apps.order("
我有一个服务模型/表及其注册表。在表单中,我几乎拥有服务的所有字段,但我想在验证服务对象之前自动设置其中一些值。示例:--服务Controller#创建Action:defcreate@service=Service.new@service_form=ServiceFormObject.new(@service)@service_form.validate(params[:service_form_object])and@service_form.saverespond_with(@service_form,location:admin_services_path)end在验证@ser
在Ruby中可以使用哪些替代方法来ping一个ip地址?标准库“ping”库的功能似乎非常有限。我对在这里滚动我自己的代码不感兴趣。有没有好的gem?我应该接受它并忍受它吗?(我在Linux上使用Ruby1.8.6编写代码) 最佳答案 net-ping值得一看。它允许TCPping(如标准rubyping),但也允许UDP、HTTP和ICMPping。ICMPping需要root权限,但其他则不需要。 关于ruby-Pingruby网站?,我们在StackOverflow上找到一个类
我一直致力于让我们的Rails2.3.8应用程序在JRuby下正确运行。一切正常,直到我启用config.threadsafe!以实现JRuby提供的并发性。这导致lib/中的模块和类不再自动加载。使用config.threadsafe!启用:$rubyscript/runner-eproduction'pSim::Sim200Provisioner'/Users/amchale/.rvm/gems/jruby-1.5.1@web-services/gems/activesupport-2.3.8/lib/active_support/dependencies.rb:105:in`co
我需要一些关于TDD概念的帮助。假设我有以下代码defexecute(command)casecommandwhen"c"create_new_characterwhen"i"display_inventoryendenddefcreate_new_character#dostufftocreatenewcharacterenddefdisplay_inventory#dostufftodisplayinventoryend现在我不确定要为什么编写单元测试。如果我为execute方法编写单元测试,那不是几乎涵盖了我对create_new_character和display_invent
我有带有Logo图像的公司模型has_attached_file:logo我用他们的Logo创建了许多公司。现在,我需要添加新样式has_attached_file:logo,:styles=>{:small=>"30x15>",:medium=>"155x85>"}我是否应该重新上传所有旧数据以重新生成新样式?我不这么认为……或者有什么rake任务可以重新生成样式吗? 最佳答案 参见Thumbnail-Generation.如果rake任务不适合你,你应该能够在控制台中使用一个片段来调用重新处理!关于相关公司