尧图网络 高端网站定制 · 原创设计
免费咨询热线
400-888-6620
免费获取方案
Bookmarklet Gen 实战指南:在 YOURLS 中将 JavaScript 压缩为可书签化的 Bookmarklet 链接
后端【免费下载链接】YOURLS The standard, self hosted, powerful and customizable, URL shortener in PHP项目地址https://gitcode.com/gh_mirrors/yo/YOURLS点击查看免费下载导读Bookmarklet Gen 是一个轻量级的 PHP 库核心能力是把可读的 JavaScript 代码一键转换为可直接拖入浏览器书签栏、以javascript:协议执行的 Bookmarklet 链接。在 YOURLS 项目中它被封装为yourls_make_bookmarklet()函数支撑管理后台工具页中 Shorten、Instant Shorten、Custom Shorten 以及 Facebook / Twitter / Tumblr 等一批官方 Bookmarklet 的生成。读完本文你将掌握该库的安装方式、crunch()使用姿势、每一步压缩与编码的底层原理以及它在 YOURLS 中的真实调用链路与测试验证方式。一、什么是 Bookmarklet为什么需要生成器Bookmarklet 本质上就是一个href以javascript:开头的小书签链接。用户在浏览器地址栏粘贴或点击它就能在当前页面上执行一段预置的 JavaScript。它无需安装扩展跨浏览器通用是从任意网页快速提交短链接这类场景的经典实现。但手写 Bookmarklet 链接有两个痛点可读代码不能直接放进javascript:链接——换行、空格、引号、括号等字符在 URL 上下文中必须做百分比编码percent-encoding否则链接失效或语义错乱链接越长越难维护——用户通常希望书签栏里的条目越短越好。Bookmarklet Gen 解决的正是这两个问题它接受一段可读的 JavaScript含注释、缩进、多行输出一条经过去注释、压缩空白、字符串保护、URL 编码并包裹在自执行函数中的javascript:链接。用项目自己的话来说这是Bookmarklet Crunchinatorted.mielczarek.org 的经典工具的一个略有增强的 PHP 移植版。二、核心特性四条压缩规则includes/vendor/ozh/bookmarkletgen/README.md明确列出了库的四大特性其具体实现都可以在 src/Bookmarkletgen.php 中逐一对上特性说明对应源码方法移除注释删除//行注释与/* ... */块注释kill_comments()压缩空白去掉多余空格/换行但绝不改动字符串字面量内部compress_white_space()replace_strings()/restore_strings()编码必要字符对最终脚本做 URI 编码仅保留!、*、(、)四个不需编码的字符encodeURIComponent()包裹自执行函数代码被包进(function() { ... })();避免污染全局命名空间crunch()README 给了一个直观的压缩示例。输入function someName( param ) { alert( this is a string ) }输出注意函数名、括号、参数的空格被去掉而字符串内部的两个空格被完整保留function%20someName(param){alert(this%20is%20a%20string)}字符串内部内容不被破坏正是通过先取出、后回填的两阶段策略实现的详见第四节。三、安装Composer 与手动两种方式方式一Composer在项目的composer.json中加入依赖并执行composer install{ require: { ozh/bookmarkletgen: ~1.3 } }也可以在命令行直接执行README 原文如此等价于向composer.json声明依赖composer install ozh/bookmarkletgen需要说明的是在当前 Composer 2.x 的通行做法中向项目新增依赖通常使用composer require ozh/bookmarkletgen而composer install用于安装composer.json中已声明的依赖。本仓库的 composer.json 声明的是ozh/bookmarkletgen: ^1.2锁文件 composer.lock 中实际锁定版本为1.3要求PHP 8.0许可证为 MIT并通过 PSR-4 将命名空间Ozh\Bookmarkletgen\映射到src目录——这就是new \Ozh\Bookmarkletgen\Bookmarkletgen能直接实例化的原因。方式二手动引入不使用 Composer 时直接下载类文件并手动requirerequire path/to/Bookmarkletgen.php;四、快速上手crunch()一个真实示例库的公共入口只有一个方法crunch( $code )输入 JavaScript 源码字符串输出一条完整的javascript:链接。README 的示例完整复现如下?php $javascript CODE var linkhttps://google.com/; // destination window.location link; CODE; require vendor/autoload.php; // if you install using Composer require path/to/Bookmarkletgen.php; // otherwise $book new \Ozh\Bookmarkletgen\Bookmarkletgen; $link $book-crunch( $javascript ); printf( a href%sbookmarklet/a, $link );输出结果为a hrefjavascript:(function()%7Bvar%20link%3D%22https%3A%2F%2Fgoogle.com%2F%22%3Bwindow.location%3Dlink%3B%7D)()%3Bbookmarklet/a对照输出可以验证三条规则的实际效果行注释// destination被删除代码被包裹进(function() {...})();整个脚本被 URI 编码其中https://google.com/中的:与/都被编码为%3A、%2F避免了在javascript:URL 中产生歧义。README 还提示更多细节参见随库提供的 examples。五、源码级原理crunch()的六步流水线crunch()的实现在 src/Bookmarkletgen.php是一个清晰的六步流水线每一步都是独立的私有方法(function() { 源码 })(); ① 包裹自执行函数 ↓ replace_strings() ② 抽出字符串字面量替换为 __N__ 占位符 ↓ kill_comments() ③ 删除 // 行注释和 /* */ 块注释 ↓ compress_white_space() ④ 压缩空白、合并为单行 ↓ combine_strings() restore_strings() ⑤ 合并相邻字符串并回填真实字符串 ↓ encodeURIComponent() ⑥ URI 编码拼上 javascript: 前缀各步骤的核心实现如下。1. 包裹自执行函数$out (function() {\n . $code . \n})();;把用户代码包进匿名函数并立即执行让变量如示例中的var link不会泄漏到全局作用域同时保证书签在任何页面上执行时互不干扰。2. 字符串保护最关键的一步replace_strings()对源码逐字符扫描识别或包裹的字符串字面量正确跳过\转义字符将其替换为__0__、__1__这样的占位符并存入$literal_strings数组。restore_strings()在压缩结束后再用preg_replace(/__.$i.__/, $string, $code, 1)逐个回填。这样做的目的正如注释所说字符串不能参与去空白优化先取出、丑化代码、再放回保证this is a string这类内容在压缩后原样保留。3. 去注释$code preg_replace( !\s*//.$!m, , $code ); // 行注释 $code preg_replace( !/\*.?\*/!sm, , $code ); // 块注释s 修饰符让 . 匹配换行4. 压缩空白compress_white_space()依次执行Tab 转空格、连续多个空格合并为一个、删除运算符/括号/花括号前后多余的空白通过\x21 \x25 \x26 ... \x7e这一串十六进制字符类精确匹配!%()*,-/:;?[]\{|}~等符号、按行拆分后trim每行并丢弃空行、最终implode()拼成单行。5. 合并相邻字符串combine_strings()用preg_replace(/\/m, , $code)与preg_replace(/\/m, , $code)把hello world中多余的去掉进一步省几个字符。6. URI 编码encodeURIComponent()是 JS 同名函数的 PHP 移植先rawurlencode()再用strtr()把%21、%2A、%28、%29还原为!、*、(、)——这四个字符在 URI 中本就合法无需编码能再多省一点长度。六、在 YOURLS 中的真实应用yourls_make_bookmarklet()Bookmarklet Gen 不是孤立存在的第三方库它是 YOURLS 官方功能的一部分。YOURLS 在 includes/functions-formatting.php 中封装了薄薄的适配层/** * Converts readable Javascript code into a valid bookmarklet link * * Uses https://github.com/ozh/bookmarkletgen * * since 1.7.1 * param string $code Javascript code * return string Bookmarklet link */ function yourls_make_bookmarklet( $code ) { $book new \Ozh\Bookmarkletgen\Bookmarkletgen; return $book-crunch( $code ); }也就是说在 YOURLS 环境中你不需要手动new类直接调用yourls_make_bookmarklet( $js_code )即可。它的真实消费方在管理后台的 admin/tools.php工具页面用 heredoc 定义了多段可读的 JavaScript如获取当前页面 URL 与选中文本、构造?upusurts参数并弹窗/跳转提交的脚本然后循环调用yourls_make_bookmarklet()生成这些 BookmarkletShorten标准缩短询问自定义关键字Instant Shorten即时缩短不询问关键字Custom shorten自定义关键字缩短Instant Custom Shorten即时自定义关键字缩短YOURLS Facebook、YOURLS Twitter、YOURLS Tumblr带社交平台分享的书签这些生成的链接随后通过yourls_bookmarklet_link()输出为页面上的可拖拽/可右键复制的书签按钮。你可以打开自己的 YOURLS 后台 → Tools 页面查看实际效果。单元测试同样覆盖了这个适配层tests/tests/format/FormatTest.php 中的test_bookmarklet()调用yourls_make_bookmarklet( hello )并断言返回值为字符串。测试注释特别说明Bookmarklet 生成器产出的 JavaScript 是否合法由该库自带的单元测试负责README 的 Tests 一节也强调库自带单元测试确保压缩后的 JavaScript 仍是合法代码YOURLS 侧只验证接口可用性。七、运行环境与版本要求README 明确当前版本支持PHP 8.1并注明早期版本曾在 PHP 5.3 – 7.2 上测试过。这与本仓库的实际情况一致——composer.lock 中ozh/bookmarkletgen1.3 的require为php: 8.0。因此在使用本文示例时请确保运行环境满足 PHP 8.0 及以上官方 README 推荐 8.1。八、许可证该库的 LICENSE 是一条极其宽松的声明README 原文Do whatever the hell you want to do with it.——你可以对它做任何你想做的事。从包元数据看它同时以 MIT 许可证发布见 composer.lock在 YOURLS 内可以放心地随主项目一起分发与使用。小结从 README 的四条压缩特性到crunch()六步流水线的源码实现再到 YOURLS 中yourls_make_bookmarklet()的封装与 Tools 页面七种官方 Bookmarklet 的生成Bookmarklet Gen 展示了小而美库的典型形态一个类、一个方法、一个清晰的处理管线。当你需要为自建 YOURLS 增加自定义书签例如带特定参数、特定跳转逻辑的快捷缩短时完全可以在admin/tools.php的既有 heredoc 模式基础上追加自己的 JavaScript 片段再交给yourls_make_bookmarklet()完成压缩与编码——这正是该库在 YOURLS 生态中的定位与价值。赞分享后端【免费下载链接】YOURLS The standard, self hosted, powerful and customizable, URL shortener in PHP项目地址https://gitcode.com/gh_mirrors/yo/YOURLS点击查看免费下载相关推荐WhatFont-Bookmarklet 安装和配置指南WhatFont Bookmarklet 安装和配置指南 1. 项目基础介绍和主要编程语言 项目基础介绍 WhatFont Bookmarklet 是一个用于检开发工具NewsBlur 分享书签工具Sharing Bookmarklet完全指南原理、安装与源码解析NewsBlur 分享书签工具Sharing Bookmarklet完全指南原理、安装与源码解析 导读 本文围绕 NewsBlur 的 Add Site后端前端社交人工智能React企业级AI聊天组件架构解析assistant-ui实现原理与生产就绪指南React企业级AI聊天组件架构解析assistant ui实现原理与生产就绪指南 assistant ui是一个基于TypeScript/React构建的企AI Agent前端UI组件创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
RELATED

