HTTPS 连接是否禁用了 jQuery？答案

【问题标题】：Does HTTPS connection disabled jQuery?HTTPS 连接是否禁用了 jQuery？
【发布时间】：2011-05-05 16:43:41
【问题描述】：

我有以下 php 脚本，在正常情况下可以完美运行（即直接访问页面）：

HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="style.css" />
<link rel="stylesheet" type="text/css" href="css/contact_search.css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.watermarkinput.js"></script>
<script type="text/javascript">
$(document).ready(function() {

$(document).click(function() {
    $("#display").hide();
});

var cache = {};

    $("#searchbox").keyup(function() {
        var searchbox = $(this).val();
        var dataString = 'searchword=' + searchbox;

        if (searchbox.length < 3 ) {
            $("#display").hide();
            } else {

            $.ajax({
                type: "POST",
                url: "contact_search/search.php",
                data: dataString,
                cache: false,
                success: function(html) {

                    $("#display").html(html).show();
                }
            });
        return false;
    });
});

jQuery(function($) {
    $("#searchbox").Watermark("Search for Group");
});
</script>
</head>

<body bgcolor="#e0e0e0">
<div class="body">


          <div class="liquid-round" style="width:100%;">
            <div class="top"><span><h2>Contacts List</h2></span></div>

            <div class="center-content"> 
                <img src="images/search.gif" style="float:right;" />
                <input type="text" id="searchbox" maxlength="20" value="<?php echo $_SESSION['hello'];?>" />
                <div id="display"></div><div style="clear:both;"></div>

            </div>

            <div class="bottom"><span></span></div>
        </div>


        <div class="liquid-round" style="width:97%;">
            <div class="top"><span><h2>My Messages</h2></span></div>

            <div class="center-content" style="min-height:200px;">                        
            </div>

            <div class="bottom"><span></span></div>
        </div>    


</div>
</body>
</html>

但是 - 当我将以下部分添加到页面顶部时，javascript/jquery 函数完全停止工作。

<?php
    session_start();

    if( $_SERVER['SERVER_PORT'] == 80) {
        header('Location:https://'.$_SERVER['HTTP_HOST'].$_SERVER["REQUEST_URI"]); 
        die();
    }
?>

这些页面需要登录，所以我需要确保它们受到 https 保护，但这个错误会搞砸这一切。有什么想法可能导致该问题吗？

【问题讨论】：

是否有任何 javascript 错误？此外，您应该拥有 jQuery 的本地副本或将 http 更改为 https，这样您就不会收到任何关于它位于非安全站点上的安全错误。

标签： php javascript jquery https

【解决方案1】：

这可能是浏览器没有在 https 页面上显示不安全 (http) 内容，不过有一个简单的修复方法，使用方案相对 URL，如下所示：

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>

这样您将在您的页面的http:// 版本上获得http://ajax.googleapis.com/....，在https:// 版本上获得https://ajax.googleapis.com/....。

【讨论】：

哇，我怎么不知道呢？所有浏览器都支持吗？
@Nick - 是否可以在一个页面上用 4 个框架（在一个框架集中）“共享”上面的 jquery src 链接，而不是必须在每个页面上调用它（我意识到实际需要调用函数，但尽量减少对同一 google cdn 的调用）
@JM4 - 不...但是浏览器应该获取一次，对其他 4 帧使用缓存版本（在第一次加载时），然后对所有帧使用缓存版本进行任何加载之后。
哇哇哇.....方案相对URL！？！？这已经存在多年了？这需要更多地宣传！

【解决方案2】：

由于 session_start 产生 HTTP-Headers 我建议在 session_start 之前进行端口检查。

但是，这些行在任何情况下都不会影响您的 JS，因为重定向到 HTTPS 与您的网站是否通过 HTTPS 工作这一事实无关。因此，如果您不确定，请删除这些行并使用 HTTPS 访问您的页面。带 JS 去那里工作。然后实现重定向。

【讨论】：