Support » Plugin: WP Offload Media Lite for Amazon S3, DigitalOcean Spaces, and Google Cloud Storage » [Question] Is there a way to trigger upload, not via media

  • Will Stocks

    (@willstockstech)


    Hi guys,

    Just want to start by saying – I’ve been using WP Offload since the early days of S3 Offload and I absolutely love it – thank you! 😊

    On to my question – so I have started using WebP Express, which generates a WebP variant of my images when they’re requested. Obviously, they’re not directly requested via my site as I’m using WP Offload and all my assets are being served via Cloudfront – however if I were to call my assets manually, a WebP would be generated on my server. So my question is… when that happens, is there a way for me to somehow get WP Offload to fire and upload those WebP’s?

    I could try to do it via W3TC with a custom rule thingymabob, (off-topic from here) but I’m a bit wary of doing that given that I set a (very small!!) folder to upload and I’m now lumped with a bill that costs more than my annual hosting and multiple million monthly PUT’s in my bucket – an issue I’ve NEVER had with WP Offload!

Viewing 6 replies - 1 through 6 (of 6 total)
  • Plugin Contributor ianmjones

    (@ianmjones)

    Thanks for the kind words @willstockstech!

    There’s a few ways this could be accomplished.

    Ideally the plugin you’re using to generate those WebP files would properly register the thumbnail sizes and then ensure that wp_update_attachment_metadata is called with the correct relative file paths in the data. WP Offload Media automatically handles re-offloading a Media Library item and its thumbnail sizes when they’re updated.

    Otherwise you could register those sizes and trigger the above yourself.

    Another option (and probably easiest) is to use WP Offload Media’s as3cf_attachment_file_paths filter to specify that there’s more files to be offloaded than those in the attachment’s metadata. Check out the Tweaks plugin…

    https://github.com/deliciousbrains/wp-amazon-s3-and-cloudfront-tweaks/blob/cb7c645d84969d58b43dd43b918c6c5c75218099/amazon-s3-and-cloudfront-tweaks.php#L396

    You could then trigger the re-offload via wp_update_attachment_metadata as necessary, but don’t need to adjust the data.

    Hope that helps.

    Will Stocks

    (@willstockstech)

    Thanks @ianmjones – that’s some great insight!

    I’ve linked this topic in a Github comment (https://github.com/rosell-dk/webp-express/issues/161) for the plugin in question ☺️

    My only thought is – if I wanted to rewrite images web variant for supported browsers… Any thoughts off of the top of your head how one could achieve this whilst still using WP Offload?

    kevinxie

    (@kevinxie)

    Hey @willstockstech, hope you had success in getting the two to play nicely together. I’m trying to get the two plugins to work together at the moment too, did you end up getting a solution that works? Cheers.

    kevinxie

    (@kevinxie)

    I was able to get WP Offload to upload newly added media files to S3 by installing the tweaks plugin and adjusting the functions object_meta and attachment_file_paths.

    I uncommented these two lines in amazon-s3-and-cloudfront-tweaks.php:

    
    add_filter( 'as3cf_object_meta', array( $this, 'object_meta' ), 10, 4 );
    add_filter( 'as3cf_attachment_file_paths', array( $this, 'attachment_file_paths' ), 10, 3 );
    

    Defined function object_meta as:

      function object_meta( $args, $post_id, $image_size, $copy ) {
        // This sets the ContentType to image/webp so that uploads to S3 pass verification
        $extension = pathinfo( $args['Key'], PATHINFO_EXTENSION );
        if ( in_array( $extension, array( 'webp' ) ) ) {
          $args['ContentType'] = 'image/webp';
        }
      
        return $args;
      }

    Defined function attachment_file_paths as:

    
      function attachment_file_paths( $paths, $attachment_id, $meta ) {
        // This adds webP files to be uploaded as well
        foreach ( $paths as $file ) {
          $pathinfo   = pathinfo( $file );
          // Change this to the path of your converted webp file
          $extra_file = $pathinfo['dirname'] . '/' . $pathinfo['filename'] . '.' . $pathinfo['extension'] . '.' . 'webp';
    
          if ( file_exists( $extra_file ) ) {
            $paths[] = $extra_file;
          }
        }
    
        return $paths;
      }
    

    And there you have uploading to S3. I’m going to now work on the part that uploads those done via bulk convert to S3. I’m planning on using a JS script which will detect for webp support client side to determine which format to load into the image tags. Hope this helps someone.

    • This reply was modified 1 year ago by kevinxie.
    • This reply was modified 1 year ago by kevinxie.
    Will Stocks

    (@willstockstech)

    @ianmjones could you confirm that the above is an appropriate course of action to take? Would there be any possibility of supporting this within the plugin natively, as opposed to having to maintain this for each WP Offload release? 😀

    kevinxie

    (@kevinxie)

    @willstockstech The modifications done above are in a separate plugin also maintained by WP Offload so updates to WP Offload Main won’t / should not affect the above functionality. As such, you should NOT have to maintain this code for each WP Offload release.

    I’m running a very similar setup to you in regards to using a Push CDN (MaxCDN), W3 Offload, and WebP Express and have been able to successfully setup a WebP Experience via three steps. We’re using S3 as the service to actually serve the files and they do not live on our CDN.

    1. I couldn’t figure out a method to convert and upload existing files via the plugins directly so I wrote a NodeJS script to convert all images within the uploads folder to WebP.

    2. Once converted, I created a script to upload all newly generated WebP images onto S3.

    3. Since all images are backfilled and new images are being actively converted and uploaded, all images should now be available in the WebP format. Here I then created a plugin (heavily borrowing from the way WebP Express does image source replacement) to determine when to change the links to end in .webp. For us, this was whenever we detected a MaxCDN link in the image src / srcset / etc attributes. Since we set the priority to 99999, it would run last, AFTER W3 Offload converted normal links to CDN links.

    As a fail safe on the client side we coded a catch all for images failing to load the .webp format and fallback to the original.

    Hopefully this makes sense and is helpful to you.

    • This reply was modified 1 year ago by kevinxie.
Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘[Question] Is there a way to trigger upload, not via media’ is closed to new replies.