相关推荐

Antra开发指南:4步编写新的音乐源适配器(BaseSourceAdapter接口完全详解)

Antra开发指南:4步编写新的音乐源适配器(BaseSourceAdapter接口完全详解)

Antra开发指南:4步编写新的音乐源适配器(BaseSourceAdapter接口完全详解) 【免费下载链接】Antra A desktop music library builder that turns Spotify, Youtube Music Apple Music, Amazon Music, Tidal, Qobuz, and Deezer links into ful…

📅 2026/10/7 14:18:11
2026年高分AI论文工具全攻略:TaoToken统一Key接入新手入门指南

2026年高分AI论文工具全攻略:TaoToken统一Key接入新手入门指南

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views …

📅 2026/10/7 14:18:11
UE5实时拉取RTSP流:FFMPEGMedia插件接入与播放链路全解析

UE5实时拉取RTSP流:FFMPEGMedia插件接入与播放链路全解析

最近在做一个智慧园区大屏项目,遇到一个很典型的需求:把园区里数十路摄像头的RTSP流,直接拉到UE5场景里实时显示,而不是先转码成HLS或者缓存下来再播。尝试了UE5原生媒体框架之后发现它并不能直接拉RTSP,最后稳定跑通的…

📅 2026/10/7 14:18:11
MORE NEWS

