如何修改JavaScript脚本以获取URL哈希值（适配CloudFlare Worker）

由于CloudFlare Worker环境下无法使用URL查询参数（示例：https://example.com/?l=http://example2.com），需将原查询参数传递逻辑改为通过哈希URL（示例：https://example.com/#http://example2.com）实现。

原查询参数脚本（参考） #

原脚本用于从URL查询参数中提取l参数：

function getUrlVars() {
    var vars = {};
    var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi,    
    function(m,key,value) {
      vars[key] = value;
    });
    return vars;
  }      

var l = getUrlVars()["l"];

适配哈希URL的优化脚本 #

以下是调整后的完整实现，解决哈希值提取、自动填充输入框等问题：

<script>
// 页面加载时自动处理哈希值
window.onload = function() {
    var hash = window.location.hash;
    if (hash) {
        // 移除#前缀并解码URL，避免编码后的地址异常
        var targetUrl = decodeURIComponent(hash.replace("#", ""));
        document.getElementById("url").value = targetUrl;
    }
};

function submitURL() {
    // 这里添加提交逻辑，比如获取输入框的值进行后续处理
    var url = document.getElementById("url").value;
    // 示例：打印到控制台，实际可替换为你的业务逻辑
    console.log("提交的URL：", url);
}
</script>

<input name="url" type="text" id="url" placeholder="enter url here" value="enter url here" />
<button id="submit" onclick="submitURL()">Submit</button>

关键说明 #

• 自动填充：通过window.onload事件在页面加载完成后自动提取哈希值并填充到输入框，无需用户点击输入框触发
• URL解码：使用decodeURIComponent处理哈希值，避免目标URL因编码导致的格式错误
• 简化逻辑：直接操作window.location.hash，无需复杂正则匹配，更高效可靠

内容的提问来源于stack exchange，提问作者mobagenie