This topic describes how to use browsers to upload data to Object Storage Service (OSS).

Background information

When users use browsers or an application to upload an object, the object is generally uploaded first to the application server. Then, the application server uploads the object to OSS. The following figure shows the specific process. Sequence diagram

Compared with direct data transfer, the preceding method has the following disadvantages:

  • Time-consuming: Data is uploaded to the application server before the data can be uploaded to OSS. The consumed time period is greatly shortened if data is directly transferred to OSS from the client. In addition, OSS uses the Border Gateway Protocol (BGP) network to ensure high speed transmission of data between different Internet service providers (ISPs).
  • Poor scalability: The performance of the application server can hit a bottleneck if the number of users increases.
  • High cost: Multiple application servers must be prepared. You can save costs on additional application servers by using direct data transfer to OSS. In addition, you are not charged for the traffic generated by data upload.

Technical solutions

We provide the following two solutions for data transfer by using browsers:
  • Use OSS SDK for Browser.js to upload objects to OSS

    This solution uses OSS SDK for Browser.js to directly transfer data to OSS. For more information, see Overview. You can use resumable upload to upload large objects when the network conditions are poor. This solution is compatible and supported by the following browsers: IE 10 and later, major versions of Microsoft Edge, Google Chrome, Firefox, and Safari, and most browsers for mobile phones that run Android, iOS, and Windows Phone.

  • Use form upload to upload objects to OSS

    Call the PostObject operation provided by OSS to upload an object to OSS by using form upload. This solution is supported by most browsers. However, you can only retry the upload when you fail to upload an object due to poor network conditions. For more information, see Use PostObject on the web to upload objects.