如何利用PHP 快速解决跨域问题

目录
  • 跨域介绍
  • 跨域介绍
  • 跨域解决方案

跨域介绍

浏览器拥有同源策略限制确保安全,同源策略会阻止一个域的Javascript脚本和另外一个域的内容进行交互。

当一个请求url的协议、域名(包括多级域名)、端口三者之间任意一个与当前页面url不同即为跨域。

跨域介绍

  • 1)无法读取非同源网页的 Cookie、LocalStorage 和 IndexedDB
  • 2)无法接触非同源网页的 DOM 节点
  • 3)无法向非同源地址发送 AJAX 请求

跨域解决方案

1)JSONP(只支持GET请求)

Javascript:

<script src="http://test.com/data.php?callback=dosomething"></script>
// 向服务器test.com发出请求,该请求的查询字符串有一个callback参数,用来指定回调函数的名字

// 处理服务器返回回调函数的数据
<script type="text/javascript">
    function dosomething(res){
        // 处理获得的数据
        console.log(res.data)
    }
</script>

data.php:

header('Content-type: application/json');

//获取回调函数名
$jsoncallback = htmlspecialchars($_REQUEST ['callback']);

//json数据
$json_data = '["customername1","customername2"]';

//输出jsonp格式的数据
echo $jsoncallback . "(" . $json_data . ")";

2)CORS 跨域资源分享(Cross-Origin Resource Sharing)

  • 1、普通跨域请求:只需服务器端设置 Access-Control-Allow-Origin
  • 2、带cookie跨域请求:前后端都需要进行设置

PHP:

header("Access-Control-Allow-Origin:*");

或者 Nginx:

location ~ .*\.php$
{
    add_header 'Access-Control-Allow-Origin' '*';    # 就加这句就行
    include fcgi.conf;
    fastcgi_pass  127.0.0.1:10080;
    fastcgi_index index.php;
    expires off;
}

Javascript:

$.ajax({
   url: 'http://www.test.com:8080/login',
   type: 'get',
   data: {},
   xhrFields: {
       withCredentials: true    // 前端设置是否带cookie
   },
   crossDomain: true,           // 会让请求头中包含跨域的额外信息,但不会含cookie
});
 

3)WebSocket 浏览器与服务器的全双工通信,同时也是跨域的一种解决方案

4)Nginx 反向代理

server {
    # nginx监听所有 test.com:9000 端口收到的请求

	listen       9000;
	server_name  test.com;

    # test.com:9000 会被转发到 192.168.25.20:9000
	location / {
		proxy_pass http://192.168.25.20:9000;
	}

	# test.com:9000/api/ 会被转发到 "192.168.25.20:9000/api/"

	location /api/ {
		proxy_pass http://192.168.25.20:9000;
	}
}

到此这篇关于如何利用PHP 快速解决跨域问题的文章就介绍到这了,更多相关PHP 跨域内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们!

(0)

