biheng
/
uppy


			
				
					
						
						
							1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071
							<!doctype html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>Uppy – AWS upload example</title>
    <link href="./uppy.min.css" rel="stylesheet" />
  </head>
  <body>
    <h1>AWS upload example</h1>
    <details open name="uppy">
      <summary>Sign on the server</summary>
      <div id="uppy-sign-on-server"></div>
    </details>
    <details name="uppy">
      <summary>Sign on the client (if WebCrypto is available)</summary>
      <div id="uppy-sign-on-client"></div>
    </details>
    <footer>
      You seeing the simplified example, with a backend that mimicks a
      Companion-like instance. See
      <a href="./withCustomEndpoints.html">the custom endpoint example</a> if
      you need to see how to use one or more custom function for handling
      communication with the backend.
    </footer>
    <noscript>You need JavaScript to run this example.</noscript>
    <script type="module">
      import { Uppy, Dashboard, AwsS3 } from './uppy.min.mjs'
      function onUploadComplete(result) {
        console.log(
          'Upload complete! We’ve uploaded these files:',
          result.successful,
        )
      }
      function onUploadSuccess(file, data) {
        console.log(
          'Upload success! We’ve uploaded this file:',
          file.meta['name'],
        )
      }
      {
        const uppy = new Uppy()
          .use(Dashboard, {
            inline: true,
            target: '#uppy-sign-on-server',
          })
          .use(AwsS3, {
            id: 'myAWSPlugin',
            endpoint: '/',
          })

        uppy.on('complete', onUploadComplete)
        uppy.on('upload-success', onUploadSuccess)
      }
      {
        const uppy = new Uppy()
          .use(Dashboard, {
            inline: true,
            target: '#uppy-sign-on-client',
          })
          .use(AwsS3, {
            id: 'myAWSPlugin',
            endpoint: '/',
            getTemporarySecurityCredentials: typeof crypto?.subtle === 'object',
          })

        uppy.on('complete', onUploadComplete)
        uppy.on('upload-success', onUploadSuccess)
      }
    </script>
  </body>
</html>