Unity开发,接入 第三方SDK 在 WebGL 平台打包运行

本文主要 以新手的视角 一步步在 unity 引入 web 第三方 sdk 的能力(这里以 腾讯云 web im sdk 作为参考),废话不多说,现在开始~

前期工作,集成 腾讯云 unity im sdk ,并调用相关api后 打包,下面是引入 sdk 的方式:

  • 使用 VSCode 打开unity项目,在根目录下找到 Packages/manifest.json 打开,添加 腾讯云 im unity sdk:
{
  "dependencies":{
    "com.tencent.imsdk.unity":"https://github.com/TencentCloud/chat-sdk-unity.git#unity@7.9.5670"
  }
}

第一步:

首先确认系统内已经安装并配置好 npm(网上有一堆文章,可以去看看),安装成功之后运行下面命令,会显示对应版本号

npm --version
image.png

第二步:

打开 terminal 控制台,进入到 unity webgl 打包后生成的 应用目录

cd C:\xxx\xxx\xxx\project

第三步:

首次进入到 应用目录,在 terminal控制台 输入下面命令创建 package.json(后续不用再执行)

npm init

npm init 不知道怎么配置,点击这里

第四步:

下载安装第三方sdk,这里以 “腾讯云 web im” 举例,在 terminal控制台 继续输入下面命令下载两个文件

npm i @tencentcloud/chat

npm i tim-upload-plugin

第五步:

最后 打开 应用目录下的 index.html,在 <head> </head> 间引入 JS 文件。内容如下:

<head>
<!---  省略其他配置  --->
  <script src="./node_modules/tim-upload-plugin/index.js"></script>
  <script src="./node_modules/@tencentcloud/chat/index.js"></script>
  <script src="./node_modules/@tencentcloud/chat/modules/group-module.js"></script>
  <script src="./node_modules/@tencentcloud/chat/modules/relationship-module.js"></script>
  <script src="./node_modules/@tencentcloud/chat/modules/signaling-module.js"></script>
  • 打包之后的应用目录结构

    接下来 再次运行打包之后的应用 或者 使用 重新执行 Build And Run,通过 web 浏览器上运行验证是否已接入成功

最终成功的效果

  • 调用 api 初始化 及 登录之后的效果

补充:

运行报错:
(web im sdk 没有配置成功,需要通过上面命令一步一步处理,也可能是缓存问题,先通过 npm 相关命令,清理下缓存 并删除 打包后应用目录下 node_modules整个目录,然后重新创建和下载) npm清理缓存点这里

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容