JSONP跨域提交请求

概述

因为浏览器的同源安全策略,同域名,同端口,同协议,导致我跨域请求的链接被终止,所以直接用XMLHttpRequest请求不同域上的数据是不可以的,但在页面引入不同域上的js脚本文件确是可行的,json就是利用这个特性来实现的,以下是我通过jsonp实现了跨域请求。

cookie值

function getCookie(name) {
        var prefix = name + "="
        var start = document.cookie.indexOf(prefix)
 
        if (start == -1) {
            return null;
        }
 
        var end = document.cookie.indexOf(";", start + prefix.length)
        if (end == -1) {
            end = document.cookie.length;
        }
        var value = document.cookie.substring(start + prefix.length, end)
        return unescape(value);
    }

JSONP

动态创建<script>标签,利用<script>的src不受同源策略的约束来跨域获取数据,原理上和<sript src="http://../xx.js"><sript>是一致的

function myfun(){
        var username = getCookie("background_user")
        var loginUrl="https://javahwc/dsssoserver/ajaxLogin?targetService=https://hwc.cn/CasController/doLogin&callback=loginFormState&userName="+username+"&password=898989"
          //去获取票据          
        addScriptTag(loginUrl);
        console.log('myfun函数执行了');
        
    }
    //跨域提交ajax
    function addScriptTag(src) {
        var script = document.createElement('script');
        script.setAttribute("type","text/javascript");
        script.src = src;
        document.body.appendChild(script);

 缺点

它是存在一定的隐患的,因为它本身是一种脚本注入的行为,并且只支持GET请求而不支持其他类型的HTTP请求,调用失败并不会放各种HTTP状态码。

其他跨域方式

  1. 跨域资源共享 CORS
  2. 修改document.domain
  3. 使用window.name

 

posted @ 2020-12-25 11:11  一剑天门  阅读(159)  评论(0编辑  收藏  举报