Multimedia processing

MOS(Miku Object Storage) supports real-time image&media processing when accessing files, and returns the processed data to the requestor, which can better adapt to various processing needs of different terminals. It does not require the application and service of comprehensive planning and the various processing to be completed before the resources are distributed.

Image processing includs

  • Image thumbnail, scaling, cropping, rotation
  • Image format conversion, progressive display, background color filling, quality transformation, Gaussian blur
  • Adding image, text, and mixed image-text watermarks

Media processing includs

  • MP4 & MOV videos can be transcoded into M3U8 format videos, enabling immediate playback of the real-time transcoded video.
  • Video frame

Triggering image&media processing in MOS is very simple. Just append the style to the file access link. The "style" is a template of the real-time processing parameters.

Multimedia Style

Style access link format: resource access link + separator + style name

  • style name:Template name of the real-time processing parameters for multimedia files
  • separator:A special symbol used to connect the resource link and the multimedia style
  • When processing requests, MOS will first locate the separator in the link, and then try to match the content after the separator with the multimedia style, and then execute the corresponding processing and return the processed file.

The separator can be defined with multiple characters, but only one of them can be used each time.

Note:

  • Characters that are already defined as separator must not appear in the style name.
  • Deleting an existing separator will cause the style access link to become invalid, so caution is needed when performing this operation.

Application cases

Image processing

  1. If you want to scale the high-definition original image to a small image in png format with dimensions of 360*240, and add a logo watermark at the same time, then you can configure the scaling parameters, output format, select the watermark image, watermark position, and other information on the console interface, and save these processing parameters as a style.
  2. Name the image style as "watermark.small.png" and specify the style separator as "-".
  3. Original image access link:http://test.com/pic1.jpg
  4. Concatenate the original image link with the style separator "-" and the style name "watermark.small.png".Accessing http://test.com/pic1.jpg-watermark.small.png will directly retrieve the image file with a logo watermark and dimensions of 320*240.

Media processing

  1. If you want to transcode a 1080p MP4 video to a 720P M3U8 video, you can configure the resolution to 1280*720 and the segment duration to 5 seconds on the console interface, and save these processing parameters as a style.
  2. Name the media style as "sd.m3u8" and specify the style separator as "-".
  3. Original media access link: http://aaa.com/sample.mp4
  4. Concatenate the original media link with the style separator "-" and the style name "sd.m3u8".Accessing http://aaa.com/sample.mp4-sd.m3u8 will directly retrieve the 720p M3U8 video.

This is a best practice to make the access link more user-friendly.

  1. Config the style name suffix the same as the file format suffix of the processed image.
  2. Enable the "Hide source type"
  3. Style acces link
  • When "Hide source type" disabled,the style acces link is:http(s)://{domain}/{filename}.{sourcetype}-{stylename}
  • When "Hide source type" enabled,the style acces link is::http(s)://{domain}/{filename}-{stylename}

Supported hidden source type list

  • Image:.psd、.jpeg、.jpg、.png、.gif、.webp、.tif、.tiff、.bmp、.avif、.heif、.heic
  • Media:.mp4、.mov

Note:When using the "Hide source type" feature, the {filename} must have only one {sourcetype} value.

Image processing case

  1. If you want to scale the high-definition original image to a small image in png format with dimensions of 360*240, and add a logo watermark at the same time, then you can configure the scaling parameters, output format, select the watermark image, watermark position, and other information on the console interface, and save these processing parameters as a style.
  2. Name the image style as "watermark.small.png" , specify the style separator as "-" and enable "Hide source type".
  3. Original image access link:http://test.com/pic1.jpg
  4. Concatenate the original image link with the style separator "-" and the style name "watermark.small.png".When accessing http://test.com/pic1-watermark.small.png ,MOS will execute the corresponding processing of "watermark.small.png" on the file pic1.jpg and return the new image file with a logo watermark and dimensions of 320*240.