如何使用 PWA 访问设备上的照片?

问题描述

由于 Apple 拒绝了我的应用程序,我不得不将其转换为 PWA,并且在实现某些功能时遇到了问题。我现在无法访问图片...我最初使用的是图片选择器,但现在显然无法使用。

这是我在 Safari 上遇到的错误

Service Worker 上下文已关闭

这是我目前获取图像的方式:

encodeImageUri(imageUri: any,callback: any): void {
    const c = document.createElement('canvas');
    const ctx = c.getContext('2d');
    const img = new Image();
    img.onload = function() {
      const aux: any = this;
      c.width = aux.width;
      c.height = aux.height;
      ctx.drawImage(img,0);
      const dataURL = c.toDataURL('image/jpeg');
      callback(dataURL);
    };
    img.src = imageUri;
  }

  async uploadImage(image: any,photoName: any,userId: any): Promise<any> {
    const imageRef = this.storageRef.child(`${userId}`).child(`${photoName}`);
    const imageURI = this.webview.convertFileSrc(image);
    return new Promise<any>(async (resolve,reject) => {
      this.encodeImageUri(imageURI,(image64: string) => {
        imageRef.putString(image64,'data_url')
          .then(snapshot => {
            snapshot.ref.getDownloadURL()
              .then(res => resolve(res));
          },err => {
            reject(err);
          });
      });
    });
  }

我在网上和 Stack 上进行了搜索,但找不到有关如何在 PWA 上上传图片的示例。

最接近解决方案的是一些关于注册 Service Worker 的文章,但它并没有真正解释需要在哪里完成。

这是示例,但我不清楚需要在哪里完成或是否应该解决此问题 https://developer.mozilla.org/en-US/docs/Web/API/ServiceWorkerContainer/register

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)