营销型企业网站特点,wordpress 官方网站,做一个网站需要多少时间,全面启动门户网站建设简单地使用json并不能支持跨域资源请求#xff0c;为了解决这个问题#xff0c;需要采用jsonp数据交互协议。众所周知#xff0c;js文件的调用不受跨域与否的限制#xff0c;因此如果想通过纯web端跨域访问数据#xff0c;只能在远程服务器上设法将json数据封装进js格式的…简单地使用json并不能支持跨域资源请求为了解决这个问题需要采用jsonp数据交互协议。众所周知js文件的调用不受跨域与否的限制因此如果想通过纯web端跨域访问数据只能在远程服务器上设法将json数据封装进js格式的文件中供客户端调用和进一步处理这就是jsonp协议的原理。JSON 和 JSONPJSONP是一种发送JSON数据的方法无需担心跨域问题。JSONP不使用该XMLHttpRequest对象。JSONP使用由于跨域策略从另一个域请求文件可能会导致问题。从另一个域请求外部脚本没有此问题。JSONP使用此优势并使用脚本标记而不是XMLHttpRequest对象请求文件。服务器文件服务器上的文件将结果包装在函数调用中?php$myJSON {name:John, age:30, city:New York};echo myFunc(.$myJSON.);;?结果返回对名为“myFunc”的函数的调用并将JSON数据作为参数。确保客户端上存在该功能。JavaScript函数名为“myFunc”的函数位于客户端并准备处理JSON数据function myFunc(myObj) {document.getElementById(demo).innerHTML myObj.name;}xmlhttp.send(x dbParam);创建动态script标记根据您放置脚本标记的位置上面的示例将在页面加载时执行“myFunc”函数这不是很令人满意。只应在需要时创建script标记单击按钮时创建并插入var s document.createElement(script);s.src demo_jsonp.php;document.body.appendChild(s);}动态JSONP结果上面的例子仍然是非常静态的。通过将JSON发送到php文件使示例动态化并让php文件根据获取的信息返回JSON对象。PHP文件?phpheader(Content-Type: application/json; charsetUTF-8);$obj json_decode($_GET[x], false);$conn new mysqli(myServer, myUser, myPassword, Northwind);$result $conn-query(SELECT name FROM .$obj-$table. LIMIT .$obj-$limit);$outp array();$outp $result-fetch_all(MYSQLI_ASSOC);echo myFunc(.json_encode($outp).);?PHP文件解释使用PHP函数json_decode()将请求转换为对象 。访问数据库并使用请求的数据填充数组。将数组添加到对象。使用json_encode()函数将数组转换为JSON 。在返回对象周围包裹“myFunc()”JavaScript示例:function clickButton() {var obj, sobj { table: products, limit: 10 };s document.createElement(script);s.src jsonp_demo_db.php?x JSON.stringify(obj);document.body.appendChild(s);}function myFunc(myObj) { var x, txt ; for (x in myObj) {txt myObj[x].name ;}document.getElementById(demo).innerHTML txt;}回调函数当您无法控制服务器文件时如何让服务器文件调用正确的函数有时服务器文件提供回调函数作为参数php文件将调用您传递的函数作为回调参数PHP文件?php$callback trim($_GET(callback));$myJSON { name:John, age:30, city:New York };echo $callback.(.$myJSON.);;?javascript :function clickButton() {var s document.createElement(script);s.src jsonp_demo_db.php?callbackmyDisplayFunction;document.body.appendChild(s);}以上就是JavaScript中的JSON和JSONP的详细内容更多请关注html中文网其它相关文章