
<rss version="2.0" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:media="http://search.yahoo.com/mrss/">
    <channel>
        <title><![CDATA[ The Cloudflare Blog ]]></title>
        <description><![CDATA[ Get the latest news on how products at Cloudflare are built, technologies used, and join the teams helping to build a better Internet. ]]></description>
        <link>https://blog.cloudflare.com</link>
        <atom:link href="https://blog.cloudflare.com/" rel="self" type="application/rss+xml"/>
        <language>en-us</language>
        <image>
            <url>https://blog.cloudflare.com/favicon.png</url>
            <title>The Cloudflare Blog</title>
            <link>https://blog.cloudflare.com</link>
        </image>
        <lastBuildDate>Fri, 10 Apr 2026 03:36:40 GMT</lastBuildDate>
        <item>
            <title><![CDATA[Preserving content provenance by integrating Content Credentials into Cloudflare Images]]></title>
            <link>https://blog.cloudflare.com/preserve-content-credentials-with-cloudflare-images/</link>
            <pubDate>Mon, 03 Feb 2025 14:00:00 GMT</pubDate>
            <description><![CDATA[ Media and journalism companies can now build end-to-end workflows that support Content Credentials by using Cloudflare Images.  ]]></description>
            <content:encoded><![CDATA[ <p>Today, we are thrilled to announce the integration of the <a href="https://c2pa.org/about/"><u>Coalition for Content Provenance and Authenticity (C2PA)</u></a> provenance standard into Cloudflare Images. Content creators and publishers can seamlessly preserve the entire provenance chain — from how an image was created and by whom, to every subsequent edit — across the Cloudflare network.</p>
    <div>
      <h3>What is the C2PA and the Content Authenticity Initiative?</h3>
      <a href="#what-is-the-c2pa-and-the-content-authenticity-initiative">
        
      </a>
    </div>
    <p>When you hear the word provenance, you might have flashbacks to your high school Art History class. In that context, it means that the artwork you see at the <a href="https://www.metmuseum.org/"><u>Met</u></a> in New York really came from the artist in question and isn’t a fake. Its provenance is how that piece of physical art changed possession over time, from the original artist all the way to the museum. </p><p>Digital content provenance builds upon this concept. It helps you understand how a piece of digital media — images, videos, PDFs, and more — was created and subsequently edited. The provenance of a photo I posted on Instagram might look like this: I took the picture with my iPhone, performed an auto-magic edit using Apple Photos’ editing tools, uploaded it to Instagram, cropped it using Instagram’s editing tools, and then posted it. </p><p>Why does digital content provenance matter? At a fundamental level, it’s an important way to give content creators credit for their work. Many photographers have had the experience of seeing their photograph or video go viral online, but with their name and attribution stripped away. In that scenario, the opportunities that might have accrued to the creator once the world saw their work don’t materialize. If you help ensure an artist or content creator gets credit for their work, that exposure could result in more career opportunities. </p><p>Digital content provenance can also be an important tool in understanding the world around us. If you see a video or a photo of a newsworthy event, you’d like to know if that photo was really taken at that particular location, or if it was from years prior at a different location. If you see a grainy picture of a UFO flying over New Jersey, knowing when and where that photo was taken is helpful information in understanding what is actually happening. </p><p>The C2PA is a project of the non-profit <a href="https://jointdevelopment.org/"><u>Joint Development Foundation</u></a> and has developed technical specifications for attaching digital content provenance to a piece of media. The standards also specify how to cryptographically sign that manifest, thereby allowing anyone to verify that the manifest hasn't been tampered with. The JSON manifests and the associated signatures are together referred to as<b> </b><a href="https://contentcredentials.org/"><b><u>Content Credentials</u></b></a>.</p><p>The Adobe-led <a href="https://contentauthenticity.org/"><u>Content Authenticity Initiative</u></a>, which has thousands of members across a variety of industries, aims to drive global adoption of Content Credentials. </p>
    <div>
      <h3>Why integrate Content Credentials into Cloudflare Images?</h3>
      <a href="#why-integrate-content-credentials-into-cloudflare-images">
        
      </a>
    </div>
    <p><a href="https://www.cloudflare.com/developer-platform/products/cloudflare-images/"><u>Cloudflare Images</u></a> allows you to build an effortlessly scalable and cost-effective image pipeline. With our new Content Credentials integration, you can now preserve existing Content Credentials, ensuring they remain intact from creation all the way to end-user delivery.</p><p>Many media organizations across the globe, such as the BBC, the New York Times, and Dow Jones, are members of the <a href="https://contentauthenticity.org/"><u>Content Authenticity Initiative</u></a>. Imagine one of these news organizations wanted to include the Content Credentials of their photojournalist’s photos and allow anyone to verify the provenance of that image. Before now, even if the news organization was using a C2PA-compliant <a href="https://www.nikonusa.com/press-room/nikon-develops-firmware-that-adds-function-compliant-with-cp2a-standards-to-z6iii"><u>camera</u></a> and <a href="https://helpx.adobe.com/lightroom-cc/using/content-credentials.html"><u>editing flow</u></a>, these credentials would frequently be stripped if the image was transformed by their <a href="https://www.cloudflare.com/learning/cdn/what-is-a-cdn/"><u>CDN</u></a>.</p><p>If you use Cloudflare, that is now a solved problem. In Cloudflare Images, you can now preserve Content Credentials when transforming images from remote sources. Enabling this integration will retain any existing Content Credentials that are embedded in the image.</p><p>When you use Images to resize or change the file format to your images, these transformations will be cryptographically signed by Cloudflare. This ensures, for example, that the end-user who sees the photograph on your website can use an open-source verification service such as <a href="https://contentcredentials.org/verify"><u>contentcredentials.org/verify </u></a> to verify the full provenance chain. </p>
    <div>
      <h3>How it works</h3>
      <a href="#how-it-works">
        
      </a>
    </div>
    <p>Imagine you are a photojournalist using <a href="https://www.nikonusa.com/press-room/nikon-develops-firmware-that-adds-function-compliant-with-cp2a-standards-to-z6iii"><u>a Nikon camera that has C2PA-compliant signing</u></a>. That photojournalist  could opt to attach Content Credentials to their photo, identifying the key elements of the photograph such as the camera model, the original image size, and aperture settings. </p><p>Below is a simplified example of what a <a href="https://c2pa.org/specifications/specifications/2.1/index.html"><u>C2PA-compliant </u></a>Content Credential for a photograph taken with that Nikon camera could look like. </p><p>Content Credentials are stored using <a href="https://www.iso.org/standard/84635.html"><u>JUMBF</u></a> (JPEG Universal Metadata Box Format), which serves as a standardized container format for embedding metadata within files. You can think of it as an envelope system that packages together both the data about where a piece of digital content came from and how it changed, as well as the cryptographic signatures that can be used to verify that data.</p><p>The assertions, or facts about the content provenance, are typically written in JSON for a better developer experience. Note that this example deliberately simplifies the <a href="https://c2pa.org/specifications/specifications/1.0/specs/C2PA_Specification.html#_use_of_jumbf"><u>JUMBF box nesting</u></a> and adds comments to make it easier to follow.</p>
            <pre><code>{
  "jumbf": {
    "c2pa.manifest": {
      "claim_generator": "Nikon Z9 Firmware v1.2",
      "assertions": [
        {
          "label": "c2pa.actions",
          "data": {
            "actions": [
              {
                "action": "c2pa.captured",
                "when": "2025-01-10T12:00:00Z",
                "softwareAgent": "Nikon Z9",
                "parameters": {
                  "captureDevice": "NIKON Z9",
                  "serialNumber": "7DX12345",
                  "exposure": "1/250",
                  "aperture": "f/2.8",
                  "iso": 100,
                  "focalLength": "70mm"
                }
              }
            ]
          }
        }
      ],
      "signature_info": {
        "issuer": "Nikon",
        "time": "2025-01-10T12:00:00Z",
        "cert_fingerprint": "01234567890abcdef"
      },
      "claim_metadata": {
        "claim_id": "nikon_z9_123"
      }
    }
  }
}</code></pre>
            <p>Now imagine that you want to use this photograph on your website. </p><p>If you’ve enabled the Preserve Content Credentials setting in Cloudflare, then that metadata is now preserved in Cloudflare Images. </p><p>If you use Cloudflare Images to dynamically resize or transform this image, then Cloudflare automatically appends and cryptographically signs any additional actions in that same manifest. Below we show what the new Content Credentials could look like. </p>
            <pre><code>{
  "jumbf": {
    // Original Nikon manifest
    "c2pa.manifest.nikon": {
  /*unchanged*/      
},

    // New Cloudflare manifest
    "c2pa.manifest.cloudflare": {
      "claim_generator": "Cloudflare Images",
      "assertions": [
        {
          "label": "c2pa.actions",
          "data": {
            "actions": [
              {
                "action": "c2pa.resized",
                "when": "2025-01-10T12:05:00Z",
                "softwareAgent": "Cloudflare Images",
                "parameters": {
                  "originalDimensions": {
                    "width": 8256,
                    "height": 5504
                  },
                  "newDimensions": {
                    "width": 800,
                    "height": 533
                  }
                }
              }
            ]
          }
        }
      ],
      "signature_info": {
        "issuer": "Cloudflare, Inc",
        "time": "2025-01-10T12:05:00Z",
        "cert_fingerprint": "fedcba9876543210"
      },
      "claim_metadata": {
        "claim_id": "cf_resize_123",
        "parent_claim_id": "nikon_z9_123"
      }
    }
  }
}</code></pre>
            <p>In this example, the <code>c2pa.action.resized</code> entry describes a non-destructive transformation from one set of dimensions to another. This is included as a separate, independent assertion about this particular photograph. </p><p>Notice how there are two cryptographic signatures in this manifest, each referenced by <code>signature_info</code>. Since there were two entities involved in this example image — Nikon for the image’s creation, then Cloudflare for resizing it — both Nikon and Cloudflare independently signed their respective assertions about the content provenance.  </p><p>In this example, the signature reference looks like this: </p>
            <pre><code>"signature_info": {
        "issuer": "Cloudflare, Inc",
        "time": "2025-01-10T12:05:00Z",
        "cert_fingerprint": "fedcba9876543210"</code></pre>
            <p>During the creation, editing, and resizing process of a piece of digital content, a unique hash of metadata is created for each action and then signed using a private key. The signature, along with the signer’s public certificate or reference to it, are contained in the JUMBF container as referenced by this JSON. </p><p>These hashes and signatures allow any open source verification tool to recalculate the hash, validate it against the signature, and check the certificate chain to ensure trustworthiness for each action taken on the image. This is what is meant by Content Credentials being tamper-evident: if any of these hashes and signatures fail to validate, it means that the metadata has been tampered with. </p><p>Each cryptographic signature is part of a <a href="https://opensource.contentauthenticity.org/docs/verify-known-cert-list/"><u>Trust List</u></a>, allowing anyone to verify the provenance chain across various entities, such as from a camera manufacturer to photo editing software to distribution across Cloudflare. <a href="https://opensource.contentauthenticity.org/docs/manifest/signing-manifests"><u>More from the Content Authenticity Initiative</u></a>: </p><blockquote><p><i>Trust lists connect the end-entity certificate that signed a manifest back to the originating root CA. This is accomplished by supplying the subordinate public X.509 certificates forming the trust chain (the public X.509 certificate chain).</i></p></blockquote><p>In order for Cloudflare to append the Content Credentials with any transformations, we needed to have a publicly available end-entity certificate and join this Trust List. Here we used DigiCert for our end-entity certificate and reference this certificate in the JSON manifests that we are now creating in production:</p>
            <pre><code>"signature_info": {
        "alg": "sha256",
        "issuer": "Cloudflare, Inc",
        "cert_serial_number": "073E9F61ADE599BE128B02EDC5BD2BDE",
        "time": "2024-01-06T22:42:36+00:00"
      },</code></pre>
            <p>The end result is that news organizations, journalists, and content companies can now create an auditable chain of digital provenance whose claims can be verified using public-key cryptography.  </p>
    <div>
      <h3>Let’s see an example</h3>
      <a href="#lets-see-an-example">
        
      </a>
    </div>
    <p>Earlier this year, OpenAI announced their <a href="https://openai.com/index/understanding-the-source-of-what-we-see-and-hear-online/"><u>support for including Content Credentials in DALL-E</u></a>. I recently created an image in DALL-E (with ski season on my mind).</p><p>Cloudflare Images allows you to transform any image <a href="https://developers.cloudflare.com/images/transform-images/transform-via-url/"><u>by URL</u></a>. You can do so by simply changing the URL structure using this syntax: </p>
            <pre><code>https://&lt;ZONE&gt;/cdn-cgi/image/&lt;OPTIONS&gt;/&lt;SOURCE-IMAGE&gt;</code></pre>
            <p>We can break down each of these parameters:</p><ul><li><p>ZONE is your particular domain.</p></li><li><p>cdn-cgi/image is a fixed prefix that identifies that this is a special path handled by a built-in Worker.</p></li><li><p>The OPTIONS parameter allows you to then transform the image — rotating it, changing the width, compressing it, and more. </p></li><li><p>SOURCE-IMAGE is the URL where your image is currently hosted.</p></li></ul><p>To tie these together, I then have a new URL structure where I want to change the width and quality of the image I created in DALL-E and display this on my personal website. After uploading the image from DALL-E to one of my R2 buckets, I can create this URL: </p>
            <pre><code>https://williamallen.com/cdn-cgi/image/width=1000,quality=75,format=webp/https://pub-3d2658f6f7004dc38a4dd6be147b6a86.r2.dev/dalle.webp</code></pre>
            <p>Anyone can now verify its provenance using the <a href="https://contentcredentials.org/verify?source=https://williamallen.com/cdn-cgi/image/width=1000,quality=75,format=webp/https://pub-3d2658f6f7004dc38a4dd6be147b6a86.r2.dev/dalle.webp"><u>Content Credentials Verify</u></a> tool to see the result. The provenance chain is fully intact, even after using the Cloudflare Images transformation shown above to resize the image. </p>
          <figure>
          <img src="https://cf-assets.www.cloudflare.com/zkvhlag99gkb/p3qbySgWdTzk3IJTevbiU/bae7969708006369a70f8e6cfd7ae2bf/Screenshot_2025-01-29_at_19.00.56.png" />
          </figure><p>There are numerous open source command line tools that allow you to explore the full details of the Content Credentials. <a href="https://opensource.contentauthenticity.org/docs/c2patool/"><u>The C2PA Tool</u></a> is created and maintained by the Content Authenticity Initiative. You can read more about the <a href="https://opensource.contentauthenticity.org/docs/c2patool/docs/usage"><u>tool here</u></a> and view the source code for it on <a href="https://github.com/contentauth/c2pa-rs/tree/main/cli"><u>GitHub</u></a>.</p><p>There are two ways to <a href="https://github.com/contentauth/c2pa-rs/tree/main/cli#installation"><u>install the tool</u></a>: through a pre-built binary executable, or using <a href="https://lib.rs/crates/cargo-binstall"><u>Cargo Binstall</u></a> if you have already installed Rust. Once installed, the C2PA Tool uses this syntax in your command line: </p>
            <pre><code>c2patool [OPTIONS] &lt;PATH&gt; [COMMAND]</code></pre>
            <p>If I navigate to the <a href="https://williamallen.com/cdn-cgi/image/width=1000,quality=75/https://pub-3d2658f6f7004dc38a4dd6be147b6a86.r2.dev/dalle.webp"><u>link of the image</u></a> in my browser and save it to my downloads folder on my Mac, then I simply need to use the command -d (short for -detailed) to see the full details of the JSON manifest. Of course, you should change <i>yourusername</i> to your actual Mac username.</p>
            <pre><code>c2patool /Users/yourusername/Downloads/dalle.webp -d</code></pre>
            <p>And if you wanted to output this to a JSON file that you can review in VSCode or Cursor, use this command instead:</p>
            <pre><code>c2patool /Users/yourusername/Downloads/dalle.webp -d &gt; manifest.json</code></pre>
            <p>This allows you to not just trust, but verify, the details of the image transformation yourself. </p>
    <div>
      <h3>How to start using Cloudflare Images with Content Credentials </h3>
      <a href="#how-to-start-using-cloudflare-images-with-content-credentials">
        
      </a>
    </div>
    <p>It’s straightforward to start preserving Content Credentials. Log in to your Cloudflare dashboard and navigate to Images in the dashboard. From there, choose Transformations and choose a Zone where you want to enable this feature. Then toggle this option to on:</p>
          <figure>
          <img src="https://cf-assets.www.cloudflare.com/zkvhlag99gkb/6R24DfomWKBsb5SKMFmZU7/99049bd789ea89b4869bef9c8f0040f2/image2.png" />
          </figure><p>If the images you are transforming do not contain any Content Credentials, no action is taken. But if they do, we preserve those Content Credentials and attest to any transformations. </p>
    <div>
      <h3>Looking ahead</h3>
      <a href="#looking-ahead">
        
      </a>
    </div>
    <p>We are excited to continue to partner with Adobe and many other organizations to extend support for preserving Content Credentials across our products and services. If you are interested in learning more, we’d love to hear from you: I’m <a href="https://x.com/williamallen"><u>@williamallen</u></a> on X or on <a href="https://www.linkedin.com/in/williamallen2050/"><u>LinkedIn</u></a>.</p> ]]></content:encoded>
            <category><![CDATA[Cloudflare Images]]></category>
            <category><![CDATA[Image Resizing]]></category>
            <category><![CDATA[Image Storage]]></category>
            <guid isPermaLink="false">6ARFFVfePEkB83ZjH6H8vg</guid>
            <dc:creator>Will Allen</dc:creator>
        </item>
        <item>
            <title><![CDATA[What’s new with Cloudflare Media: updates for Calls, Stream, and Images]]></title>
            <link>https://blog.cloudflare.com/whats-next-for-cloudflare-media/</link>
            <pubDate>Thu, 04 Apr 2024 13:00:40 GMT</pubDate>
            <description><![CDATA[ With Cloudflare Calls in open beta, you can build real-time, serverless video and audio applications. Cloudflare Stream lets your viewers instantly clip from ongoing streams ]]></description>
            <content:encoded><![CDATA[ <p></p><p>Our customers use Cloudflare Calls, Stream, and Images to build live, interactive, and real-time experiences for their users. We want to reduce friction by making it easier to get data into our products. This also means providing transparent pricing, so customers can be confident that costs make economic sense for their business, especially as they scale.</p><p>Today, we’re introducing four new improvements to help you build media applications with Cloudflare:</p><ul><li><p>Cloudflare Calls is in open beta with transparent pricing</p></li><li><p>Cloudflare Stream has a Live Clipping API to let your viewers instantly clip from ongoing streams</p></li><li><p>Cloudflare Images has a pre-built upload widget that you can embed in your application to accept uploads from your users</p></li><li><p>Cloudflare Images lets you crop and resize images of people at scale with automatic face cropping</p></li></ul>
    <div>
      <h3>Build real-time video and audio applications with Cloudflare Calls</h3>
      <a href="#build-real-time-video-and-audio-applications-with-cloudflare-calls">
        
      </a>
    </div>
    <p>Cloudflare Calls is now in open beta, and you can activate it from your dashboard. Your usage will be free until May 15, 2024. Starting May 15, 2024, customers with a Calls subscription will receive the first terabyte each month for free, with any usage beyond that charged at $0.05 per real-time gigabyte. Additionally, there are no charges for inbound traffic to Cloudflare.</p><p>To get started, read the <a href="https://developers.cloudflare.com/calls/">developer documentation for Cloudflare Calls</a>.</p>
    <div>
      <h3>Live Instant Clipping: create clips from live streams and recordings</h3>
      <a href="#live-instant-clipping-create-clips-from-live-streams-and-recordings">
        
      </a>
    </div>
    <p>Live broadcasts often include short bursts of highly engaging content within a longer stream. Creators and viewers alike enjoy being able to make a “clip” of these moments to share across multiple channels. Being able to generate that clip rapidly enables our customers to offer instant replays, showcase key pieces of recordings, and build audiences on social media in real-time.</p><p>Today, <a href="https://www.cloudflare.com/products/cloudflare-stream/">Cloudflare Stream</a> is launching Live Instant Clipping in open beta for all customers. With the new Live Clipping API, you can let your viewers instantly clip and share moments from an ongoing stream - without re-encoding the video.</p><p>When planning this feature, we considered a typical user flow for generating clips from live events. Consider users watching a stream of a video game: something wild happens and users want to save and share a clip of it to social media. What will they do?</p><p>First, they’ll need to be able to review the preceding few minutes of the broadcast, so they know what to clip. Next, they need to select a start time and clip duration or end time, possibly as a visualization on a timeline or by scrubbing the video player. Finally, the clip must be available quickly in a way that can be replayed or shared across multiple platforms, even after the original broadcast has ended.</p><p>That ideal user flow implies some heavy lifting in the background. We now offer a manifest to preview recent live content in a rolling window, and we provide the timing information in that response to determine the start and end times of the requested clip relative to the whole broadcast. Finally, on request, we will generate on-the-fly that clip as a standalone video file for easy sharing as well as an HLS manifest for embedding into players.</p><p>Live Instant Clipping is available in beta to all customers starting today! Live clips are free to make; they do not count toward storage quotas, and playback is billed just like minutes of video delivered. To get started, check out the <a href="https://developers.cloudflare.com/stream/stream-live/live-instant-clipping/">Live Clipping API in developer documentation</a>.</p>
    <div>
      <h3>Integrate Cloudflare Images into your application with only a few lines of code</h3>
      <a href="#integrate-cloudflare-images-into-your-application-with-only-a-few-lines-of-code">
        
      </a>
    </div>
    <p>Building applications with user-uploaded images is even easier with the upload widget, a pre-built, interactive UI that lets users upload images directly into your Cloudflare Images account.</p>
            <figure>
            
            <img src="https://cf-assets.www.cloudflare.com/zkvhlag99gkb/1MVN5ibd1UGnokaEm7f1Vq/8efedb285ec93d52867d78ca63cb454b/image3-9.png" />
            
            </figure><p>Many developers use <a href="https://www.cloudflare.com/developer-platform/cloudflare-images/">Cloudflare Images</a> as an end-to-end image management solution to support applications that center around user-generated content, from AI photo editors to social media platforms. Our APIs connect the frontend experience – where users upload their images – to the storage, optimization, and delivery operations in the backend.</p><p>But building an application can take time. Our team saw a huge opportunity to take away as much extra work as possible, and we wanted to provide off-the-shelf integration to speed up the development process.</p><p>With the upload widget, you can seamlessly integrate Cloudflare Images into your application within minutes. The widget can be integrated in two ways: by embedding a script into a static HTML page or by installing a package that works with your favorite framework. We provide a ready-made Worker template that you can deploy directly to your account to connect your frontend application with Cloudflare Images and authorize users to upload through the widget.</p><p>To try out the upload widget, <a href="https://forms.gle/vBu47y3638k8fkGF8">sign up for our closed beta</a>.</p>
    <div>
      <h3>Optimize images of people with automatic face cropping for Cloudflare Images</h3>
      <a href="#optimize-images-of-people-with-automatic-face-cropping-for-cloudflare-images">
        
      </a>
    </div>
    <p>Cloudflare Images lets you dynamically manipulate images in different aspect ratios and dimensions for various use cases. With face cropping for Cloudflare Images, you can now crop and resize images of people’s faces at scale. For example, if you’re building a social media application, you can apply automatic face cropping to generate profile picture thumbnails from user-uploaded images.</p><p>Our existing gravity parameter uses saliency detection to set the focal point of an image based on the most visually interesting pixels, which determines how the image will be cropped. We expanded this feature by using a machine learning model called RetinaFace, which classifies images that have human faces. We’re also introducing a new zoom parameter that you can combine with face cropping to specify how closely an image should be cropped toward the face.</p><p>To apply face cropping to your image optimization, <a href="https://forms.gle/2bPbuijRoqGi6Qn36">sign up for our closed beta</a>.</p>
            <figure>
            
            <img src="https://cf-assets.www.cloudflare.com/zkvhlag99gkb/6JFNk182dDZHu0sxIySMC5/d3821e2f911b7e31bb411addcc10bdb6/image2-10.png" />
            
            </figure><p><i>Photo by</i> <a href="https://unsplash.com/@eyeforebony?utm_content=creditCopyText&amp;utm_medium=referral&amp;utm_source=unsplash"><i>Eye for Ebony</i></a> <i>on</i> <a href="https://unsplash.com/photos/photo-of-woman-wearing-purple-lipstick-and-black-crew-neck-shirt-vYpbBtkDhNE?utm_content=creditCopyText&amp;utm_medium=referral&amp;utm_source=unsplash"><i>Unsplash</i></a></p>
            <pre><code>https://example.com/cdn-cgi/image/fit=crop,width=500,height=500,gravity=face,zoom=0.6/https://example.com/images/picture.jpg</code></pre>
            
    <div>
      <h3>Meet the Media team over Discord</h3>
      <a href="#meet-the-media-team-over-discord">
        
      </a>
    </div>
    <p>As we’re working to build the next set of media tools, we’d love to hear what you’re building for your users. Come <a href="https://discord.gg/cloudflaredev">say hi to us on Discord</a>. You can also learn more by visiting our developer documentation for <a href="https://developers.cloudflare.com/calls/">Calls</a>, <a href="https://developers.cloudflare.com/stream/">Stream</a>, and <a href="https://developers.cloudflare.com/images/">Images</a>.</p> ]]></content:encoded>
            <category><![CDATA[Developer Week]]></category>
            <category><![CDATA[Cloudflare Stream]]></category>
            <category><![CDATA[Live Streaming]]></category>
            <category><![CDATA[Cloudflare Images]]></category>
            <category><![CDATA[Image Optimization]]></category>
            <category><![CDATA[Image Resizing]]></category>
            <category><![CDATA[Image Storage]]></category>
            <category><![CDATA[Cloudflare Calls]]></category>
            <category><![CDATA[Developers]]></category>
            <guid isPermaLink="false">4fOMOrJU6Bg9JNkRAThc7c</guid>
            <dc:creator>Deanna Lam</dc:creator>
            <dc:creator>Taylor Smith</dc:creator>
            <dc:creator>Zaid Farooqui</dc:creator>
        </item>
        <item>
            <title><![CDATA[Image optimization made simpler and more predictable: we’re merging Cloudflare Images and Image Resizing]]></title>
            <link>https://blog.cloudflare.com/merging-images-and-image-resizing/</link>
            <pubDate>Tue, 26 Sep 2023 13:00:20 GMT</pubDate>
            <description><![CDATA[ We’re changing how we bill for Image Resizing to let you calculate your monthly costs more accurately and reliably. All Image Resizing features will be available under Cloudflare Images ]]></description>
            <content:encoded><![CDATA[ <p></p><p>Starting November 15, 2023, we’re merging Cloudflare Images and Image Resizing.</p><p>All Image Resizing features will be available as part of the Cloudflare Images product. To let you calculate your monthly costs more accurately and reliably, we’re changing how we bill to resize images that aren’t stored at Cloudflare. Our new pricing model will cost $0.50 per 1,000 unique transformations.</p><p>For existing Image Resizing customers, you can continue to use the legacy version of Image Resizing. When the merge is live, then you can opt into the new pricing model for more predictable pricing.</p><p>In this post, we'll cover why we came to this decision, what's changing, and how these changes might impact you.</p>
    <div>
      <h3>Simplifying our products</h3>
      <a href="#simplifying-our-products">
        
      </a>
    </div>
    <p>When you build an application with images, you need to think about three separate operations: storage, optimization, and delivery.</p><p>In 2019, we <a href="/announcing-cloudflare-image-resizing-simplifying-optimal-image-delivery/">launched Image Resizing</a>, which can optimize and transform any publicly available image on the Internet based on a set of parameters. This enables our customers to deliver variants of a single image for each use case without creating and storing additional copies.</p><p>For example, an e-commerce platform for furniture retailers might use the same image of a lamp on both the individual product page and the gallery page for all lamps. They can use Image Resizing to optimize the image in its original aspect for a slider view, or manipulate and crop the image for a thumbnail view.</p>
            <figure>
            
            <img src="https://cf-assets.www.cloudflare.com/zkvhlag99gkb/3Y4ulhBvK94McoD65FN5xy/b1a5889758db19d366e429a355802e84/image1-14.png" />
            
            </figure><p>Two years later, we <a href="/announcing-cloudflare-images/">released Images</a> to let developers build an end-to-end image management pipeline. Developers no longer need to use different vendors to handle storage, optimization, and delivery. With Images, customers can store and deliver their images from a single bucket at Cloudflare to streamline their workflow and <a href="https://www.cloudflare.com/learning/cloud/what-are-data-egress-fees/">eliminate egress fees</a>.</p><p>Both products have overlapping features to optimize and manipulate images, which can be confusing for customers. Over the years, we've received numerous questions about which product is optimal for which use cases.</p><p>To simplify our products, we're merging Cloudflare Images and Image Resizing to let customers store, optimize, and deliver their images all from one product. Customers can continue to <a href="https://www.cloudflare.com/developer-platform/cloudflare-images/">optimize their images</a> without using Cloudflare for storage or purchase storage to manage their entire image pipeline through Cloudflare.</p>
    <div>
      <h3>Transparent and predictable pricing</h3>
      <a href="#transparent-and-predictable-pricing">
        
      </a>
    </div>
    <p>Pricing can cause headaches for Image Resizing customers.</p><p>We often hear from customers seeking guidance for calculating how much Image Resizing will cost each month. Today, you are billed for Image Resizing by the number of uncached requests to transform an image. However, caching behavior is often unpredictable, and you can't guarantee how long a given image stays cached. This means that you can't reliably predict their costs.</p><p>If you make 1M total requests to Image Resizing each month, then you won't know whether you'll be billed for 10K or 100K of these requests because our pricing model relies on cache. Since assets can be ejected from cache for a variety of reasons, bills for Image Resizing are unpredictable month over month. In some cases, the monthly bills are inconsistent even when traffic remains constant. In other cases, the monthly bill is much higher than our customers expected.</p><p>With the new Cloudflare Images, you will be billed only once per 30 days for each unique request to transform an image stored outside of Cloudflare, whether or not the transformation is cached. Customers will be billed $0.50 per 1,000 unique transformations per month.</p><p>In other words, if you resize one image to 100x100, then our new pricing model guarantees that you will be billed only once per month, whether there are 10K or 100K uncached requests to deliver the image at this size. If you resize 200 images to 100x100, then you will be billed for only 200 unique transformations — one for each image at this size — each month.</p><p>This change aligns more closely with how our customers think about their usage, as well as ensures that our customers can accurately estimate their costs with confidence. You won't need to consider how your cache hit ratio will affect your bill. To estimate your costs, you'll need to know only the number of unique images and the number of different ways that you need to transform those images each month.</p>
    <div>
      <h3>Resize without storage with Cloudflare Images</h3>
      <a href="#resize-without-storage-with-cloudflare-images">
        
      </a>
    </div>
    <p>For developers who only want to resize and optimize images, Cloudflare Images now offers a zero-storage plan. This new plan enables you to transform images while keeping your existing storage and delivery solution unchanged (just like the current Image Resizing product does).</p>
            <figure>
            
            <img src="https://cf-assets.www.cloudflare.com/zkvhlag99gkb/5HzBEvn54XJo7eKCbod8i3/7efb5bb0420157aa44e545010ed576ee/image3-21.png" />
            
            </figure><p>If you want to store your images with Cloudflare Images, then you can always upgrade your plan to purchase storage at any time.</p><p>Image Resizing is currently available only for accounts with a Pro or higher plan. The merged Cloudflare Images product will be available for all customers, with pricing plans that are tailored to meet specific use cases.</p>
    <div>
      <h3>Existing customers can opt into new pricing</h3>
      <a href="#existing-customers-can-opt-into-new-pricing">
        
      </a>
    </div>
    <p>The new version of Cloudflare Images is available on November 15, 2023.</p><p>If you currently use Image Resizing, you will have the option to migrate to the new Cloudflare Images at no cost, or continue using Image Resizing.</p><p>The functionality and usability of the product will remain the same. You will still manage stored images under the Cloudflare Images tab and can enable transformations from the Speed tab.</p><p>As we execute, we'll continue to make improvements in the Dashboard to bring a more centralized and unified experience for Cloudflare Images.</p><p>You can learn more about our current image optimization capabilities in the <a href="https://developers.cloudflare.com/images/image-resizing/url-format/">Developer Docs</a>. If you have feedback or thoughts, we'd love to hear from you on the <a href="https://discord.com/invite/cloudflaredev">Cloudflare Developers Discord</a>.</p> ]]></content:encoded>
            <category><![CDATA[Birthday Week]]></category>
            <category><![CDATA[Cloudflare Images]]></category>
            <category><![CDATA[Image Resizing]]></category>
            <category><![CDATA[Connectivity Cloud]]></category>
            <guid isPermaLink="false">3Xy6Z8kmJJ64r3Ac3eJQPy</guid>
            <dc:creator>Deanna Lam</dc:creator>
        </item>
        <item>
            <title><![CDATA[Cloudflare Images introduces AVIF, Blur and Bundle with Stream]]></title>
            <link>https://blog.cloudflare.com/images-avif-blur-bundle/</link>
            <pubDate>Thu, 18 Nov 2021 14:00:10 GMT</pubDate>
            <description><![CDATA[ Two months ago we launched Cloudflare Images for everyone and we are amazed about the adoption and the feedback we received. Today we are announcing AVIF and Blur support for Cloudflare Images and give you a preview of the upcoming functionality. ]]></description>
            <content:encoded><![CDATA[ <p></p><p>Two months ago we <a href="/announcing-cloudflare-images/">launched</a> Cloudflare Images for everyone, and we are amazed about the adoption and the feedback we received.</p><p>Let’s start with some numbers:</p><p>More than <b>70 million</b> images delivered per day on average in the week of November 5 to 12.</p><p>More than <b>1.5 million</b> images have been uploaded so far, growing faster every day.</p><p>But we are just getting started and are happy to announce the release of the most requested features, first we talk about the AVIF support for Images, converting as many images as possible with <b>AVIF</b> results in highly compressed, fast delivered images without compromising on the quality.</p><p>Secondly we introduce <b>blur</b>. By blurring an image, in combination with the already supported protection of private images via <a href="https://developers.cloudflare.com/images/cloudflare-images/serve-images/serve-private-images-using-signed-url-tokens">signed URL</a>, we make Cloudflare Images a great solution for previews for paid content.</p><p>For many of our customers it is important to be able to serve Images from their <b>own domain</b> and not only via imagedelivery.net. Here we show an easy solution for this using a custom Worker or a special URL.</p><p>Last but not least we announce the launch of new attractively priced <b>bundles</b> for both Cloudflare Images and Stream.</p>
    <div>
      <h3>Images supports AVIF</h3>
      <a href="#images-supports-avif">
        
      </a>
    </div>
    <p>We <a href="/generate-avif-images-with-image-resizing/">announced support</a> for the new AVIF image format in Image Resizing product last year.</p><p>Last month we added AVIF support in Cloudflare Images. It compresses images significantly better than older-generation formats such as WebP and JPEG. Today, AVIF image format is supported both in Chrome and Firefox. <a href="https://caniuse.com/avif">Globally, almost 70%</a> of users have a web browser that supports AVIF.</p>
    <div>
      <h3>What is AVIF</h3>
      <a href="#what-is-avif">
        
      </a>
    </div>
    <p>As we <a href="/generate-avif-images-with-image-resizing/#what-is-avif">explained previously</a>, AVIF is a combination of the HEIF ISO standard, and a royalty-free AV1 codec by <a href="https://aomedia.org/">Mozilla, Xiph, Google, Cisco, and many others</a>.</p><p>“Currently, JPEG is the most popular image format on the web. It's doing remarkably well for its age, and it will likely remain popular for years to come thanks to its excellent compatibility. There have been many previous attempts at replacing JPEG, such as JPEG 2000, JPEG XR, and WebP. However, these formats offered only modest compression improvements and didn't always beat JPEG on image quality. Compression and image quality in <a href="https://netflixtechblog.com/avif-for-next-generation-image-coding-b1d75675fe4">AVIF is better than in all of them, and by a wide margin</a>.”<sup>1</sup></p>
    <div>
      <h3>How Cloudflare Images supports AVIF</h3>
      <a href="#how-cloudflare-images-supports-avif">
        
      </a>
    </div>
    <p>As a reminder, <a href="/building-cloudflare-images-in-rust-and-cloudflare-workers/#image-delivery">image delivery</a> is done through the Cloudflare managed imagedelivery.net domain. It is powered by Cloudflare Workers. We have the following logic to request the AVIF format based on the Accept HTTP request header:</p>
            <pre><code>const WEBP_ACCEPT_HEADER = /image\/webp/i;
const AVIF_ACCEPT_HEADER = /image\/avif/i;

addEventListener("fetch", (event) =&gt; {
  event.respondWith(handleRequest(event));
});

async function handleRequest(event) {
  const request = event.request;
  const url = new URL(request.url);
  
  const headers = new Headers(request.headers);

  const accept = headers.get("accept");

  let format = undefined;

  if (WEBP_ACCEPT_HEADER.test(accept)) {
    format = "webp";
  }

  if (AVIF_ACCEPT_HEADER.test(accept)) {
    format = "avif";
  }

  const resizingReq = new Request(url, {
    headers,
    cf: {
      image: { ..., format },
    },
  });

  return fetch(resizingReq);
}</code></pre>
            <p>Based on the Accept header, the logic in the Worker detects if WebP or AVIF format can be served. The request is passed to Image Resizing. If the image is available in the Cloudflare cache it will be served immediately, otherwise the image will be resized, transformed, and cached. This approach ensures that for clients without AVIF format support we deliver images in WebP or JPEG formats.</p><p>The benefit of Cloudflare Images product is that we added AVIF support without a need for customers to change a single line of code from their side.</p><p>The transformation of an image to AVIF is compute-intensive but leads to a significant benefit in file-size. We are always weighing the cost and benefits in the decision which format to serve.</p><p>It Is worth noting that all the conversions to WebP and AVIF formats happen on the request phase for image delivery at the moment. We will be adding the ability to convert images on the upload phase in the future.</p>
    <div>
      <h3>Introducing Blur</h3>
      <a href="#introducing-blur">
        
      </a>
    </div>
    <p>One of the most requested features for Images and Image Resizing was adding support for blur. We recently added the support for blur both via <a href="https://developers.cloudflare.com/images/image-resizing/url-format">URL format</a> and <a href="https://developers.cloudflare.com/images/image-resizing/resize-with-workers">with Cloudflare Workers</a>.</p><p>Cloudflare Images uses variants. When you create a variant, you can define properties including variant name, width, height, and whether the variant should be publicly accessible. Blur will be available as a new option for variants via <a href="https://api.cloudflare.com/#cloudflare-images-variants-create-a-variant">variant API</a>:</p>
            <pre><code>curl -X POST "https://api.cloudflare.com/client/v4/accounts/9a7806061c88ada191ed06f989cc3dac/images/v1/variants" \
     -H "Authorization: Bearer &lt;api_token&gt;" \
     -H "Content-Type: application/json" \
     --data '{"id":"blur","options":{"metadata":"none","blur":20},"neverRequireSignedURLs":true}'</code></pre>
            <p>One of the use cases for using blur with Cloudflare Images is to control access to the premium content.</p><p>The customer will upload the image that requires an access token:</p>
            <pre><code>curl -X POST "https://api.cloudflare.com/client/v4/accounts/9a7806061c88ada191ed06f989cc3dac/images/v1" \
     -H "Authorization: Bearer &lt;api_token&gt;"
     --form 'file=@./&lt;file_name&gt;' \
     --form 'requireSignedURLs=true'</code></pre>
            <p>Using the variant we defined via API we can fetch the image without providing a signature:</p><img src="https://imagedelivery.net/r1xBEzoDl4p34DP7QLrECw/dfc72df8-863f-46e3-7bba-a21f9795e401/blur20" /><p>To access the protected image a <a href="https://developers.cloudflare.com/images/cloudflare-images/serve-images/serve-private-images-using-signed-url-tokens">valid signed URL</a> will be required:</p><img src="https://imagedelivery.net/r1xBEzoDl4p34DP7QLrECw/dfc72df8-863f-46e3-7bba-a21f9795e401/public?sig=d67d49055d652b8fb2575b3ec11f0e1a8fae3932d3e516d381e49e498dd4a96e" />
Lava lamps in the Cloudflare lobby. Courtesy of <a href="https://twitter.com/mahtin/status/888251632550424577">@mahtin</a>
<br /><p>The combination of image blurring and restricted access to images could be integrated into many scenarios and provides a powerful tool set for content publishers.</p><p>The functionality to define a variant with a blur option is coming soon in the Cloudflare dashboard.</p>
    <div>
      <h3>Serving images from custom domains</h3>
      <a href="#serving-images-from-custom-domains">
        
      </a>
    </div>
    <p>One important use case for Cloudflare Images customers is to serve images from custom domains. It could improve latency and loading performance by not requiring additional TLS negotiations on the client. Using Cloudflare Workers customers can add this functionality today using the following example:</p>
            <pre><code>const IMAGE_DELIVERY_HOST = "https://imagedelivery.net";

addEventListener("fetch", async (event) =&gt; {
  event.respondWith(handleRequest(event.request));
});

async function handleRequest(request) {
  const url = new URL(request.url);
  const { pathname, search } = url;

  const destinationURL = IMAGE_DELIVERY_HOST + pathname + search;
  return fetch(new Request(destinationURL));
}</code></pre>
            <p>For simplicity, the Workers script makes the redirect from the domain where it’s deployed to the imagedelivery.net. We assume the same format as for Cloudflare Images URLs:</p>
            <pre><code>https://&lt;customdomain.net&gt;/&lt;encoded account id&gt;/&lt;image id&gt;/&lt;variant name&gt;</code></pre>
            <p>The Worker could be adjusted to fit customer needs like:</p><ul><li><p>Serving images from a specific domains' path e.g. /images/</p></li><li><p>Populate account id or variant name automatically</p></li><li><p>Map Cloudflare Images to custom URLs altogether</p></li></ul><p>For customers who just want the simplicity of serving Cloudflare Images from their domains on Cloudflare we will be adding the ability to serve Cloudflare Images using the following format:</p>
            <pre><code>https://&lt;customdomain.net&gt;/cdn-cgi/imagedelivery/&lt;encrypted_account_id&gt;/&lt;_image_id&gt;/&lt;variant_name&gt;</code></pre>
            <p>Image delivery will be supported from all customer domains under the same Cloudflare account where Cloudflare Images subscription is activated. This will be available to all Cloudflare Images customers before the holidays.</p>
    <div>
      <h3>Images and Stream Bundle</h3>
      <a href="#images-and-stream-bundle">
        
      </a>
    </div>
    <p>Creator platforms, eCommerce, and many other products have one thing in common: having an easy and accessible way to upload, store and deliver your images and videos in the best and most affordable way is vital.</p><p>We teamed up with the Stream team to create a set of bundles that make it super easy to get started with your product.</p><p>The Starter bundle is perfect for experimenting and a first MVP. For just $10 per month it is 50% cheaper than the unbundled option, and includes enough to get started:</p><ul><li><p>Stream: 1,000 stored minutes and 5,000 minutes served</p></li><li><p>Images: 100,000 stored images and 500,000 images served</p></li></ul><p>For larger and fast scaling applications we have the Creator Bundle for $50 per month which saves over 60% compared to the unbundled products. It includes everything to start scaling:</p><ul><li><p>Stream: 10,000 stored minutes and 50,000 minutes served</p></li><li><p>Images: 500,000 stored images and 1,000,000 images served</p></li></ul><img src="https://imagedelivery.net/r1xBEzoDl4p34DP7QLrECw/fb149b8a-8d93-494d-74da-0a88b8ffd600/public" /><p>These new bundles will be available to all customers from the end of November.</p>
    <div>
      <h3>What’s next</h3>
      <a href="#whats-next">
        
      </a>
    </div>
    <p>We are not stopping here, and we already have the next features for Images lined up. One of them is Images Analytics. Having great analytics for a product is vital, and so we will be introducing analytics functionality for Cloudflare Images for all customers to be able to keep track of all images and their usage.</p>
    <div>
      <h3>Watch on Cloudflare TV</h3>
      <a href="#watch-on-cloudflare-tv">
        
      </a>
    </div>
    <div></div>
<p></p>
<div></div><hr /><p><sup>1</sup><a href="/generate-avif-images-with-image-resizing/#what-is-avif">http://blog.cloudflare.com/generate-avif-images-with-image-resizing/#what-is-avif</a></p> ]]></content:encoded>
            <category><![CDATA[Full Stack Week]]></category>
            <category><![CDATA[Image Resizing]]></category>
            <category><![CDATA[Image Optimization]]></category>
            <guid isPermaLink="false">5fZMmfFfa85XpTYFNaU5S2</guid>
            <dc:creator>Marc Lamik</dc:creator>
            <dc:creator>Yevgen Safronov</dc:creator>
        </item>
        <item>
            <title><![CDATA[Cloudflare Images Now Available to Everyone]]></title>
            <link>https://blog.cloudflare.com/announcing-cloudflare-images/</link>
            <pubDate>Wed, 15 Sep 2021 13:02:00 GMT</pubDate>
            <description><![CDATA[ Today, we are launching Cloudflare Images for all customers. Images provides a single product to store, resize and serve images. We built Cloudflare Images, so customers of all sizes can build a scalable and affordable image pipeline with a fraction of the effort. ]]></description>
            <content:encoded><![CDATA[ <p></p><p>Today, we are launching Cloudflare Images for all customers. Images is a single product that stores, resizes, optimizes and serves images. We built <a href="https://www.cloudflare.com/products/cloudflare-images/">Cloudflare Images</a> so customers of all sizes can build a scalable and affordable image pipeline in minutes.</p>
    <div>
      <h2>Store images efficiently</h2>
      <a href="#store-images-efficiently">
        
      </a>
    </div>
    <p>Many legacy image pipelines are architected to take an image and create multiple copies of it to account for different sizes and formats. These copies are then stored in a storage bucket and delivered using a <a href="https://www.cloudflare.com/learning/cdn/what-is-a-cdn/">CDN</a>. This architecture can be hard to maintain and adds infrastructure cost in unpredictable ways.</p><p>With Cloudflare Images, you don’t need to worry about <i>creating</i> and <i>storing</i> multiple versions of the same image in different sizes and formats. Cloudflare Images makes a clear distinction between your stored images and the variants. Once you upload an image, you can apply any defined variant to the uploaded image. The variants and different formats don’t count towards your stored images quota.</p><p>This means that when a user uploads a picture that you need to resize in three different ways and serve in two different formats, you pay for <i>one</i> stored image instead of seven different images (the original, plus three variants for each of the two formats.)</p>
    <div>
      <h2>Built-in access control</h2>
      <a href="#built-in-access-control">
        
      </a>
    </div>
    <p>Every image that is uploaded to Cloudflare Images can be marked private, so it can only be accessed using an expiring signed URL token. This is ideal for use cases like membership sites that sell premium content.</p><p>Signed URLs give you the flexibility to validate if someone is a paying member using your custom logic and only give them access to the set of images they have paid for.</p>
    <div>
      <h2>Eliminate egress costs</h2>
      <a href="#eliminate-egress-costs">
        
      </a>
    </div>
    <p>Egress cost is the cost of getting your data out of a storage provider. The most common case being when you serve an image from storage you pay for the bits transmitted. And you end up paying every, single time that same image is displayed. It is easy to not account for this cost when you are doing cost-benefit analysis between different solutions. But egress costs add up rapidly, and it is not uncommon for customers to pay their storage provider a <i>very large multiple</i> of their total storage cost in egress.</p><p>When you use a multi-vendor solution for your image pipeline, you might use vendor A for storage, vendor B for resizing the images and vendor C for delivering the images. At face value, this solution might appear cheaper because you think “<i>we’ve picked the most affordable option for each piece of our image pipeline</i>.” But in this setup, the resizing service (vendor B) and the CDN (vendor C) still need to request images from vendor A.</p><p>With Cloudflare Images, you never have to worry about egress costs because the images are stored, optimized and delivered by a single product. And you will see only two line items on your bill for Cloudflare Images. You pay \$5/month for every 100,000 stored images and \$1 per 100,000 delivered images. There are no additional resizing, compute or egress costs.</p>
    <div>
      <h2>Uploading Images</h2>
      <a href="#uploading-images">
        
      </a>
    </div>
    <p>Cloudflare Images offers multiple ways to upload your images. We accept all the common file formats including JPEG, GIF and WEBP. Each image uploaded to Images can be up to 10 MB.</p><p>If you only have a few images or simply want a taste of the product, you can use the <a href="https://dash.cloudflare.com/?to=/:account/images">Images Dashboard</a>. Simply drag and drop one or more images:</p>
            <figure>
            
            <img src="https://cf-assets.www.cloudflare.com/zkvhlag99gkb/69R4SCilBZZo0HZXoxcQcb/2ea6038f76a3076a892505638092892b/image1-10.png" />
            
            </figure><p><i>Cloudflare Images Dashboard</i></p><p>If you have an app that lets your users upload images, you can use the Direct Creator Uploads feature of Cloudflare Images.</p><p>The Direct Creator Uploads API lets you request single-use tokens. These one-time upload URLs can be used by your app to upload your user’s submissions without exposing your API Key or Token. Here is an example cURL that returns a one-use upload url:</p>
            <pre><code>curl --request POST \
  --url https://api.cloudflare.com/client/v4/accounts/:account_id/images/v1/direct_upload \
  --header 'Content-Type: application/json' \
  --header 'Authorization: Bearer :token'</code></pre>
            <p>If the call is successful, you’ll receive a response that looks like this:</p>
            <pre><code>{
  "result": {
    "id": "2cdc28f0-017a-49c4-9ed7-87056c839c2",
    "uploadURL": "https://upload.imagedelivery.net/2cdc28f0-017a-49c4-9ed7-87056c839c2"
  },
  "result_info": null,
  "success": true,
  "errors": [],
  "messages": []
}</code></pre>
            <p>Your client-side app can now upload the image directly to the <code>uploadURL</code> without exposing your account credentials to the client.</p>
    <div>
      <h2>Resizing with Variants</h2>
      <a href="#resizing-with-variants">
        
      </a>
    </div>
    <p>Cloudflare Images lets you define variants and apply them to your uploaded images. You can define up to 20 different variants to support different use cases. Each variant has properties including the width and height of resized images.</p>
            <figure>
            
            <img src="https://cf-assets.www.cloudflare.com/zkvhlag99gkb/4VVAvrN7YhsBzMG8AtBcQf/c615f98838d50a88d26537fe3f31f6a0/image4-11.png" />
            
            </figure><p><i>Configure variants in Cloudflare Images</i></p><p>You can also configure the fit property to describe how the width and height dimensions should be interpreted.</p><p>Fit Option</p><p>Behavior</p><p>Scale Down</p><p>Image will be shrunk in size to fully fit within the given width or height, but won’t be enlarged.</p><p>Contain</p><p>Image will be resized (shrunk or enlarged) to be as large as possible within the given width or height while preserving the aspect ratio.</p><p>Cover</p><p>Image will be resized to exactly fill the entire area specified by width and height, and will be cropped if necessary.</p><p>Crop</p><p>Image will be shrunk and cropped to fit within the area specified by width and height. The image won’t be enlarged. For images smaller than the given dimensions it’s the same as scale-down. For images larger than the given dimensions, it’s the same as cover.</p><p>Pad</p><p>Image will be resized (shrunk or enlarged) to be as large as possible within the given width or height while preserving the aspect ratio, and the extra area will be filled with a background color (white by default)</p><p>We plan to add more properties to give you maximum flexibility. If there is a particular property you’d love to see, <a href="https://docs.google.com/forms/d/1UmltETYpHIt0C9cZkr607ofcNUt53jgqk18Dh8vHxyU">let us know</a>.</p><p>Once you define your variants, you can begin using them with any image. From the Dashboard, simply click on Variants to quickly preview how any image would be rendered using each of your variants.</p>
            <figure>
            
            <img src="https://cf-assets.www.cloudflare.com/zkvhlag99gkb/1IOsQ2YJ2gIoUUFu6vKNcX/2b279f4a21f1f315956685b5f329fcf9/image2-18.png" />
            
            </figure><p><i>Previewing variants in Cloudflare Images</i></p>
    <div>
      <h2>Optimized image delivery</h2>
      <a href="#optimized-image-delivery">
        
      </a>
    </div>
    <p>Once you’ve uploaded your first image, you will see the Image Delivery URL in your Images Dashboard:</p>
            <figure>
            
            <img src="https://cf-assets.www.cloudflare.com/zkvhlag99gkb/5HAG3KwRzFyPM0ons8zdWs/6c71517b29b09416a46501104be5199e/image5-9.png" />
            
            </figure><p><i>Serving images with Cloudflare Images</i></p><p>A typical Image Delivery URL looks like this:</p><p><a href="https://imagedelivery.net/ZWd9g1K7eljCn_KDTu_OWA/:image_id/:variant_name"><code>https://imagedelivery.net/ZWd9g1K7eljCn_KDTu_OWA/:image_id/:variant_name</code></a></p><p>You can use this url template to form the final URL that returns any image and variant combination.</p><p>When a client requests an image, Cloudflare Images will pick the optimal format between WebP, PNG, JPEG and GIF. The format served to the eyeball is determined by client headers and the image type. Cloudflare Images will soon support AVIF, offering further compression. One of the best parts of using Cloudflare Images is that when we add support for newer formats such as AVIF, you will get the upside without needing to make any changes to your codebase.</p>
    <div>
      <h2>What’s next</h2>
      <a href="#whats-next">
        
      </a>
    </div>
    <p>All Cloudflare customers can <a href="https://dash.cloudflare.com/?to=/:account/images">sign up to use Cloudflare Images</a> this week. We built Cloudflare Images for developers. Check out the <a href="https://developers.cloudflare.com/images/">Cloudflare Images developer docs</a> for examples of implementing common use-cases such as letting your users upload images directly to Images and using signed URLs to implement access control.</p><p>We’re just getting started with Cloudflare Images. Here are some of the features we plan to support soon:</p><ul><li><p>AVIF support for even smaller file sizes and faster load times.</p></li><li><p>Variants that add a blur effect to your images.</p></li><li><p>Analytics to better understand your use of Images.</p></li></ul>
    <div>
      <h3>Watch on Cloudflare TV</h3>
      <a href="#watch-on-cloudflare-tv">
        
      </a>
    </div>
    <div></div><p></p> ]]></content:encoded>
            <category><![CDATA[Speed Week]]></category>
            <category><![CDATA[Image Resizing]]></category>
            <category><![CDATA[Image Optimization]]></category>
            <guid isPermaLink="false">46UovjCfOrGDiglTVokHXJ</guid>
            <dc:creator>Zaid Farooqui</dc:creator>
        </item>
    </channel>
</rss>