请检查为什么这个脚本不起作用？答案

【问题标题】：Please check why this script not Working?请检查为什么这个脚本不起作用？
【发布时间】：2021-09-26 20:21:01
【问题描述】：

您好，我想使用 bitly api 和 jquery 创建一个简单的 url 短脚本，但该脚本无法正常工作，我可以找出原因吗？请更正下面提到的脚本。谢谢。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.js"></script>
<script>
$(document).ready(function(){
    var inputurl;
    var accessToken = "apikeyhere";

    $("#convertBtn").on('click',function(){
    inputurl = $("#inputurl").val();
    $("#longURL").html(inputurl);
    $("#shortURL").html("");

    var params = {
    "long_url" : inputurl
    };

    $.ajax({
    url: "https://api.ssl.bitly.com/v4/shorten",
    cache: false,
    dataType: "json",
    method: "POST",
    contentType: "application/json",
    beforeSend: function (xhr){
    xhr.setRequestHeader("Authorization", "Bearer" + accessToken),
    };
    data: JSON.stringify(params)
    }).done(function(data){
    $("#shortURL").html(data.link);
    console.log(data.link);

    }).fail(function(data){
    $("#shortURL").html(data.link);
    console.log(data.link);
    });
});
</script>

<input type="text" id="inputurl">
<button type="button" id="convertBtn">Convert</button>

<p> Long Url: <span id="longURL"></span></p>
<p> Short <span id="shortURL"></span></p>

【问题讨论】：

“不工作”是什么意思？您尝试过什么来解决问题？
这可能是您在浏览器中遇到的错误导致它无法工作 - 即最后缺少的});，应该是, 的; 和@987654325 @ 应该是 ; - 这只是浏览器开发人员工具在加载页面时会告诉你的语法错误 - 至于任何其他错误，你必须先运行代码，然后从那里开始
“请检查为什么这个脚本不起作用？” 不能是问题标题：（更具体。

标签： javascript jquery api

【解决方案1】：

<script>
    $(document).ready(function(){
        var inputurl;
        var accessToken = "apikeyhere";
    
        $("#convertBtn").on('click',function(){
        inputurl = $("#inputurl").val();
        $("#longURL").html(inputurl);
        $("#shortURL").html("");
    
        var params = {
        "long_url" : inputurl
        };
    
        $.ajax({
        url: "https://api.ssl.bitly.com/v4/shorten",
        cache: false,
        dataType: "json",
        method: "POST",
        contentType: "application/json",
        beforeSend: function (xhr){
        xhr.setRequestHeader("Authorization", "Bearer" + accessToken)},
        data: JSON.stringify(params)
        }).done(function(data){
        $("#shortURL").html(data.link);
        console.log(data.link);
    
        }).fail(function(data){
        $("#shortURL").html(data.link);
        console.log(data.link);
        });
    });
    });
    </script>

【讨论】：

您是否注意到一个警告，指出不希望只发布代码答案？请详细描述您所做的更改及其背后的原因。
请在您的答案中添加一些解释，以便其他人可以从中学习
@vishal-ve 它显示 net::ERR_CERT_COMMON_NAME_INVALID

【解决方案2】：

问题是你错过了“})” 我在代码上用**标记了它


$(document).ready(function(){
    var inputurl;
    var accessToken = "apikeyhere";

    $("#convertBtn").on('click',function(){
        inputurl = $("#inputurl").val();
        $("#longURL").html(inputurl);
        $("#shortURL").html("");

        var params = {
        "long_url" : inputurl
        };

        $.ajax({
            url: "https://api.ssl.bitly.com/v4/shorten",
            cache: false,
            dataType: "json",
            method: "POST",
            contentType: "application/json",
            data: JSON.stringify(params),
            beforeSend: function (xhr){
            xhr.setRequestHeader("Authorization", "Bearer" + accessToken)
            },
            success:function(data){
                $("#shortURL").html(data.link);
                console.log(data.link);
            },
            error:function(data){
                $("#shortURL").html(data.link);
                console.log(data.link);
            }
        });
    **});**
});

【讨论】：

什么是“这个”？请在您的答案中添加一些解释，以便其他人可以从中学习
与问题标题不能是相同的“请检查为什么这个脚本不起作用？” - 答案的第一段不能简单地说明“试试这个。” 。请 - 提供有关您所做更改的更多信息。