facebookクローラのカスタム画像を生成するには？

Question

私のウェブサイトはユーザーリストをうまく表示することができます。

Facebookはこのページをクロールするとき、私はしたいと思います：ページで、他のもののうち、私はこのような材料設計シート（画像、テキストやリストのいくつかの動的パラメータ）を表示しますこのような（あるいは少し単純な）ものを提供してください。明らかに、クライアント側だけに見えるので、動的に生成する必要があります。左上隅のサムネイルは小さすぎてFacebookだけに与えられません。その効果はそれほど喜ばしくないでしょう。

これを達成することは技術的に実現可能ですか？いくつかのライブラリはそれのために完了？

Answer 1

Webアプリケーションの1つで、特定の映画に対して投票を共有したいと思っていたのと同じ問題がありました。私が思いついたことは次のメタヘッダを各ユーザーの投票のためのユニークなページを作成しました：

<meta property="og:image" content="@share_image" /> 
<meta property="og:site_name" content="@SystemResource.application_name" /> 
<meta property="og:url" content="@share_url" /> 
<meta property="og:type" content="article" /> 
<meta property="og:title" content="@share_title" /> 
<meta property="og:description" content="@Model.review_text" /> 

私@share_imageは、その上に映画のカバーと、ユーザーの投票（1-10）で画像へのURLが含まれています。

ユーザーが投票し、それは次のように行われているとき、私は私の@share_imageを生成：

// main image 
Image canvas = Bitmap.FromFile(configData.MainImageAbolutePath); 

// vote image (circles with numbers from 1 to 10) 
Bitmap smallImg = new Bitmap(configData.OverlayImageAbolutePath); 

// create new image 
using (Graphics gr = Graphics.FromImage(canvas)) 
{ 
    // here you can play with quality 
    gr.SmoothingMode = SmoothingMode.HighQuality; 
    gr.InterpolationMode = InterpolationMode.HighQualityBicubic; 
    gr.PixelOffsetMode = PixelOffsetMode.HighQuality; 

    // place vote image on top of the cover using x and y coordinates 
    gr.DrawImage(smallImg, new Point(configData.X, configData.Y)); 
} 
// here you can play with quality 
ImageCodecInfo jgpEncoder = GetEncoderInfo(ImageFormat.Jpeg); 
Encoder myEncoder = Encoder.Quality; 
EncoderParameters myEncoderParameters = new EncoderParameters(1); 
EncoderParameter myEncoderParameter = new EncoderParameter(myEncoder, 100L); 
myEncoderParameters.Param[0] = myEncoderParameter; 

// generate our @share_image 
canvas.Save(configData.DestinationImageAbolutePath, jgpEncoder, myEncoderParameters); 

あなたも、この方法が必要になります。

public static ImageCodecInfo GetEncoderInfo(ImageFormat format) 
{ 
    ImageCodecInfo[] codecs = ImageCodecInfo.GetImageDecoders(); 
    foreach (ImageCodecInfo codec in codecs) 
    { 
     if (codec.FormatID == format.Guid) 
     { 
      return codec; 
     } 
    } 
    return null; 
} 

は、Graphicsクラスにこの参照を使用しますテキストやその他の要素を追加してください： https://msdn.microsoft.com/en-us/library/system.drawing.graphics(v=vs.110).aspx