{"action":"created","issue":{"url":"https://api.github.com/repos/Wscats/Good-text-Share/issues/55","repository_url":"https://api.github.com/repos/Wscats/Good-text-Share","labels_url":"https://api.github.com/repos/Wscats/Good-text-Share/issues/55/labels{/name}","comments_url":"https://api.github.com/repos/Wscats/Good-text-Share/issues/55/comments","events_url":"https://api.github.com/repos/Wscats/Good-text-Share/issues/55/events","html_url":"https://github.com/Wscats/Good-text-Share/issues/55","id":177789340,"number":55,"title":"Javascript的jsonp原理","user":{"login":"Wscats","id":17243165,"avatar_url":"https://avatars.githubusercontent.com/u/17243165?v=3","gravatar_id":"","url":"https://api.github.com/users/Wscats","html_url":"https://github.com/Wscats","followers_url":"https://api.github.com/users/Wscats/followers","following_url":"https://api.github.com/users/Wscats/following{/other_user}","gists_url":"https://api.github.com/users/Wscats/gists{/gist_id}","starred_url":"https://api.github.com/users/Wscats/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/Wscats/subscriptions","organizations_url":"https://api.github.com/users/Wscats/orgs","repos_url":"https://api.github.com/users/Wscats/repos","events_url":"https://api.github.com/users/Wscats/events{/privacy}","received_events_url":"https://api.github.com/users/Wscats/received_events","type":"User","site_admin":false},"labels":[{"url":"https://api.github.com/repos/Wscats/Good-text-Share/labels/notes","name":"notes","color":"d4c5f9"}],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":2,"created_at":"2016-09-19T13:48:36Z","updated_at":"2016-10-26T08:20:37Z","closed_at":null,"body":"首先JSON是一种基于文本的数据交换方式，或者叫做数据描述格式\r\n当一个网页在请求JavaScript文件时则不受是否跨域的影响，凡是拥有”src”这个属性的标签都拥有跨域的能力，比如`<script>、<img>、<iframe>`\r\n所以我们这里运用了script标签的跨域能力，让它用一个callback函数包裹着一段JSON格式的数据，当该数据返回到前端页面的时候，我们再执行这个函数就可以把数据读取出来\r\n**前端代码**\r\n_jsonp.html_\r\n```\r\n<!DOCTYPE html>\r\n<html>\r\n\t<head>\r\n\t\t<meta charset=\"UTF-8\">\r\n\t\t<title>Wsscat's jsonp</title>\r\n\t</head>\r\n\t<body>\r\n\t\t<button onclick=\"jsonpServer('jsonp.php')\">JSONP</button>\r\n\t</body>\r\n\t<script>\r\n\t\tfunction jsonpServer(url) {\r\n\t\t\tvar script = document.createElement(\"script\");\r\n\t\t\tscript.setAttribute(\"type\", \"text/javascript\");\r\n\t\t\tscript.setAttribute(\"src\", url);\r\n\t\t\tdocument.body.appendChild(script);\r\n\t\t}\t\r\n\t\tfunction JSON_CALLBACK(data) {\r\n\t\t\tconsole.log(data);\r\n\t\t}\r\n\t</script>\r\n</html>\r\n```\r\n**后端代码**\r\n_jsonp.php_\r\n```\r\n<?php\r\n$data = '[{\"id\":\"1\",\"name\":\"wsscat\"},{\"id\":\"2\",\"name\":\"asw\"}]';\r\n$data = \"JSON_CALLBACK(\" . $data . \")\";\r\necho $data;\r\n?>\r\n```"},"comment":{"url":"https://api.github.com/repos/Wscats/Good-text-Share/issues/comments/256280663","html_url":"https://github.com/Wscats/Good-text-Share/issues/55#issuecomment-256280663","issue_url":"https://api.github.com/repos/Wscats/Good-text-Share/issues/55","id":256280663,"user":{"login":"Wscats","id":17243165,"avatar_url":"https://avatars.githubusercontent.com/u/17243165?v=3","gravatar_id":"","url":"https://api.github.com/users/Wscats","html_url":"https://github.com/Wscats","followers_url":"https://api.github.com/users/Wscats/followers","following_url":"https://api.github.com/users/Wscats/following{/other_user}","gists_url":"https://api.github.com/users/Wscats/gists{/gist_id}","starred_url":"https://api.github.com/users/Wscats/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/Wscats/subscriptions","organizations_url":"https://api.github.com/users/Wscats/orgs","repos_url":"https://api.github.com/users/Wscats/repos","events_url":"https://api.github.com/users/Wscats/events{/privacy}","received_events_url":"https://api.github.com/users/Wscats/received_events","type":"User","site_admin":false},"created_at":"2016-10-26T08:20:37Z","updated_at":"2016-10-26T08:20:37Z","body":"## jquery的jsonp方法\r\n```\r\n\r\n- type：请求方式 GET/POST\r\n- url:请求地址\r\n- async:布尔类型，默认为true 表示请求是否为异步，如果为false表示为同步。\r\n- dataType：返回的数据类型\r\n- jsonp：传递给请求处理程序或页面的，用以获得jsonp回调函数名的参数名(一般默认为:callback)\r\n- jsonpCallback：自定义的jsonp回调函数名称，默认为jQuery自动生成的随机函数名，也可以写\"?\"，jQuery会自动为你处理数据\r\n- success：调用成功执行的函数\r\n- error：异常处理函数\r\n\r\n$.ajax({\r\n\t\t\turl:'index.php',\r\n\t\t\ttype:'get',\r\n\t\t\tdataType:'jsonp',\r\n\t\t\t//jsonp:'JSON_CALLBACK',\r\n\t\t\tjsonpCallback:'JSON_CALLBACK',\r\n\t\t\tsuccess:function(data){\r\n\t\t\t\tconsole.log(data)\r\n\t\t\t}\r\n\t\t})\r\n```"}}
{"actor":{"display_login":"Wscats"}}