跨域 iframe 拖放

Question

我知道这个问题有一个简单的解决方案，但相信我，我现在找不到。无论如何，我的问题是我必须从 iframe 中拖动图像（内容来自另一个域）并放入图像占位符中。演示在

http://popupbuilder.webege.com/IframeDragDropadil/

图像应该被拖到框中，并且它很好地坐在那里，只有当 iframe 加载来自同一域的内容时。但是，如果我像在演示中那样从另一个域加载内容（^ 上面提供了链接），那么整个事情就不起作用了。

现在我知道这是一个跨域问题。您不能只将来自另一个域的数据操作到您的 iframe 中。够公平！！

所以我想到了另一个想法，即通过 PHP 将整个页面复制到您的服务器，然后将其提供给 iframe。这听起来很有希望，但是 php 函数

<?php file_get_contents(); ?>

只返回 html 而不是完整的网页。同样，这将扼杀整个可用性概念，因为用户不知道要拖动什么。

最后一件事，如果我将图像从另一个浏览器窗口拖放到这个占位符，它就可以工作！我不知道 iframe 导致了什么问题以及如何解决。

使用 PHP 在本地服务器上复制整个网站可能是一种解决方案，但我不知道如何！

Answer 1

经过几天的努力，我想出了一个解决方案，它实际上可以帮助我们将事件绑定到 iframe 的元素，即使我们正在打开另一个网站（属于另一个域的网站）。最好的办法是将整个网站代理到我们自己的服务器上，然后在 iframe 中打开它。现在我们可以轻松地绑定事件和操作这个网站。

请注意，这种技术的准确率只有 70-80%。我创建的 PHP 脚本可能无法始终正确打开站点。有时代理站点进行的 AJAX 调用未完成。但是该脚本确实提供了一个很好的起点，欢迎其他开发人员对其进行扩展:)

   <?php

$opts = array('http' =>
    array(
        'method'  => 'GET',
        //'user_agent '  => "Mozilla/5.0 (X11; U; Linux x86_64; en-US; rv:1.9.2) Gecko/20100301 Ubuntu/9.10 (karmic) Firefox/3.6",
        'header' => array(
            'Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*\/*;q=0.8
'
        ), 
    )
);

     function is_url_exist($url){
            $ch = curl_init($url);
            $status = false;
            curl_setopt ($ch, CURLOPT_USERAGENT, "Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.1.6) Gecko/20070725 Firefox/2.0.0.6");
            curl_setopt($ch, CURLOPT_CONNECTTIMEOUT, 120);
            curl_setopt($ch, CURLOPT_TIMEOUT, 120);
            curl_setopt($ch, CURLOPT_NOBODY, true);
            curl_exec($ch);
            $code = curl_getinfo($ch, CURLINFO_HTTP_CODE);

            if($code == 200){
               $status = true;
            }else{
              $status = false;
            }
            curl_close($ch);
           return $status;
        }
    function get_web_page( $url )
    {
        $user_agent='Mozilla/5.0 (Windows NT 6.1; rv:8.0) Gecko/20100101 Firefox/8.0';

        $options = array(

            CURLOPT_CUSTOMREQUEST  =>"GET",        //set request type post or get
          //  CURLOPT_HTTPGET => true,
            CURLOPT_POST           =>false,        //set to GET
         //   CURLOPT_USERAGENT      => $user_agent, //set user agent
            CURLOPT_COOKIEFILE     =>"cookie.txt", //set cookie file
            CURLOPT_COOKIEJAR      =>"cookie.txt", //set cookie jar
            CURLOPT_RETURNTRANSFER => true,     // return web page
            //CURLOPT_HEADER         => true,    // don't return headers

            CURLOPT_FOLLOWLOCATION => true,     // follow redirects
            CURLOPT_ENCODING       => "",       // handle all encodings
            CURLOPT_AUTOREFERER    => true,     // set referer on redirect
            CURLOPT_CONNECTTIMEOUT => 120,      // timeout on connect
            CURLOPT_TIMEOUT        => 120,      // timeout on response
            CURLOPT_MAXREDIRS      => 10,       // stop after 10 redirects
        );

        $ch      = curl_init( $url );
        curl_setopt_array( $ch, $options );
        $content = curl_exec( $ch );
        $err     = curl_errno( $ch );
        $errmsg  = curl_error( $ch );
        $header  = curl_getinfo( $ch );
        curl_close( $ch );

        $header['errno']   = $err;
        $header['errmsg']  = $errmsg;
        $header['content'] = $content;
        return $content;
    }

     function GetDomainFromAddress($url){
       $parse = parse_url($url);
        $scheme = $parse['scheme'];
        $URL = $parse['host']; // prints 'domain.com'
        $URL = $scheme.'://'.$URL.'/';
        return $URL;
   }

    /*All functions end here*/

    $url=$_GET["url"];
//  $url="http://www.topshop.com/en/tsuk/product/new-in-this-week-2169932/new-in-this-week-493/blue-pleat-laceup-kilt-2441152?bi=1&ps=20";
    $input= get_web_page($url);

$domain = $url;
$doc = new DOMDocument;
   libxml_use_internal_errors(true);
   $doc->loadHTML($input);
    $tags = $doc->getElementsByTagName('img');

    if(count($tags) > 0)
    {
        foreach ($tags as $tag) {

           $src=$tag->getAttribute('src');

           if( !empty($src) )
           {
               if(strpos($src,"https")!==false||strpos($src,'//')!==false || strpos($src,"http")!==false)
               {                
               }
               else
               {
                    $src1 = null;
                    if(!is_url_exist($src))
                    {
                        $domain = GetDomainFromAddress($url);
                        $src1=$domain.$src;
                    }
                    $src=$src1;
               }
           }


           $tag->setAttribute('src', $src);

        }
    }

    $tags = $doc->getElementsByTagName('link');
    $i=0;
    if(count($tags) > 0)
    {
    foreach ($tags as $tag) {


           $src=$tag->getAttribute('href');

           if( !empty($src) )
           {
               if(strpos($src,"https")!==false||strpos($src,'//')!==false || strpos($src,"http")!==false)
               {                
               }
               else
               {
                    $src1 = null;
                    if(!is_url_exist($src))
                    { $domain = GetDomainFromAddress($url);
                        $src1=$domain.$src;
                    }
                    $src=$src1;
               }
           }

           $tag->setAttribute('href', $src);

        }
    }
        $tags = $doc->getElementsByTagName('script');

    if(count($tags) > 0)
    {
    foreach ($tags as $tag) {


           $src=$tag->getAttribute('src');

           if( !empty($src) )
           {
               if(strpos($src,"https")!==false||strpos($src,'//')!==false || strpos($src,"http")!==false)
               {                
               }
               else
               {
                    $src1 = null;
                    if(!is_url_exist($src))
                    { $domain = GetDomainFromAddress($url);
                        $src1=$domain.$src;
                    }
                    $src=$src1;
               }
           }

           $tag->setAttribute('src', $src);

        }
    }
echo $doc->saveHTML();
?>