pattern100-oss v1.0.1

OSS in Browser

Play with OSS right in the browser!

Browser support

• IE >= 10 & Edge
• Major versions of Chrome/Firefox/Safari
• Major versions of Android/iOS/WP

Setup

Bucket setup

As browser-side javascript involves CORS operations. You need to setup your bucket CORS rules to allow CORS operations:

• set allowed origins to '*'
• allowed methods to 'PUT, GET, POST, DELETE, HEAD'
• set allowed headers to '*'
• expose 'ETag' in expose headers

RoleArn: 阿里云控制台->用户头像->访问控制->RAM角色管理 阿里云控制台->用户头像->人员管理->用户->添加权限->assumeRole

STS setup

As we don't want to expose the accessKeyId/accessKeySecret in the browser, a common practice is to use STS to grant temporary access.

App setup

Fill in your bucket name and region in app.js: (Note: ensure port 9000 is not used)

var bucket = '<your bucket name>';
var region = 'oss-cn-hangzhou';

Start the server

cross-env \
ALI_SDK_STS_ID={your sts accessKeyId} \
ALI_SDK_STS_SECRET={your sts accessKeySecret} \
ALI_SDK_STS_ROLE={your rolearn} \
npm run start

Open the http://localhost:3000 in browser