前后端分离项目经常会遇到跨域问题，通常有两种方法去解决这个问题。
第一种，就是利用html5新的api跨源资源共享。
这时你可以让你的后端同事设置一个响应头如下，允许你直接请求资源，就OK了
1 Access-Control-Allow-Origin: http://www.xxx.net
红字部分就是你的前端域名，这样后端收到请求后，就会直接返回数据给你，这没什么好说的，直接看第二种。
第二种，就是利用jsonp实现跨域。
这是后端代码，基于express
1 const express = require(‘express‘); 2 ?3 const router = express.Router(); 4 ?5 router.get(‘/‘, (req, res) => { 6 ????if (req.query && req.query.callback) { 7 ????????res.jsonp({status: 200, message: "这是一个jsonp接口", data: [{name:111,age:222}]}); 8 ????} else { 9 ????????res.json({status: 200, message: "这是一个json接口", data: [{}]});10 ????}11 });12 13 module.exports = router;前端代码如下：
如果你的项目使用了jquery库，你可以直接使用他内置的ajax方法，里面封装好了跨域操作api，如下：
1 function get_jsonp() { 2 $.ajax({ 3 ????url: ‘/api‘, 4 ????type: ‘get‘, 5 ????dataType: ‘jsonp‘, ?// 预期服务器返回的数据类型 6 ????jsonp: ‘callback‘, ?// 指定回调查询参数的名称，即前后端约定的字段，默认为“callback" 7 ????jsonpCallback: ‘cb‘, ?// 指定回调函数名称 8 ????cache: true, 9 ????success: function (data) { ??// jQuery 将 JSON 数据剥离出来，传入 success 和 error10 ????????console.log(data); ?// ‘This is JSONP realized by jQuery.‘11 ????????$("#jsonp").html(data.message);12 ????}13 });14 }15 16 function get_json() {17 $.getJSON("/api", function (data) {18 ????$("#json").html(‘json info:‘ + data.message);19 })20 }如果你的项目没有使用类库框架，那么你可以使用如下方法（其实jquery就是基于这个原理）：
1 function handleResponse(response) {2 ????console.log(response);3 }4 5 var script = document.createElement(‘script‘);6 // 指定回调函数的名字为 handleResponse7 script.src = ‘/api?callback=handleResponse‘;8 document.head.appendChild(script);其实跨域还有其他办法，笔者这里只讲这两种方法，这是最简单最实用的两种方法。
解决js跨域问题
原文地址：http://www.cnblogs.com/zt123123/p/7600458.html