xmpp js端跨域请求

JavaScript044

xmpp js端跨域请求,第1张

在构建xmpp web客户端的时候， 如果网站和xmpp服务器的域名不一致，就需要用到跨域请求了。

可以使用 flXHR.js 这个库来实现跨域请求，因为使用了 strophe，所以需要加载以下两个js。之后会在 strophe 中会使用 flxhr 来发起请求。

使用 flxhr 请求， 需要服务器在根目录返回 domaincross.xml 文件, 具体格式点这 ---> 文档链接

ejabberd 的 mod_http_fileserver 组件是专门用来配置文件服务器的组件

在加入 mod_http_fileserver 后, web_admin(web admin管理)功能失效了, google 后发现为 ejabberd 的 bug.

想到的解决的办法，是另外一个端口启动 web_admin。

1.编辑 ejabberd 配置文件， 将 {5280, ejabberd_http, 开头的这段配置替换成

2.将 {mod_http_fileserver, 开头的一段替换为以下，

记得把路径替换成你的。

3.在 /Applications/ejabberd-14.05/www 路径下加入 domaincross.xml

最近在使用vue-cli搭建项目的过程中，遇到了跨域请求数据的问题，这里贴出我的解决方法，希望对大家有所帮助。

什么是跨域请求：

如果在A网站中，我们希望使用Ajax来获得B网站中的特定内容，如果A网站与B网站不在同一个域中，那么就出现了跨域访问问题。由于浏览器同源策略，凡是发送请求url的协议、域名、端口三者之间任意一与当前页面地址不同即为跨域。

这里，数据请求用的是vue-resource(目前vue官方是推荐使用axios)，安装插件：

npm install--save-devvue-resource

1

在main.js中引入插件：

importVueResourcefrom'vue-resource'

Vue.use(VueResource)

这里，解决跨域使用的是http-proxy-middleware来进行接口代理，安装方法同上：

npm install--save-devhttp-proxy-middleware

下面开始谈正事，举个栗子：

本地项目地址是：localhost:8080，现在我们要访问  http://m.maizuo.com/v4/api/film/comming-soon  和  http://m.maizuo.com/v4/api/billboard/home  这两个线上地址：

首先，设置build/dev-server.js：

varproxyMiddleware =require('http-proxy-middleware')

varserver = express()

server.middleware = [        proxyMiddleware(['/film/coming-soon'], {target:'http://m.maizuo.com/v4/api', changeOrigin:true}),        proxyMiddleware(['/billboard/home'], {target:'http://m.maizuo.com/v4/api', changeOrigin:true})]

server.use(server.middleware)

注意，当要访问多个线上地址时，公共的地址部分写在target属性值里面，比如这里的  http://m.maizuo.com/v4/api  ，然后[ ]里边写地址的不同部分。

然后，修改config/index.js :

dev:{env:require('./dev.env'),    port:8080,    proxyTable: {'/api': {        target:'http://m.maizuo.com/v4/api',        changeOrigin: true,        pathRewrite: {'^/api':''}      }    }  }

这里的target同上面的一样，然后’/api’和’^/api’代表的就是这个根目录地址；

然后，在页面中具体的调用为：

this.$http.get('api/billboard/home').then((response) =>{

})

这里，url的值为api + [ ] 中的部分

然后，我们就解决了vue中的跨域问题

这里，贴一下http-proxy-middleware插件的github地址，看更多用法 :

https://github.com/chimurai/http-proxy-mid