e***@foxmail.com
e***@foxmail.com
  • 发布:2021-12-17 15:20
  • 更新:2022-07-21 16:59
  • 阅读:2138

【报Bug】运行到支付宝小程序模拟器报 Uncaught TypeError: Cannot convert undefined or null to object

分类:uni-app

产品分类: uniapp/小程序/阿里

PC开发环境操作系统: Mac

PC开发环境操作系统版本号: Big Sur 11.3.1

HBuilderX类型: 正式

HBuilderX版本号: 3.2.16

第三方开发者工具版本号: 2.7.2 (2.7.2)

基础库版本号: 2.0

项目创建方式: HBuilderX

操作步骤:

npm install nim-web-sdk-ng

import NIMSDK from 'nim-web-sdk-ng/dist/NIM_UNIAPP_SDK'

运行到小程序模拟器-运行到支付宝小程序模拟器

报错

预期结果:

不要报错

实际结果:
Uncaught TypeError: Cannot convert undefined or null to object  
    at hasOwnProperty (<anonymous>)  
    at has$1 (vendor.js:formatted:3119)  
    at wellKnownSymbol (vendor.js:formatted:3218)  
    at vendor.js:formatted:3235  
    at vendor.js:formatted:3088  
    at Object.<anonymous> (vendor.js:formatted:3088)  
    at Object.CHqb (vendor.js:formatted:6493)  
    at __webpack_require__ (vendor.js:formatted:22346)  
    at Object.<anonymous> (vendor.js:formatted:2921)  
    at Object.CHqb (vendor.js:formatted:2968)

bug描述:

uniapp 运行去支付宝小程序报错

Uncaught TypeError: Cannot convert undefined or null to object  
    at hasOwnProperty (<anonymous>)  
    at has$1 (vendor.js:formatted:3119)  
    at wellKnownSymbol (vendor.js:formatted:3218)  
    at vendor.js:formatted:3235  
    at vendor.js:formatted:3088  
    at Object.<anonymous> (vendor.js:formatted:3088)  
    at Object.CHqb (vendor.js:formatted:6493)  
    at __webpack_require__ (vendor.js:formatted:22346)  
    at Object.<anonymous> (vendor.js:formatted:2921)  
    at Object.CHqb (vendor.js:formatted:2968)

调试一番得知是 uniapp 注入进支付宝小程序的代码里的 global 对象少了 symbol

/* WEBPACK VAR INJECTION */(function(global, uni) {(function(global,factory){  

/* WEBPACK VAR INJECTION */}.call(this, __webpack_require__(/*! ./../../../../../../../../../Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/node_modules/webpack/buildin/global.js */ 2), __webpack_require__(/*! ./node_modules/@dcloudio/uni-mp-alipay/dist/index.js */ 1)["default"]))  

/***/ }),

上文这一段就是 uniapp 编译去支付宝里注入进来的代码,看起来 /node_modules/@dcloudio/uni-mp-alipay/dist/index.js 里得到的对象作为 global 注入,少了symbol.

最终让我的在 corejs 里 polyfill 过的库运行 hasOwnProperty 时报错,因为 it 也就是 symbol 被传入了 undefined。下面这段是 corejs 插入的

    var has$1 = function (it, key) {  
      return hasOwnProperty$c.call(it, key);  
    };
2021-12-17 15:20 负责人:无 分享
已邀请:
e***@foxmail.com

e***@foxmail.com (作者)

来个活人呀

e***@foxmail.com

e***@foxmail.com (作者)

报错的文件是af-appx.worker.min.js

e***@foxmail.com

e***@foxmail.com (作者)

再次仔细调试,我自己的依赖被babel+corejs 翻译里有个 commonjsGlobal 的定义,要试探的取 global。

而 uniapp 注入进支付宝的代码里把 global 通过这样的方式注入了进来 Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/node_modules/webpack/buildin/global.js

所以,这样注入进来的 global 只包含了这样的属性

