1

我正在尝试从我的应用程序创建一个小型上传器,以将单个图像上传到 transloadit。我参考了文档和下面的示例(Transloadit — Uppy

我有一个特定的路径,不需要网络摄像头/Instagram 源模块。('./assets/my_logo_v2.png'),我如何在下面的代码中提供这个路径。不使用 Instagram 或相机模块?

另外,我有一个来自 Transloadit 的 authKey 和 authSecret,而不是 TRANSLOADIT_API_KEY

我找不到提供这两个的地方。

const Uppy = require('@uppy/core')
const Dashboard = require('@uppy/transloadit')
const Webcam = require('@uppy/webcam')
const Transloadit = require('@uppy/transloadit')
const Instagram = require('@uppy/instagram')

const uppy = new Uppy({
  debug: true,
  autoProceed: false,
  restrictions: {
    maxFileSize: 1024 * 1024 * 1024,
    maxNumberOfFiles: 2,
    minNumberOfFiles: 1,
    allowedFileTypes: ['image/*']
  },
  locale: {
    strings: {
      youCanOnlyUploadFileTypes: 'You can only upload images'
    }
  }
})

uppy
  .use(Transloadit, {
    params: {
      auth: {
        key: YOUR_TRANSLOADIT_API_KEY
      },
      // It’s more secure to use a template_id and enable
      // Signature Authentication
      steps: {
        resize: {
          robot: '/image/resize',
          width: 250,
          height: 250,
          resize_strategy: 'fit',
          text: [
            {
              text: '© Transloadit.com',
              size: 12,
              font: 'Ubuntu',
              color: '#eeeeee',
              valign: 'bottom',
              align: 'right',
              x_offset: 16,
              y_offset: -10
            }
          ]
        }
      }
    },
    waitForEncoding: true
  })
  .use(Instagram, { target: Dashboard, companionUrl: 'https://api2.transloadit.com/companion', companionAllowedHosts: /\.transloadit\.com$/ })
  .use(Dashboard, {
    inline: true,
    maxHeight: 400,
    target: '#uppy-dashboard-container',
    note: 'Images and video only, 1–2 files, up to 1 MB'
  })
  .use(Webcam, { target: Dashboard })
  .on('transloadit:result', (stepName, result) => {
    const file = uppy.getFile(result.localId)
    var resultContainer = document.createElement('div')
    resultContainer.innerHTML = `
      <div>
        <h3>Name: ${file.name}</h3>
        <img src="${result.ssl_url}" /> <br />
        <a href="${result.ssl_url}">View</a>
      </div>
    `
    document
      .getElementById('uppy-transloadit-result')
      .appendChild(resultContainer)
  })
4

0 回答 0