uni-app 安装 ali-oss 插件后，运行到抖音小程序时抖音开发者工具报错

uni-app 安装 ali-oss 插件后，运行到抖音小程序时抖音开发者工具报错

示例代码：

终端：npm i ali-oss;

创建一个 vue 页面
import OSS from 'ali-oss';

操作步骤：

终端：npm i ali-oss;

在 入口或者随意一个 vue页面引入就会报错
import OSS from 'ali-oss';

预期结果：

正常

实际结果：

错误信息1:

{
  "message": "Cannot read properties of undefined (reading 'prototype')",
  "name": "TypeError",
  "stack": "at 324.../internals/descriptors(common/vendor.js:2…or.js:14716:12)↵  at o2(common/vendor.js:13845:25)↵"
}

stack 内信息：

at 324.../internals/descriptors(common/vendor.js:28277:44)
at o2(common/vendor.js:13845:25)
at ?(common/vendor.js:13847:24)
at 547.core-js/modules/es.number.constructor.js(common/vendor.js:48641:9)
at o2(common/vendor.js:13845:25)
at ?(common/vendor.js:13847:24)
at Object.<anonymous>(common/vendor.js:14352:27)
at Object.<anonymous>(common/vendor.js:14715:14)
at 3.../../node_modules/is-buffer/index.js(common/vendor.js:14716:12)
at o2(common/vendor.js:13845:25)

错误信息2:

{
  "message": "common_vendor._export_sfc is not a function",
  "name": "TypeError",
  "stack": "at ?(app.js:24:43)↵at l(http://127.0.0.1:7045/core…://127.0.0.1:7045/app-dist/app-service.js:167:2↵"
}

stack内信息：

at ?(app.js:24:43)
at l(http://127.0.0.1:7045/core/3.20.0.1/tma-core.js:2:566111)
at ?(http://127.0.0.1:7045/core/3.20.0.1/tma-core.js:2:566566)
at s(http://127.0.0.1:7045/core/3.20.0.1/tma-core.js:2:566571)
at u(http://127.0.0.1:7045/core/3.20.0.1/tma-core.js:2:567211)
at ?(http://127.0.0.1:7045/app-dist/app-service.js:167:2)

bug描述：

Uniapp 安装 ali-oss，运行到抖音小程序， 在页面中 import OSS from 'ali-oss'; 抖音小程序开发IDE 报错： TypeError: common_vendor._export_sfc is not a function

但是在微信小程序的开发IDE里就没问题。

Image Image

项目信息 值
产品分类 uniapp/小程序/字节跳动
PC开发环境操作系统 Mac
PC开发环境操作系统版本 14.4.1
HBuilderX类型 正式
HBuilderX版本号 4.08
第三方开发者工具版本号 Version: 4.2.3 OS: darwin
项目创建方式 HBuilderX

更多关于uni-app 安装 ali-oss 插件后，运行到抖音小程序时抖音开发者工具报错的实战教程也可以访问 https://www.itying.com/category-93-b0.html

4 回复

为啥不用官方全家桶？官方的uni-cdn明显更有性价比啊。
https://doc.dcloud.net.cn/uniCloud/uni-cdn/intro.html

更多关于uni-app 安装 ali-oss 插件后，运行到抖音小程序时抖音开发者工具报错的实战教程也可以访问 https://www.itying.com/category-93-b0.html


也是… 谢谢。晚点丢上对象存储的时候看看。

有 解决方案了吗？ 我也遇到同样的问题了。

在使用 uni-app 开发抖音小程序时，如果安装并使用了 ali-oss 插件，可能会遇到抖音开发者工具报错的情况。这通常是因为 ali-oss 插件依赖的某些 Node.js API 或浏览器 API 在抖音小程序环境中不可用。

可能的原因和解决方案：

  1. 环境不兼容：

    • ali-oss 是一个用于 Node.js 和浏览器的 SDK，而抖音小程序环境与浏览器环境不同，可能缺少某些 API。
    • 解决方案：检查 ali-oss 是否支持小程序环境。如果不支持，可以考虑使用其他兼容的 SDK，或者在小程序中使用云函数来调用阿里云 OSS 服务。

  2. 未正确处理小程序环境：

    • ali-oss 可能在小程序环境下无法直接使用，需要进行适配。
    • 解决方案：在小程序环境中，通常需要通过云函数或后端服务来访问阿里云 OSS，而不是直接在前端使用 ali-oss。

  3. 抖音开发者工具的限制：

    • 抖音开发者工具可能对某些 API 或模块有限制，导致报错。
    • 解决方案：检查抖音开发者工具的文档，了解其支持的功能和限制，并确保代码符合这些限制。

  4. 使用云函数：

    • 如果需要在抖音小程序中访问阿里云 OSS，可以考虑使用云函数来处理文件上传、下载等操作。
    • 解决方案：将 ali-oss 的逻辑放在云函数中，小程序端通过调用云函数来间接访问 OSS。

示例：使用云函数访问阿里云 OSS

  1. 创建云函数：

    • 在云函数中安装 ali-oss：
      npm install ali-oss
    • 编写云函数代码，例如 uploadFile.js：
      const OSS = require('ali-oss');

exports.main = async (event, context) => {
  const client = new OSS({
    region: 'your-region',
    accessKeyId: 'your-accessKeyId',
    accessKeySecret: 'your-accessKeySecret',
    bucket: 'your-bucket'
  });

  try {
    const result = await client.put('your-object-key', event.file);
    return result;
  } catch (error) {
    throw error;
  }
};

  2. 小程序端调用云函数：

    • 在小程序端调用云函数上传文件：
      uniCloud.callFunction({
  name: 'uploadFile',
  data: {
    file: 'your-file-data'
  },
  success(res) {
    console.log('上传成功:', res.result);
  },
  fail(err) {
    console.error('上传失败:', err);
  }
});
回到顶部