Date: ƒ Date()  
Error: ƒ Error()  
Function: ƒ (e)  
Math: Math {abs: ƒ, acos: ƒ, acosh: ƒ, asin: ƒ, asinh: ƒ, …}  
Object: ƒ Object()  
Reflect: Reflect {defineProperty: ƒ, deleteProperty: ƒ, apply: ƒ, construct: ƒ, get: ƒ, …}  
RegExp: ƒ RegExp()  
String: ƒ String()  
TypeError: ƒ TypeError()  
clearInterval: ƒ (e)  
clearTimeout: ƒ (e)  
getLocale: ƒ getLocale()  
isFinite: ƒ isFinite()  
setInterval: ƒ (e,r)  
setTimeout: ƒ (e,r)

里面就是没有 symbol。。而真实的支付宝全局环境当然是能得到 global 的。
这个问题在微信没有出现因为微信的 global 没有被这样污染,

e***@foxmail.com

e***@foxmail.com (作者)

哎,实在不知道怎么办了,只能是 uni cloud 官方的人来修吧

e***@foxmail.com

e***@foxmail.com (作者)

微信上没有问题,是因为 uniapp 这边注入进来的全局对象就是微信的全局对象,uniapp 注入微信的的代码如下:

/* WEBPACK VAR INJECTION */(function(global, uni) {  

    //.......省略  

/* WEBPACK VAR INJECTION */}.call(this, __webpack_require__(/*! ./../../../../../../../../../Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/node_modules/webpack/buildin/global.js */ 2), __webpack_require__(/*! ./node_modules/@dcloudio/uni-mp-weixin/dist/index.js */ 1)["default"]))

得到的 global 对象是

global  
Window {window: Window, self: Window, document: HTMLDocument, location: Location, top: Window, …}  

Symbol  
ƒ Symbol() { [native code] }

然而 uniapp 注入支付宝小程序的代码如下

/* WEBPACK VAR INJECTION */(function(global, uni) {Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var commonjsGlobal=typeof globalThis!=='undefined'?globalThis:typeof window!=='undefined'?window:typeof global!=='undefined'?global:typeof self!=='undefined'?self:{};  

  //...省略  

/* WEBPACK VAR INJECTION */}.call(this, __webpack_require__(/*! ./../../../../../../../../../Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli/node_modules/webpack/buildin/global.js */ 2), __webpack_require__(/*! ./node_modules/@dcloudio/uni-mp-alipay/dist/index.js */ 1)["default"]))

这边得到的 global 对象是

Date: ƒ Date()    
Error: ƒ Error()    
Function: ƒ (e)    
Math: Math {abs: ƒ, acos: ƒ, acosh: ƒ, asin: ƒ, asinh: ƒ, …}    
Object: ƒ Object()    
Reflect: Reflect {defineProperty: ƒ, deleteProperty: ƒ, apply: ƒ, construct: ƒ, get: ƒ, …}    
RegExp: ƒ RegExp()    
String: ƒ String()    
TypeError: ƒ TypeError()    
clearInterval: ƒ (e)    
clearTimeout: ƒ (e)    
getLocale: ƒ getLocale()    
isFinite: ƒ isFinite()    
setInterval: ƒ (e,r)    
setTimeout: ƒ (e,r)

如此导致我的代码里有 corejs 注入的关于 symbol 的判断,而支付宝里 Symbol 是 undefined 导致报错。

e***@foxmail.com

e***@foxmail.com (作者)

var Symbol$2=global$1.Symbol;  
var createWellKnownSymbol=useSymbolAsUid?Symbol$2:Symbol$2&&Symbol$2.withoutSetter||uid;  

var wellKnownSymbol=function wellKnownSymbol(name){  
  debugger;  
if(!has$1(WellKnownSymbolsStore$1,name)||!(nativeSymbol||typeof WellKnownSymbolsStore$1[name]=='string')){  
if(nativeSymbol&&has$1(Symbol$2,name)){  
WellKnownSymbolsStore$1[name]=Symbol$2[name];  
}else{  
WellKnownSymbolsStore$1[name]=createWellKnownSymbol('Symbol.'+name);  
}

最终调试的结果是在 nativeSymbol&&has$1(Symbol$2,name) 上报错了。就是因为 Symbol$2 这个 global 是 uniapp 注入进来的,上面没有 Symbol

e***@foxmail.com

e***@foxmail.com (作者)

提了issue: https://github.com/dcloudio/uni-app/issues/3120

1***@qq.com

1***@qq.com

在吗大佬 解决了吗 遇到同样的问题了

该问题目前已经被锁定, 无法添加新回复