zoukankan      html  css  js  c++  java
  • 如何解决跨域无法正常请求问题

    参考:http://blog.csdn.net/joyhen/article/details/21631833 

    方法1: 该方法不同于ajax,因为script标签不受同源策略的限制。

    前端和后台需要约定一个接收参数, 然后返回一段js代码。

    后端php代码:

    <?php
    
    $callback = $_GET['callback'];
    
    $json = '{"ret":1,"start":-1,"end":-1,"country":"u4e2du56fd","province":"u6c5fu82cf","city":"u82cfu5dde","district":"","isp":"","type":"","desc":""}';
    
    header('content-type: text/javascript');
    
    echo $callback . '(' , $json, ');';

    // url: https://animals-facial.c9users.io/json.php?_callback=_callback123
    //输出:_callback123({"ret":1,"start":-1,"end":-1,"country":"u4e2du56fd","province":"u6c5fu82cf","city":"u82cfu5dde","district":"","isp":"","type":"","desc":""});
    //输出了一段js代码

    后台输出一段js代码,其中包含了一个 _callback123 的方法,参数是一个object。 

    前端代码: 

    <script>
    
       //动态创建一个script
        function loadScript(url, data, fun) {
            var head = document.head || document.getElementsByName("head")[0],
                scriptElement = document.createElement("script"),
    //把传入的值设置成随机的。 funName
    = '_callback' + Math.round(Math.random() * 1000); //使用约定的callback为参数, fullName是传入callback参数的值 url = url + '?callback=' + funName; //把参数接到URL后面 for (var i in data) { url += '&' + i + '=' + data[i]; } scriptElement.src = url; //取到js方法后,执行该js方法。 这里要用全局的方法,所以用window[] window[funName] = function (json) { fun(json); //执行完成后删除该script和该方法 head.removeChild(scriptElement); window[funName] = null; }; scriptElement.onload = function () { scriptElement.onload = scriptElement.onreadystatechange = null; } head.appendChild(scriptElement) } //传入url, 数据, 回调函数 loadScript("https://animals-facial.c9users.io/json.php", { name: 'china' }, function (json) {
        //todo something console.log(json); 输出得到的json });
    </script>
  • 相关阅读:
    普通函数跟箭头函数中this的指向问题
    vue之router学习笔记
    vue之登录和token处理
    vue之router钩子函数
    eslint----standard 代码规范
    vscode----配置vue开发环境
    vue----安装教程
    vue----全局组件,局部组件
    vue----常用实例方法--$mount(),$destroy(),$watch(),$forceUpdate()
    vue----生命周期
  • 原文地址:https://www.cnblogs.com/facial/p/5851473.html
Copyright © 2011-2022 走看看