在 Javascript 中获取 TinyUrl答案

【问题标题】：Getting TinyUrl in Javascript在 Javascript 中获取 TinyUrl
【发布时间】：2013-06-30 21:31:48
【问题描述】：

function ShortUrl(bigurl)
{
$.getJSON(
  "http://tinyurl.com/api-create.php",
   url: 'http://dfsghdsvfbjvjd.com',
  function(data){
   alert(data);
  });
}

不工作

$['getJSON']('http://tinyurl.com/api-create.php?url=http://xxxxxxx.com/', function (a) {
                         h = a;
alert (h);

                     });

此调用也不起作用。尝试了各种调用，但没有得到 tinyurl。

【问题讨论】：

TinyURL 不支持 JSONP
url: 'http://dfsghdsvfbjvjd.com' 是语法错误。
我是由于跨站点脚本策略。看到这个：[stackoverflow.com/questions/1414145/…[1]：stackoverflow.com/questions/1414145/…

标签： javascript

【解决方案1】：

您使用的 API 不是以 JSON 形式返回缩短的 URL，而是以纯文本形式返回。并且没有办法通过 AJAX 调用从另一个域（这里是 tinyurl）中提取纯文本数据。见same origin policy。

如果您只想在客户端缩短 URL，bit.ly 有一个支持 JSONP 的 API。

$.getJSON('http://api.bitly.com/v3/shorten?callback=?',
    {
        format: "json",
        apiKey: YOUR_API_KEY,
        login: YOUR_LOGIN,
        longUrl: "http://link.to.be/shortened"
    },
    function(response) {
        console.log(response.data.url);
    }
);

【讨论】：

【解决方案2】：

您不需要 $.getJSON 与此 api 链接，如：http://tinyurl.com/api-create.php?url=google.com。因为它将短网址作为纯文本返回。

所以，我认为这就足够了：

$.get("http://tinyurl.com/api-create.php?url=google.com", function(shorturl){
    alert(shorturl)
});

见：http://api.jquery.com/jQuery.get/

【讨论】：

如果用户的浏览器和目标域上都没有CORS 实现，这将中断。
我已经使用了十亿次，没有遇到任何麻烦。它只是通过 GET 请求纯文本并获取纯文本结果。就是这样。。
这很奇怪。我听说的同源策略的唯一例外是 Firefox 中的网络字体。您可能已经调整了浏览器的安全性，或者我绝对没有得到某些东西。仅供参考，我刚刚在 chrome 控制台上尝试过（在 SO 的上下文中），它坏了。
确实，当我尝试此操作时，我收到浏览器错误“请求的资源上不存在'Access-Control-Allow-Origin'标头。”与其在没有解释的情况下投反对票，不如给你自己的解释。

【解决方案3】：

直接在浏览器中调用 TinyUrl API 会导致 CORS 问题，解决方法之一是使用 cors-anywhere 服务。我通常使用tinyurl-client npm 包来缩短浏览器上的url，这里是如何使用它

在终端中安装它

npm install @kulkul/tinyurl-client

在您的 javascript 上使用它

import shortenUrl from "@kulkul/tinyurl-client";

shortenUrl("https://kulkul.tech").then((result) => {
    console.log({ result }); // https://tinyurl.com/<slug>
});

附：我是npm包的创建者，如果你有什么问题，可以在这里发帖https://github.com/kulkultech/tinyurl-client

【讨论】：

您对 CORS 问题的看法是正确的，不幸的是，cors-anywhere 已关闭。