fix(Browser): signatureUrl with content-type and content-md5 (#441)

* fix: fix signatureUrl's logic without content-type and content-md5

* fix: fix configuration about browser's test

* test: add testcase and sample about signatureUrl for posting data to server

* test: restore configurations

* test: rename id and function

* test: revise callback logic

* test: fix testcases

Author: duan007a

example/index.html

@@ -91,6 +91,29 @@ <h1>OSS <small>in</small> Browser</h1>
             </div>
           </div>
         </td>
+
+        <td>
+          <div class="panel panel-success">
+            <div class="panel-heading">PUT Object with signaturedUrl</div>
+            <div class="panel-body">
+              <form action="" class="form-horizontal">
+                <div class="form-group">
+                  <label>Content</label>
+                  <textarea class="form-control" id="put-blob" rows="3">Hello, OSS! I am a Blob!</textarea>
+                </div>
+                <div class="form-group">
+                  <label>Store as</label>
+                  <input type="text" class="form-control" id="object-key-put-blob" value="blob" />
+                </div>
+                <div class="form-group">
+                  <input type="button" class="btn btn-primary" id="put-blob-button" value="Save" />
+                </div>
+              </form>
+            </div>
+          </div>
+        </td>
+      </tr>
+      <tr>
         <td>
           <div class="panel panel-danger">
             <div class="panel-heading">Upload with base64 img</div>
@@ -123,8 +146,6 @@ <h1>OSS <small>in</small> Browser</h1>
             </div>
           </div>
         </td>
-      </tr>
-      <tr>
         <td>
           <div class="panel panel-warning">
             <div class="panel-heading">Download file</div>
@@ -145,6 +166,8 @@ <h1>OSS <small>in</small> Browser</h1>
             </div>
           </div>
         </td>
+      </tr>
+      <tr>
         <td>
           <div class="panel panel-info">
             <div class="panel-heading">List files</div>
@@ -160,8 +183,6 @@ <h1>OSS <small>in</small> Browser</h1>
             </div>
           </div>
         </td>
-      </tr>
-      <tr>
         <td colspan="2">
           Powered by
           <a href="https://www.aliyun.com/product/oss">OSS</a> &

example/index.js

@@ -5,6 +5,7 @@
 const $ = require('jquery');
 // if use in react , you can use require('ali-oss/dist/aliyun-oss-sdk.js'), or see webpack.prod.js
 const OSS = require('ali-oss');
+const crypto = require('crypto');
 
 const appServer = '/sts';
 const bucket = '<bucket-name>';
@@ -183,6 +184,32 @@ const uploadBlob = function (client) {
   return client.put(key, new Blob([content], { type: 'text/plain' })).then(res => listFiles(client));
 };
 
+const putBlob = function (client) {
+  const content = document.getElementById('put-blob').value.trim();
+  const key = document.getElementById('object-key-put-blob').value.trim() || 'blob';
+  const md5String = crypto.createHash('md5').update(new Buffer(content, 'utf8')).digest('base64');
+  const options = {
+    expires: 1800,
+    method: 'PUT',
+    'Content-Type': 'text/plain; charset=UTF-8',
+    'Content-Md5': md5String,
+  };
+  const url = client.signatureUrl(key, options);
+
+  return $.ajax({
+    url,
+    method: 'PUT',
+    data: content,
+    beforeSend(xhr) {
+      xhr.setRequestHeader('Content-Type', 'text/plain; charset=UTF-8');
+      xhr.setRequestHeader('Content-MD5', md5String);
+    },
+    crossDomain: true,
+    complete(jqXHR, textStatus) {
+      console.log(textStatus);
+    },
+  });
+};
 
 const downloadFile = function (client) {
   const object = document.getElementById('dl-object-key').value.trim();
@@ -222,6 +249,10 @@ window.onload = function () {
     applyTokenDo(uploadBlob);
   };
 
+  document.getElementById('put-blob-button').onclick = function () {
+    applyTokenDo(putBlob);
+  };
+
   document.getElementById('list-files-button').onclick = function () {
     applyTokenDo(listFiles);
   };

lib/common/signUtils.js

@@ -124,6 +124,10 @@ exports._signatureForURL = function _signatureForURL(accessKeySecret, options, r
     const value = options[key];
     if (lowerKey.indexOf('x-oss-') === 0) {
       headers[lowerKey] = value;
+    } else if (lowerKey.indexOf('content-md5') === 0) {
+      headers[key] = value;
+    } else if (lowerKey.indexOf('content-type') === 0) {
+      headers[key] = value;
     } else if (lowerKey !== 'expires' && lowerKey !== 'response' && lowerKey !== 'process' && lowerKey !== 'method') {
       subResource[lowerKey] = value;
     }

task/browser-test-build.js

@@ -58,7 +58,7 @@ function build(options, callback) {
         aliases: {
           'zlib': false,
           'iconv-lite': false,
-          'crypto': './shims/crypto.js',
+          'crypto': './shims/crypto/crypto.js',
         },
         verbose: false
       }).bundle(function(err, data) {

test/browser/browser.test.js

@@ -16,7 +16,7 @@ const { callbackServer } = require('../../test/const');
 const { prefix } = utisl;
 const sinon = require('sinon');
 const md5 = require('crypto-js/md5');
-
+const crypto1 = require('crypto');
 
 let ossConfig;
 const timemachine = require('timemachine');
@@ -551,9 +551,25 @@ describe('browser', () => {
     // });
     //
     it('should signature url for PUT', function* () {
-      const url = this.store.signatureUrl(this.name, { method: 'PUT' });
-      const res = yield urllib.request(url, { method: 'PUT' });
+      const putString = 'Hello World';
+      const contentMd5 = crypto1
+        .createHash('md5')
+        .update(new Buffer(putString, 'utf8'))
+        .digest('base64');
+      console.log(contentMd5);
+      const url = this.store.signatureUrl(this.name, {
+        method: 'PUT',
+        'Content-Type': 'text/plain; charset=UTF-8',
+        'Content-Md5': contentMd5,
+      });
+      const headers = {
+        'Content-Type': 'text/plain; charset=UTF-8',
+        'Content-MD5': contentMd5,
+      };
+      const res = yield urllib.request(url, { method: 'PUT', data: putString, headers });
       assert.equal(res.status, 200);
+      const headRes = yield this.store.head(this.name);
+      assert.equal(headRes.status, 200);
     });
 
     it('should signature url get need escape object ok', function* () {

test/node/object.test.js

@@ -13,6 +13,7 @@ const urllib = require('urllib');
 const copy = require('copy-to');
 const mm = require('mm');
 const streamEqual = require('stream-equal');
+const crypto = require('crypto');
 
 const tmpdir = path.join(__dirname, '.tmp');
 if (!fs.existsSync(tmpdir)) {
@@ -786,9 +787,21 @@ describe('test/object.test.js', () => {
     });
 
     it('should signature url for PUT', function* () {
-      const url = this.store.signatureUrl(this.name, { method: 'PUT' });
-      const res = yield urllib.request(url, { method: 'PUT' });
+      const putString = 'Hello World';
+      const contentMd5 = crypto.createHash('md5').update(new Buffer(putString, 'utf8')).digest('base64');
+      const url = this.store.signatureUrl(this.name, {
+        method: 'PUT',
+        'Content-Type': 'text/plain; charset=UTF-8',
+        'Content-Md5': contentMd5,
+      });
+      const headers = {
+        'Content-Type': 'text/plain; charset=UTF-8',
+        'Content-MD5': contentMd5,
+      };
+      const res = yield urllib.request(url, { method: 'PUT', data: putString, headers });
       assert.equal(res.status, 200);
+      const headRes = yield this.store.head(this.name);
+      assert.equal(headRes.status, 200);
     });
 
     it('should signature url for PUT with callback parameter', function* () {