跨域解决方案之JSONP原理及基本解决

oscar999

已于 2022-05-16 06:44:53 修改

阅读量743

点赞数 1

分类专栏： Web开发安全文章标签： JSONP

于 2022-03-08 22:08:10 首次发布

本文链接：https://blog.csdn.net/oscar999/article/details/123364585

版权

Web开发安全专栏收录该内容

78 篇文章 31 订阅 ¥29.90 ¥99.00

订阅专栏

超级会员免费看

JSONP，　JSON with Padding，是前端解决跨域的方案，　利用<script> 的src没有跨域限制的例外来实现跨域访问。

跨域禁止的模拟示例

安装两个tomcat，端口分别是8080和9090
在两个tomcat 的webapps下分别创建一个应用目录"jsonp"，在8080端口的页面访问9090端口的页面，因为端口不同，属于跨域状况。
步骤：

在8080端口创建jsonp目录，在该目录创建index.html，内容如下：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8">
  <title>JSONP</title>
  <script  type="text/javascript">
    function handleClick(){

       var url = "http://localhost:9090/jsonp/index.jsp";
       var xhr = new XMLHttpRequest();
       xhr.onreadystatechange = function() {
            if (xhr.readyState == 4 && xhr.status == 200)