美文网首页
跨域解决方案

跨域解决方案

作者: 叫我辣条大人 | 来源:发表于2019-09-26 17:08 被阅读0次

跨域的解决方式
1:JSONP: 只支持get请求
方式一:创建一个script标签,然后将回调函数作为参数,传给服务器

function callback (res) {}

var JSONP = document.createElement("script")

JSONP.type = "text/javascript"

JSONP.src = "url"

document.getElementsByTagName('head')[0].appentChild(JSONP)

方式二:直接使用script标签

function jsonpCallback(res){}

script type="text/javascript" src="http://crossdomain.com/services.php?callback=jsonpCallback

服务器返回数据:

jsonpCallback(data)

总结:

script请求的数据,是直接作为js代码进行运行的。

将回调函数的的名字传给服务器,服务器返回数据给前端时,将数据已如上形式返回,前端接收到后相当于直接调用了jsonpCallback这个函数

2:CORS协议
方法:前端一般什么也不做,只需要后台进行设置即可。后台在响应体中设置

如果需要跨域携带cookie,前端请求时需要设置withCredentials为true

Access-Control-Allow-Origin

Access-Control-Allow-Credentials

相关文章

  • Web前后端跨域问题处理

    跨域问题有前台跨域(iframe间)和后台跨域。 前台跨域的解决方案可以采用跨域文档通讯(Cross domain...

  • 跨域问题,解决方案

    跨域问题,解决方案 - Nginx反向代理跨域问题,解决方案 - CORS方案此为原作者的链接:跨域问题,解决之道

  • 前端如何解决常见跨域问题

    跨域解决方案 1、 通过jsonp跨域 2、 document.domain + iframe跨域 3、 loca...

  • 开发环境跨域和生产环境跨域

    开发环境跨域 前后端分离,IP地址不同,请求数据必然导致跨域问题;解决方案:proxy设置 生产环境跨域 解决方案...

  • 浏览器跨域及其解决方案

    title: 浏览器跨域及其解决方案author: Maydate: 20220428 什么是跨域跨域的表现解决跨...

  • 跨域解决方案

    跨域解决方案 跨域解决方案有:设置document.domain,使用带src标签,JSONP,navigatio...

  • 跨域

    参考资料 HTTP访问控制(CORS)跨域解决方案跨域详解

  • Angular访问WebApi出现options方法

    解决方案: 解决跨域:

  • 跨域解决方案(史上最易懂)

    跨域总结 1.跨域思路 跨域解决方案一般分为两种:前端解决,后端解决 1.1 前端解决方案 通过前端解决的思想就是...

  • ZUUL跨域问题

    云环境中每个服务自己有跨域解决方案,而网关需要做最外层的跨域解决方案.如果服务已有跨域配置网关也有,会出现*多次配...

网友评论

      本文标题:跨域解决方案

      本文链接:https://www.haomeiwen.com/subject/tkdnuctx.html