Infinite-Canvas插件生态Chrome素材采集与Photoshop直连功能详解【免费下载链接】Infinite-CanvasSupports comfyui/API calls/modelscope calls项目地址: https://gitcode.com/gh_mirrors/infini/Infinite-CanvasInfinite-Canvas是一款支持comfyui/API调用/modelscope调用的开源项目其强大的插件生态为用户提供了丰富的功能扩展。本文将详细介绍其中的Chrome素材采集插件和Photoshop直连插件帮助用户快速掌握这两个实用工具的使用方法提升素材管理和设计工作的效率。Chrome素材采集插件一站式网页素材获取工具安装步骤简单几步开启素材采集之旅打开Chrome浏览器在地址栏输入chrome://extensions/进入扩展程序页面。右上角开启「开发者模式」此时页面会出现「加载已解压的扩展程序」按钮。点击该按钮选择项目中的tools/chrome-local-asset-importer目录即可完成插件安装。功能亮点全方位素材捕捉能力该插件能够扫描当前网页中的多种素材包括普通http/https图片、视频blob:资源如飞书文档data:内联图片、SVGimage xlink:href如夸克文档整页渲染跨域iframe内的素材canvas画布内容如腾讯文档、网页版 PDF、图表等。对于视频素材插件会扫描video、source标签以及.mp4/.webm/.mov/.m4v/.flv直链还会嗅探网络请求里通过XHR/fetch加载的媒体合并进扫描结果。此外插件还提供了「扫描前自动滚动加载」功能可触发长文档/懒加载页面把图片渲染出来再扫描「截取当前可见画面」按钮则适用于地图、WebGL、加密画布等toDataURL读出来是黑屏的内容。使用方法轻松导入与管理素材先启动Infinite Canvas后端服务。点击浏览器右上角插件图标输入服务地址例如127.0.0.1:8767、192.168.1.10:3000也可以填写完整地址http://192.168.1.10:3000然后点击「连接」。可点击图钉按钮打开Chrome侧边栏侧边栏不会因为切换页面而关闭。在任意网页点击「扫描」插件会列出当前页面可访问的图片。勾选图片选择平台和模型可开启「导入后智能分类」点击「导入所选」。也可以点「下载到本地」把所选素材直接存到浏览器下载目录这一步不需要连接后端可当作独立采集工具使用。选多张时会自动打包成一个zip压缩包以「文件夹」命名单张则直接下原文件。导入后的文件会写入assets/uploads/你填写的文件夹素材库管理页面的「本地素材」会同步显示这些图片智能分类结果会写入同名.classification.json。Photoshop直连插件无缝衔接设计工作流插件概述双向打通资产库与PSInfinite Canvas的Photoshop插件是一个Adobe Photoshop UXP面板插件通过局域网地址连接Infinite Canvas后端实现了资产库与PS的双向打通。它可以将资产库中的图片素材置入当前PS文档也可以把当前PS文档导出成PNG存进选中的图片分组并且支持实时同步连上后端的WebSocket后资产库有变化时面板会自动刷新。快速上手简单配置即可使用启动Infinite Canvas后端启动服务.bat/python main.py。在Photoshop里打开「大雄资产库」面板。顶部填入服务地址本机可填127.0.0.1:8767按实际端口局域网则填跑后端那台电脑的IP:端口例如192.168.1.10:3000。点「连接」绿点表示已连接。用「资产库/分组」下拉切换点素材选中后可选择「置入当前文档」双击素材也可或「打开」在外部浏览器打开原图/视频。底部「把当前文档存到此分组↑」按钮可将当前PS文档合并导出为PNG存入选中的图片分组。地址会被记住下次打开点「连接」即可恢复。右上「实时」勾选后画布/网页那边新增素材面板会自动刷新。调试安装开发者的进阶之路如果需要进行插件调试可按以下步骤操作安装Adobe UXP Developer ToolUDT。打开Photoshop24.0以上。在UDT中点击Add Plugin选择项目中的tools/photoshop-asset-connector/manifest.json文件。点击Load在PS的「增效工具」菜单里打开「大雄资产库」。接口契约技术细节一览该插件与后端通过以下接口进行交互读取资产库GET /api/asset-library返回{ library: { libraries, active_library_id } }。上传字节POST /api/ai/uploadmultipart返回{ files:[{ url:/assets/input/…, kind, name }] }。存入分组POST /api/asset-library/items体{ library_id, category_id, url, name }仅图片类分组。实时刷新WS /ws/stats收到{ type:asset_library_updated }触发刷新。代码结构模块化设计插件采用多script 全局DX命名空间的模块化设计脚本按依赖顺序加载state → net → sources → ps → socket → app。主要文件包括index.html外壳、style.css样式、js/state.js共享状态、js/net.js网络相关、js/sources.js数据源适配器、js/ps.jsPS操作、js/socket.jsWebSocket实时同步、js/app.js启动与事件。总结提升效率的得力助手Infinite-Canvas的Chrome素材采集插件和Photoshop直连插件为用户打造了从素材获取到设计创作的完整工作流。通过这两个插件用户可以轻松采集网页素材并高效管理同时实现与Photoshop的无缝衔接大大提升了工作效率。无论是新手还是专业用户都能快速上手并从中受益。如果你还没有体验过Infinite-Canvas的插件生态不妨通过以下方式获取项目git clone https://gitcode.com/gh_mirrors/infini/Infinite-Canvas开启你的高效设计之旅。【免费下载链接】Infinite-CanvasSupports comfyui/API calls/modelscope calls项目地址: https://gitcode.com/gh_mirrors/infini/Infinite-Canvas创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考