index.html 2.0 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465
  1. <!doctype html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>Document</title>
  6. <link rel="stylesheet" href="normalize.css">
  7. <script src="//cdn.bootcss.com/jquery/3.1.1/jquery.min.js" type="text/javascript"></script>
  8. <style>
  9. form {
  10. margin: 30px 0;
  11. }
  12. .submit {
  13. display: inline-block;
  14. width: 100px;
  15. background: #02a3c6;
  16. border: none;
  17. color: #fff;
  18. line-height: 40px;
  19. text-align: center;
  20. cursor: pointer;
  21. }
  22. </style>
  23. </head>
  24. <body>
  25. <form action="http://v0.api.upyun.com/sdkimg" id="demoForm" method="POST" enctype="multipart/form-data">
  26. <fieldset>
  27. <legend>Client Upload Demo</legend>
  28. <input name="file" type="file">
  29. <input type="button" value="submit" class="submit" id="upload">
  30. </fieldset>
  31. </form>
  32. <script>
  33. // 文件保存的路径
  34. var save_path = '/test/filename.txt';
  35. $('#upload').on('click', function() {
  36. // 获取 policy 和 secret
  37. $.getJSON('http://localhost:9000/policy.php?save_path=' + save_path, function (data) {
  38. var uploadData = new FormData($('#demoForm')[0]);
  39. uploadData.append('policy', data.policy);
  40. uploadData.append('authorization', data.authorization);
  41. $.ajax({
  42. url: 'http://v0.api.upyun.com/sdkimg',
  43. type: 'POST',
  44. data: uploadData,
  45. cache: false,
  46. processData: false,
  47. contentType: false,
  48. }).done(function(data, textStatus) {
  49. alert('upload success');
  50. }).fail(function(res, textStatus, error) {
  51. try {
  52. var body = JSON.parse(res.responseText);
  53. alert('error: ' + body.message);
  54. } catch(e) {
  55. console.error(e);
  56. }
  57. });
  58. });
  59. });
  60. </script>
  61. </body>
  62. </html>