<!DOCTYPE html>
<html>

<head>
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <meta charset="utf-8" />
  <meta name="referrer" content="never" />
  <title>CORS 跨域请求,proxy</title>
</head>

<body>
  <ul>
    <li>支持跨域请求(转换不支持跨域请求的接口),可直接发起 ajax、fetch</li>
    <li>支持HTTPS(解决远程数据接口不支持HTTPS)</li>
    <li>
      <h2>
        <a href="https://cors.eu.org" target="_blank">https://cors.eu.org</a>
      </h2>
    </li>
    <li>
      <h2>
        <a href="https://bird.ioliu.cn" target="_blank">
          https://bird.ioliu.cn
        </a>
      </h2>
    </li>
  </ul>
  <p>
    <button onclick="fn()">点我调用</button>
  </p>
  <input
      id="txturl"
      placeholder="输入url地址"
      value="https://cn.bing.com/HPImageArchive.aspx?format=js&idx=0&n=1&mkt=zh-CN"
      style="width: 60%"
    />
</body>

</html>
function fn() {
    var tu = document.getElementById('txturl');
    var agenturi = tu.value == "" ? tu.defaultValue : tu.value;
    var url = 'https://cors.eu.org/' + agenturi;
    console.log(url);
    fetch(url).then(response => response.text()).then(data => {
        var txt = document.createElement('textarea');
        txt.style.cssText = "height:420px;width:100%;margin-top:1em";
        try {
            txt.value = JSON.stringify(JSON.parse(data), null, 2);
        } catch (err) {
            txt.value = data;
        }
        document.body.appendChild(txt);
    }).catch(err => {
        alert('error')
    })
};