qt - 在 QML 中显示来自对 XmlHttpRequest (REST) 的响应的图像

Question

我需要从 REST API 调用中获取 jpeg 图像。我使用 XMLHttpRequest 因为请求需要身份验证 header (即我不能只创建一个图像并将源设置为带有 user:passwd@url 的 URL)。

我认为我可以使用 Canvas 并通过将 REST 数据设置为 CanvasImageData 对象来调用 drawImage。但是，它不绘制任何东西，也不会产生错误。 REST 调用返回 Content-Type:image/jpeg 和 Transfer-Encoding:chunked。

这种方法应该有效，还是我遗漏了其他东西？有更好的建议吗？

// map_request.imageBytes is a property that holds the binary response from the REST query
Canvas {
id: location_map
width: 2400
height: 1500
contextType: '2d'

onPaint: {
  if (context && map_request.imageBytes)
  {
    var cid = context.createImageData(width, height);
    cid.data = map_request.imageBytes;
    context.drawImage(cid, 0, 0);
  }
}

Answer 1

正确的解决方案是按照@folibis 的指示创建一个QQuickImageProvider。但是，由于我使用的是Qt5.5，所以我无法制作QQuickAsyncImageProvider(在Qt5.6中引入)。相反，您必须在构造 QQuickImageProvider 时将标志设置为 QQmlImageProviderBase::ForceAsynchronousImageLoading。此标志确保调用 requestImage 不会阻塞主 GUI 线程。

但是，requestImage 期望返回图像，从而导致在不阻塞该线程的情况下从网络获取图像数据的挑战。 QNetworkAccessManager 通过信号返回其状态，而 QQuickImageProvider 不是 QObject，因此我制作了一个辅助类来监视 QNetworkReply 的信号。

class ReplyMonitor : public QObject
{
  Q_OBJECT
public:
  ReplyMonitor(QNetworkAccessManager *);

public Q_SLOTS:
  void handleReplyFinished();
  void handleSslErrors(QNetworkReply *, const QList<QSslError> &);
  void handleAuthenticationRequired(QNetworkReply *, QAuthenticator *);

public:
  bool finished;
};

和

ReplyMonitor::ReplyMonitor(QNetworkAccessManager *mgr)
  : finished(false)
{
  connect(mgr, SIGNAL( finished(QNetworkReply *) ), this, SLOT( handleReplyFinished() ));
  connect(mgr, SIGNAL( sslErrors(QNetworkReply *, const QList<QSslError> &) ),
          this, SLOT( handleSslErrors(QNetworkReply*, const QList<QSslError> &) ));
  connect(mgr, SIGNAL( authenticationRequired(QNetworkReply *, QAuthenticator *) ),
          this, SLOT( handleAuthenticationRequired(QNetworkReply*, QAuthenticator*) ));
}

void ReplyMonitor::handleReplyFinished()
{
  finished = true;
}

然后在 requestImage() 中检查 finished 并调用

  while (!monitor->finished)
  {
    QCoreApplication::processEvents(QEventLoop::AllEvents, 1000);
  }

在我创建要返回的图像之前

  if (reply->error() == QNetworkReply::NoError)
  {
    image.loadFromData(reply->readAll());
  }

我省略了创建 QNetworkRequest 的细节，因为它有详细的记录。