<!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> </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>
body { color: deeppink; }
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') }) };