更多资讯

📰

学习通刷课脚本全解析:Selenium自动化播放与FontTools字体解密实战

简介:一套基于 Python 的学习通自动刷课脚本源码,面向希望借助自动化完成平台课程任务、减少重复点击的学习者,也适合想在 Selenium 浏览器操作和 fonttools 字体处理上做实践参考的 Python 开发者。资源包共 27 个文件、约 2.41MB&#xff0…

📰

Obsidian图文写作流水线:从Workflow到Skill,Token成本直降七成

1. 从Workflow到Skill:一次被Token账单逼出来的架构调整去年下半年我开始用Obsidian搭自己的图文写作流水线,核心诉求很简单:把零散的素材、大纲、配图说明、发布文案串成一条自动化的链路。最开始我走的是Workflow路线——用插件把多个动作串…

📰

零依赖纯文本知识库:用文件夹+Git搭建永不过期的个人笔记系统

caveman 是我最近一直挂在嘴边的一个小项目代号,外号叫“穴居人方案”。圈子里偶尔看到叫 caveman 的工具或开源项目,思路大多差不多:把知识管理这件事打回原形,不用花哨的 App,不用云端数据库,就用文件夹、…

📰

Obsidian插件Superpowers详解:从安装配置到高效文本编辑技巧

1. 为什么 Obsidian 玩家都在聊 Superpowers如果你是个 Obsidian 重度用户,最近逛社区或插件市场时应该会频繁撞见“Superpowers”这个名字。它不是一个让你在笔记里写代码开外挂的神秘工具,而是一个把 Obsidian 原生的文本编辑、搜索、滚动、书签这些基…

📰

ARCGIS学习笔记(一):计算几何中面积被禁用?用TaoToken统一Key跑通Python面积求和

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views …

📰

玩转 OpenClaw:用 Skill 系统搭建专属 AI 工作流的 TaoToken 实践

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views …

TODAY

今日更新

THIS WEEK

本周精选

THIS MONTH

本月热门

读完文章,想聊聊您的网站?

告诉我们您的行业与需求,资深顾问一对一梳理方案与报价,全程免费。

📞 💬