Question

我正在尝试 html2render （http://html2canvas.hertzen.com/）在我的网站上工作。它适用于基本的东西 - 但没有图像显示（因为它们在cdn.domain.com子域上）。

我一直在阅读，似乎它不喜欢开箱即用的其他域名。我找到了几个PHP代理脚本：

我尝试了这些，但我们没有在此服务器上启用 curl 。所以，我正在使用Perl编写一些东西。

这是我到目前为止所得到的：

use MIME::Base64;
use File::Slurp;

handle();

sub handle {

    print ('Access-Control-Max-Age:' . 5 * 60 * 1000);
    print ("Access-Control-Allow-Origin: *");
    print ('Access-Control-Request-Method: *');
    print ('Access-Control-Allow-Methods: OPTIONS, GET');
    print ('Access-Control-Allow-Headers *');
    print ("Content-Type: application/javascript");

    #print $IN->header;

    my $url = $IN->param('url');

    $url =~ s|https://cdn.xxx.net|/srv/www/xxx.net/www|g;

    if (-e $url) {

        my $file = read_file($url);

        use JSON;

        my $mime_type;
        if ($url =~ /\.jpe?g$/i) {
            $mime_type = "image/jpg"
        } elsif ($url =~ /\.png$/i) {
            $mime_type = "image/png"
        }
        print JSON::encode_json([{
            "pathinfo" => $url,
            "error" => undef,
            "data" => encode_base64($file),
            "mime_type" => $mime_type
        }]);
    } else {
        print "ACK!";
    }

}

然而，它仍然不起作用:(代理上的文件很少（没有??）（除了告诉你在某些情况下你需要它！）

任何人都可以分享输出数据应该是什么样子吗？我尝试基于上面的示例代码来解决它，但我的PHP有点生疏（我没有启用PHP和Curl的服务器，我可以测试它）

谢谢！

Answer 1

好吧，关于代理的答案并非如此 - 但我确实遇到了一个帖子：

HTML2Canvas with CORS in S3 and CloudFront

在这里，显示了一个使用示例：

html2canvas(document.body, {
  useCORS: true,
  onrendered: function(canvas) {

  }
});

...所以我试过了：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <com.astuetz.PagerSlidingTabStrip
        android:id="@+id/tabs"
        android:layout_width="match_parent"
        android:layout_height="48dip"
        android:background="@drawable/background_tabs" />

<FrameLayout android:layout_width="match_parent" android:layout_height="match_parent">
    <android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_above="@+id/colors"
        android:layout_below="@+id/tabs"
        tools:context=".MainActivity" />
</FrameLayout>
...

......它有效!!!!

在我的实例中，我只是使用domain.com和cdn.domain.com作为CDN。如果您正在使用其他第三方CDN，则可能需要查看启用CORs标头。

正确的html2canvas代理脚本

1 个答案: