zoukankan      html  css  js  c++  java
  • 关于跨域和如何解决跨域问题的小结

    之前使用到JSONP的时候接触了一下跨域请求的问题,记录总结一下,以便以后参照。提到跨域,什么是跨域?只要协议、域名、端口有任何一个不同,都被当作是不同的域。

    特别注意两点:

    第一:如果是协议和端口造成的跨域问题“前台”是无能为力的。

    第二:在跨域问题上,域仅仅是通过“URL的首部”来识别而不会去尝试判断相同的ip地址对应着两个域或两个域是否在同一个ip上。

    • 前台关于处理跨域的方法

      (一)document.domain+iframe的设置

        (二)动态创建script

      (三)利用iframe和location.hash

        (四)window.name实现的跨域数据传输

        (五)使用HTML5 postMessage

        (六)利用flash

        (七)jsonp

        (八)jQuery插件-jquery-jsonp

    angularjs关于解决跨域的问题

    一、$http.jsonp【实现跨域】

    1. 指定callback和回调函数名,函数名为JSON_CALLBACK时,会调用success回调函数,JSON_CALLBACK必须全为大写。
    2. 指定其它回调函数,但必须是定义在window下的全局函数。url中必须加上callback。

    二、$http.get【实现跨域】

    1. 在服务器端设置允许在其他域名下访问

    response.setHeader("Access-Control-Allow-Origin", "*"); //允许所有域名访问
    response.setHeader("Access-Control-Allow-Origin", "http://www.123.com"); //允许www.123.com访问

    2. AngularJS端使用$http.get()

    三、$http.post【实现跨域】

    1. 在服务器端设置允许在其他域名下访问,及响应类型、响应头设置

    response.setHeader("Access-Control-Allow-Origin", "*");
    response.setHeader("Access-Control-Allow-Methods","POST");
    response.setHeader("Access-Control-Allow-Headers","x-requested-with,content-type");

    2. AngularJS端使用$http.post(),同时设置请求头信息

    $http.post('http://localhost/ajax/getAllIndustryCategoty.pt',{languageColumn:'name_eu'},{'Content-Type':'application/x-www-form-urlencoded'}).success(function(data){
    		$scope.industries = data;
    	});
  • 相关阅读:
    Vue笔记:使用 vuex 管理应用状态
    Vue + Element UI 实现权限管理系统(更换皮肤主题)
    Vue + Element UI 实现权限管理系统(优化登录流程)
    Vue + Element UI 实现权限管理系统(国际化实现)
    Vue笔记:使用 axios 中 this 指向问题
    Vue + Element UI 实现权限管理系统(工具模块封装)
    Vue + Element UI 实现权限管理系统(搭建开发环境)
    Vue 全家桶
    android 检测ListView滚动到的位置
    android 工具类之SharePreference
  • 原文地址:https://www.cnblogs.com/xiaoxiaochengxuyuan/p/5629842.html
Copyright © 2011-2022 走看看