mui ajax 跨域问题如何解决!!!!

mui ajax 跨域问题如何解决!!!!



2015-01-19 16:32 5 条评论 分享
已邀请:

最佳回复

1

mui.ajax在app里运行时自动跨域,因为此时调用的实际是plus.net的api。
而普通浏览器里运行时,如果不同域,则需要服务器配jsonp来完成跨域。

注意在边改边看里运行的是普通浏览器模式。
如果把5+app改造成微信公众号,或者配同域,或者jsonp。一般放在一个服务器下就不存在跨越问题了。


2

app中使用的是plus.net.XMLHttpRequest,支持跨域的
在没有plus的环境下~用jsonp传输吧


1

avst

赞同来自: Gao_Pan

我在header中加上
<meta http-equiv="Access-Control-Allow-Origin" content="*">
<meta http-equiv="content-security-policy">
之后还是报错:"XMLHttpRequest cannot load http://avst.tv/webAPP/web/index.php. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://127.0.0.1:8020' is therefore not allowed access."
请问还需要怎么改,或者后台有什么设置吗


1

thinkphp_

赞同来自: shwanYu

mui.init({
pullRefresh: { //下拉
container: "#pullrefresh",
down: {
contentdown: "下拉加载",
contentover: "释放刷新",
contentrefresh: "正在加载..",
callback: pulldownRefresh
},
up: {
contentrefresh: '加载中',
contentnomore: '没有更多数据了',
callback: pullupRefresh
}
}
});

        function pulldownRefresh() {
//以下处理跨域
PageNo = 1;
type = 2;
request = new XMLHttpRequest();
request.open(&quot;POST&quot;, &quot;http://xxx.com&quot;);
var data = 'PageSize=' + PageSize + '&amp;PageNo=' + PageNo;
request.setRequestHeader(&quot;Content-type&quot;, &quot;application/x-www-form-urlencoded&quot;);
request.onreadystatechange = chuli;
request.send(data);
PageNo = 2;
}

function pullupRefresh() {
type = 1;
request = new XMLHttpRequest();
request.open(&quot;POST&quot;, &quot;http://xxx.com&quot;);
var data = 'PageSize=' + PageSize + '&amp;PageNo=' + PageNo;
request.setRequestHeader(&quot;Content-type&quot;, &quot;application/x-www-form-urlencoded&quot;);
request.onreadystatechange = chuli;
request.send(data);
PageNo += 1;
}

function chuli() {
if (request.readyState === 4) {
if (request.status === 200) {
var data = JSON.parse(request.responseText);
if (data.code == 200) {
var msg = data.data;
var count = data.mes;
var table = document.body.querySelector('.mui-table-view');
if (type == 2) {
table.innerHTML = '';
}
var cells = document.body.querySelectorAll('.mui-table-view-cell');
for (var i = 0; i &lt; msg.length; i++) {
msg[i].smeta = JSON.parse(msg[i].smeta);
var li = document.createElement('li');
li.className = 'mui-table-view-cell';
li.innerHTML = '&lt;a href=&quot;detail.html?id=' + msg[i].id + '&quot; class=&quot;mui-navigate-right&quot; id=&quot;first&quot;&gt;&lt;img class=&quot;mui-media-object mui-pull-left&quot; src=&quot;' + msg[i].smeta.thumb + '&quot; /&gt;' +
'&lt;p&gt;' + msg[i].post_title + '&lt;/p&gt;&lt;p&gt;' + msg[i].post_excerpt + '&lt;/p&gt;&lt;/a&gt; ';
if (type == 1) { //上拉
table.appendChild(li);
} else {
table.insertBefore(li, table.firstChild);
}
}
if (type == 1) { //上拉
if (PageNo &gt;= count) {
mui('#pullrefresh').pullRefresh().endPullupToRefresh(true);
}
} else {
mui('#pullrefresh').pullRefresh().endPulldownToRefresh();
//mui('#pullrefresh').pullRefresh().refresh(true);
}
} else {
mui.toast(data.mes);
}
} else {
mui.toast('不是代码问题');
}
}
}
//刚进来下拉

function pageInit() {
if (mui.os.plus) {
mui.plusReady(function() {
setTimeout(function() {
mui('#pullrefresh').pullRefresh().pulldownLoading();
}, 500);
});
} else {
mui.ready(function() {
mui('#pullrefresh').pullRefresh().pulldownLoading();
});
}
}

function openMenu() {
!index &amp;&amp; (index = mui.currentWebview.parent());
mui.fire(index, &quot;menu:open&quot;);
}

var index = null; //主页面
var PageNo = 1;
var PageSize = 8;
var request = &quot;&quot;;
var type = 2; //1上拉 2下拉
pageInit();
\n

以上是我处理跨域的方法 服务器端php还要设置 header('Access-Control-Allow-Origin:*');
如果是用jsonp的话数据量不能太大,希望能帮到你们


0

张剑

赞同来自:

你这个跨域的问题解决了么?我今天也遇到了


0

alongSelf

赞同来自:

楼主 解决了 跟俺们说一下 感激不尽


0

alongSelf

赞同来自:

我的问题已经解决

后台代码如下:
public static void reSponseJson(String string,HttpServletResponse response) {
response.setContentType("text/json; charset=utf-8");
response.setHeader("Access-Control-Allow-Origin", "");
response.setHeader("Access-Control-Allow-Headers", "X-Requested-With");
response.setHeader("Cache-Control", "no-cache");
PrintWriter out = null;
try {
out = response.getWriter();
out.print(string);
out.flush();
} catch (IOException e) {
e.printStackTrace();
} finally {
out.close();
}
}
ajax 代码如下:
var url = "http://192.168.1.100/lpAppService/JobMngController.do?action=jobListForPage";
mui.ajax(url, {
data: {
rows: rows,
page: page
},
//dataType: 'json', //服务器返回json格式数据
type: 'post', //HTTP请求类型
timeout: 1000, //超时时间设置为10秒;
success: function(data) {
console.info(data);
},
error: function(xhr, type, errorThrown) {
//异常处理;
console.log(type);
}
});
问题出在:一定要在head里面加上
<meta http-equiv="Access-Control-Allow-Origin" content="
">
<meta http-equiv="content-security-policy">

head里面的内容如下:
<head>
<meta charset="utf-8">
<title>Hello MUI</title>
<meta http-equiv="Access-Control-Allow-Origin" content="*">
<meta http-equiv="content-security-policy">
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
</head>


0

aaaa

赞同来自:

支持跨域的


0

好冷 - 诚接外包,QQ:23380891

赞同来自:

我今天也遇到类似的问题:
环境如下:HBuilder 6.4.1.201509021952 WIN8 X32
项目目录:E:\DCLOUD\MUIDEMO
本机IP:192.168.1.108
服务器IP,10.61.0.21 PHP MYSQL
响应文件:http://10.61.0.21/msg_mzkx/get_msgid.php
调试的时候chrome控制台报错,然后给chromd增加一个启动参数 --disable-web-security就行了


0

chender - 与人为善

赞同来自:

chrome报错?如果你的网页不是在5+的环境下运行的,肯定会有跨域问题;
注意用hbuilder做开发和使用5+完全是两个问题;
在5+的环境下使用mui.ajax肯定是没有跨域的问题的


0

kain

赞同来自:

问题主要还是后台的表头设置,我用的是Nodejs
解决方法是先安装CORS
npm install cors
在到app.js下配置
var cors = require('cors');
app.use(cors());
这样在浏览器下就没有跨域问题了


0

northlander@126.com

赞同来自:

刚好也在浏览器模式下调试中碰到了mui.ajax跨域的问题,打包成app就可以了。


0

shixy9989@sohu.com

赞同来自:

我用的c#的webservice,在用mui.ajax()访问数据时,报错: internel server error。C# 的webservice返回json数据有什么特殊要求吗
[WebMethod]
public void UserLogin(string userno, string password,int deptid)
{
HttpContext.Current.Response.ContentType = "application/json;charset=utf-8";
string jsonCallBackFunName = HttpContext.Current.Request.Params["jsoncallback"].ToString();
string useresult = "";
try
{
var userrs = from u in userinfo.TuserinfoTB
where u.Tstatus == "1" && u.Tuserno == userno && u.Tpassword == password && u.Tdeptid==deptid
select u;
useresult = JsonConvert.SerializeObject(userrs);
}
catch (Exception ex)
{
new Exception(ex.Message.ToString());
}
HttpContext.Current.Response.Write(string.Format("{0}({1})", jsonCallBackFunName, useresult));
HttpContext.Current.Response.End();
}


0

jt_ge@hotmail.com

赞同来自:

我也遇到 这个问题,求帮助!!!后台 是用C#写的WEBSERVICES
<head>
<meta charset="utf-8">
<title>Hello MUI</title>
<meta http-equiv="Access-Control-Allow-Origin" content="">
<meta http-equiv="content-security-policy">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<link href="css/mui.min.css" rel="stylesheet" />
<meta http-equiv="Access-Control-Allow-Origin" content="
">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<script type="text/javascript" src="js/mui.min.js" ></script>
</head>

这个函数要写在那里?
public static void reSponseJson(String string,HttpServletResponse response)


0

智学无忧

赞同来自:

找到源码 mui.js,大概在2968行,把 setHeader('X-Requested-With', 'XMLHttpRequest'); 这段代码注释掉。
本人亲测可以。


0

chender - 与人为善

赞同来自:

直接用mui.ajax啊,完美支持跨域


0

RickSun

赞同来自:

有没有个官方的人站出来说一下!!

有些人用mui.ajax 可以跨域
有些人就报错! 无法使用

能不能有个敢说话的出来!?


要回复问题请先登录注册

退出全屏模式 全屏模式 回复