相关推荐

  • PHP关于IE下的iframe跨域导致session丢失问题解决方法

    今天搞的一个登录页面,被别的网站用iframe嵌进去后,死活无法登录(只在IE中存在这种情况). 很明显,session无法被保存.但是直接在地址栏打开那个登录页面,一切都正常啊.真是奇怪啊. 在网上搜索了一下.发现这个问题还真有不少人提及到.最后的解决方法是在那个登录页面里加上以下代码: 复制代码 代码如下: <span style="font-family:Microsoft YaHei; font-size:14px">header('P3P: CP="AL

  • PHP Ajax跨域问题解决方案代码实例

    本文通过设置Access-Control-Allow-Origin来实现跨域. 例如:客户端的域名是client.runoob.com,而请求的域名是server.runoob.com. 如果直接使用ajax访问,会有以下错误: XMLHttpRequest cannot load http://server.runoob.com/server.php. No 'Access-Control-Allow-Origin' header is present on the requested res

  • Vue 项目中遇到的跨域问题及解决方法(后台php)

    问题描述 前端 vue 框架,后台 php,百度跨域问题后台加这段代码 header("Access-Control-Allow-Origin: *"); 加了之后报这个错: The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'. The valu

  • ThinkPHP框架实现session跨域问题的解决方法

    ThinkPHP的session跨域问题很多开发者都遇到过! 其实不管是ThinkPHP还是php本身,在解决session跨域问题的时候都需要设置session.cookie_domain. 在ThinkPHP里,需要修改配置文件conf/config.php 在第一行加上: ini_set('session.cookie_domain', ".domain.com");//跨域访问Session 经过总结,针对session跨域这一问题的解决方法主要有以下几种: 第一种情况:如果你

  • header函数设置响应头解决php跨域问题实例详解

    设置允许访问的域名: 1.允许全部的域名访问 header("Access-Control-Allow-Origin:*"); 2.允许指定域名访问 header( 'Access-Control-Allow-Origin:http://a.test.com' ); 设置允许访问的请求方式: 1.一种或者多种 header('Access-Control-Allow-Methods:POST,GET,OPTIONS,DELETE'); 2.全部 header('Access-Contr

  • 如何利用PHP 快速解决跨域问题

    目录 跨域介绍 跨域介绍 跨域解决方案 跨域介绍 浏览器拥有同源策略限制确保安全,同源策略会阻止一个域的Javascript脚本和另外一个域的内容进行交互. 当一个请求url的协议.域名(包括多级域名).端口三者之间任意一个与当前页面url不同即为跨域. 跨域介绍 1)无法读取非同源网页的 Cookie.LocalStorage 和 IndexedDB 2)无法接触非同源网页的 DOM 节点 3)无法向非同源地址发送 AJAX 请求 跨域解决方案 1)JSONP(只支持GET请求) Javasc

  • 快速解决跨域请求问题:jsonp和CORS

    网上各种跨域教程,各种实践,各种问答,除了简单的 jsonp 以外,很多说 CORS 的都是行不通的,老是缺那么一两个关键的配置.本文只想解决问题,所有的代码经过亲自实践. 本文解决跨域中的 get.post.data.cookie 等这些问题. 本文只会说 get 请求和 post 请求,读者请把 post 请求理解成除 get 请求外的所有其他请求方式. JSONP JSONP是利用浏览器对script的资源引用没有同源限制,通过动态插入一个script标签,当资源加载到页面后会立即执行的原

  • 利用jsonp与代理服务器方案解决跨域问题

    前言 本文将从实践角度介绍如何使用jsonp和代理服务器方案解决跨域问题,分享出来供大家参考学习,下面话不多说了,来一起看看详细的介绍吧. 浏览器为了保护用户安全,引入了同源策略,即一个服务器页面无法访问另一个协议.域名.端口不同的服务器数据.当页面需要跨服务器访问另一个服务器的数据时,即产生跨域行为.以豆瓣的公开API(https://api.douban.com/v2/book/1220562)为例,当前我的服务器处于http://127.0.0.1:5000下,豆瓣的服务器很显然跟我的服务

  • 利用nginx解决跨域问题的方法(以flask为例)

    前言 我们单位的架构是在api和js之间架构一个中间层(python编写),以实现后端渲染,登录状态判定,跨域转发api等功能.但是这样一个中间会使前端工程师的工作量乘上两倍,原本js可以直接ajax请求api,但是我们不得不ajax请求中间层,中间层再请求api. 如图: 为了少敲代码,提高工作效率,我们当然希望将python中间层砍掉,但是如何解决以下三个问题,成为关键: 后端渲染 登录状态判定 跨域转发api 关于1,2我会在另外两篇博客中详细叙述,这篇文章主要解决3,也就是跨域问题.解决

  • 说说如何利用 Node.js 代理解决跨域问题

    前后端分离,经常会出现跨域访问被限制的问题. 跨域访问限制是服务端出于安全考虑的限制行为.即只有同域或者指定域的请求,才能访问.这样还可以防止图片被盗链.服务端(比如 Node.js)可以通过代理,来解决这一问题. 1 安装 request 库 npm install request --save-dev 2 配置 我们以知乎日报为例,配置两个代理.一个代理内容,另一个代理图片. 在项目根目录,配置 proxy.js : //代理 const http = require('http'); co

  • js前端解决跨域问题的8种方案(最新最全)

    1.同源策略如下: URL 说明 是否允许通信 http://www.a.com/a.js http://www.a.com/b.js 同一域名下 允许 http://www.a.com/lab/a.js http://www.a.com/script/b.js 同一域名下不同文件夹 允许 http://www.a.com:8000/a.js http://www.a.com/b.js 同一域名,不同端口 不允许 http://www.a.com/a.js https://www.a.com/b

  • vue解决跨域路由冲突问题思路解析

    vue 简介 Vue.js(读音 /vjuː/, 类似于 view) 是一套构建用户界面的渐进式框架. Vue 只关注视图层, 采用自底向上增量开发的设计. Vue 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件. Vue 学习起来非常简单,本教程基于 Vue 2.1.8 版本测试. 当我们在路由里面配置成以下代理可以解决跨域问题 proxyTable: { '/goods/*': { target: 'http://localhost:3000' }, '/users/*

  • Flask解决跨域的问题示例代码

    跨域文件上传的时候,浏览器会自动发起一个 OPTIONS 方法到服务器,现在后台解决前端跨域解决前端跨域请求的问题 客户端发起的这个 OPTIONS 可以说是一个"预请求",用于探测后续真正需要发起的跨域 POST 请求对于服务器来说是否是安全可接受的,因为跨域提交数据对于服务器来说可能存在很大的安全问题 请求头 Access-Control-Request-Method 用于提醒服务器在接下来的请求中将会使用什么样的方法来发起请求 Access-Control-Allow-Metho

  • nodejs搭建本地服务器轻松解决跨域问题

    最近把以前用jquery写的一个小demo拿出来运行的,刚开始的时候忘了开启本地服务导致控制台一直报XMLHttpRequest cannot load file:///C:/Users/79883/Desktop/ajax/data.json?{%22username%22:%22lcl@qq.com%22,%22pwd%22:%22Home20170702%22}. Cross origin requests are only supported for protocol schemes:

  • 如何在vue里面优雅的解决跨域(路由冲突问题)

    如何在vue里面优雅的解决跨域,路由冲突问题 当我们在路由里面配置成以下代理可以解决跨域问题 proxyTable: { '/goods/*': { target: 'http://localhost:3000' }, '/users/*': { target: 'http://localhost:3000' } }, 这种配置方式在一定程度上解决了跨域问题,但是会带来一些问题, 比如我们的vue 路由 也命名为 goods,这时候就会产生了冲突, 如果项目中接口很多,都在这里配置是很麻烦的,也

随机推荐