Manage symbolic links using OSS SDK for Browser.js
Symbolic links work like file shortcuts on Windows and let you quickly access associated objects in Object Storage Service (OSS).
Prerequisites
Before you begin, ensure that you have:
An OSS bucket with CORS rules configured. Without CORS rules, the browser rejects cross-origin requests. See Installation for setup details.
Temporary access credentials from Security Token Service (STS): an AccessKey ID, an AccessKey secret, and a security token. Using STS credentials prevents your permanent AccessKey pair from being exposed in browser code. See Use STS for temporary access authorization.
(Webpack/Browserify only) OSS SDK for Browser.js installed: run
npm install ali-oss.
Usage notes
The SDK CDN file (
aliyun-oss-sdk-6.18.0.min.js) is imported directly in the HTML examples below. If you use Webpack or Browserify, install the npm package instead.Set
authorizationV4: truein all client configurations.
Initialize the OSS client
Both operations use the same client setup. Configure it once and reuse it:
<!-- Import the SDK file -->
<script type="text/javascript" src="https://gosspublic.alicdn.com/aliyun-oss-sdk-6.18.0.min.js"></script>
<script type="text/javascript">
const client = new OSS({
// Specify the region where the bucket is located.
// Example: oss-cn-hangzhou for China (Hangzhou).
region: '<your-region>',
authorizationV4: true,
// Temporary access credentials from STS.
accessKeyId: '<your-access-key-id>',
accessKeySecret: '<your-access-key-secret>',
stsToken: '<your-security-token>',
// Example bucket name: examplebucket.
bucket: '<your-bucket>',
});
</script>Replace the placeholders with actual values:
| Placeholder | Description | Example |
|---|---|---|
<your-region> | Region where the bucket is located | oss-cn-hangzhou |
<your-access-key-id> | AccessKey ID from STS | STS.NUgYrLkdxxxxxxx |
<your-access-key-secret> | AccessKey secret from STS | xxxxxxxxxxxxxxxx |
<your-security-token> | Security token from STS | CAIS... |
<your-bucket> | Bucket name | examplebucket |
Create a symbolic link
putSymlink(symlinkName, targetName[, options]) creates a symbolic link that points to an existing object.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Document</title>
</head>
<body>
<button id="upload">Upload</button>
<button id="symlink">Create symbolic link</button>
<!-- Import the SDK file -->
<script type="text/javascript" src="https://gosspublic.alicdn.com/aliyun-oss-sdk-6.18.0.min.js"></script>
<script type="text/javascript">
const client = new OSS({
region: '<your-region>',
authorizationV4: true,
accessKeyId: '<your-access-key-id>',
accessKeySecret: '<your-access-key-secret>',
stsToken: '<your-security-token>',
bucket: '<your-bucket>',
});
// Upload the target object.
const file = new Blob(['examplecontent']);
const fileName = 'exampleobject.txt';
document.getElementById('upload').addEventListener('click', () => {
client.put(fileName, file).then(r => console.log(r));
});
// Create a symbolic link named symlink.txt pointing to exampleobject.txt.
document.getElementById('symlink').addEventListener('click', () => {
client.putSymlink('symlink.txt', fileName).then(r => console.log(r));
});
</script>
</body>
</html>Query the name of the object to which the symbolic link points
getSymlink(symlinkName[, options]) returns the target object name that the symbolic link points to. Read permissions on the symbolic link are required.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Document</title>
</head>
<body>
<button id="getSymlink">Query symbolic link</button>
<!-- Import the SDK file -->
<script type="text/javascript" src="https://gosspublic.alicdn.com/aliyun-oss-sdk-6.18.0.min.js"></script>
<script type="text/javascript">
const client = new OSS({
region: '<your-region>',
authorizationV4: true,
accessKeyId: '<your-access-key-id>',
accessKeySecret: '<your-access-key-secret>',
stsToken: '<your-security-token>',
bucket: '<your-bucket>',
});
// Query the object name that symlink.txt points to.
document.getElementById('getSymlink').addEventListener('click', () => {
client.getSymlink('symlink.txt').then(r => console.log(r));
});
</script>
</body>
</html>References
Create a symbolic link
Complete sample code: GitHub - putSymlink
API reference: PutSymlink
Query the object to which a symbolic link points
Complete sample code: GitHub - getSymlink
API reference: GetSymlink