在现代浏览器中,都强加了对javacript代码的访问限制,比如一个页面的js无法向非同源的url实现ajax请求,获得数据。在这时,是浏览器端会报错:

No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3000' is therefore not allowed access. The response had HTTP status code 401.

对于server端一般也会对这种安全策略加以实施,比如laravel在这种情况下,就会返回

401 Unauthorized

很多时候,我们是需要这种机制的。那么有什么好的方法吗?

一个比较常见的解决方案是使用web proxy

图例以下几种场景:

正常情况下,如果js的origin和js要发起的ajax属于同一个网站,则没有任何问题。

如果不同源,则block

通过proxy来workaround这个问题:

参考下面的文章

https://developer.yahoo.com/javascript/howto-proxy.html

javascript使用web proxy来实现ajax cross-domain通信的更多相关文章

  1. Ajax cross domain

    xhrFields:{ withCredentials:true}, https://stackoverflow.com/questions/2054316/sending-credentials-w ...

  2. 关于ajax跨域请求(cross Domain)

    Cross Domain AJAX主要就是A.com网站的页面发出一个XMLHttpRequest,这个Request的url是B.com,这样的请求是被禁止的,浏览器处于安全考虑不允许进行跨域访问, ...

  3. Struts2---Result(传统Web应用程序与Ajax应用程序的异同)

    看了很久的struts,在视频和书的引导下,慢慢明白了点,推荐:<struts 2 in action>和马士兵的视频 今天看结果这块时,由于还没有学过ajax等,不太明白,但是必须弄懂嗒 ...

  4. [cross domain] four approachs to cross domain in javascript

    four approachs can cross domain in javascript 1.jsonp 2.document.domain(only in frame and they have ...

  5. 遇到 Error creating the Web Proxy specified in the 'system.net/defaultProxy' configuration section的解决办法

    用记事本编辑*.EXE.config,在“<system.net>”节点加入<defaultProxy> <proxy usesystemdefault="Fa ...

  6. WinHTTP Web Proxy Auto-Discovery Service

    下面是网上搜集的,个人没有做测试,----------------------------- WinHTTP Web Proxy Auto-Discovery Service 服务成功发送一个 开始 ...

  7. 全 Javascript 的 Web 开发架构:MEAN

    http://developer.51cto.com/art/201404/434759.htm 全 Javascript 的 Web 开发架构:MEAN 引言 最近在Angular社区的原型开发者间 ...

  8. Python搭建Web服务器,与Ajax交互,接收处理Get和Post请求的简易结构

    用python搭建web服务器,与ajax交互,接收处理Get和Post请求:简单实用,没有用框架,适用于简单需求,更多功能可进行扩展. python有自带模块BaseHTTPServer.CGIHT ...

  9. 《Professional JavaScript for Web Developers》day02

    <Professional JavaScript for Web Developers>day02 1.在HTML中使用JavaScript 1.1 <script>元素 HT ...

随机推荐

  1. Python中utf-8与utf-8-sig两种编码格式的区别

    As UTF-8 is an 8-bit encoding no BOM is required and anyU+FEFF character in the decoded Unicode stri ...

  2. 【CSS3】background-origin和background-clip的区别

    background-clip 与 background-origin是css3中引入的两个跟元素背景相关的属性,它们有相同的可选值,即border.padding.content三种,而且这两个属性 ...

  3. jgGrid注销表格(动态修改表头)以及前台分页

    实例代码 <!doctype html> <html lang="en"> <head> <meta charset="UTF- ...

  4. docker搭建gitlab,设置邮件提醒,并运行runner

    接着http://www.cnblogs.com/wsy1030/p/8431837.html 在另一台机子运行gitlab: docker run --name='gitlab' -d -p 222 ...

  5. WPF DataTemplate與ControlTemplate

    一. 前言     什麼是DataTemplate? 什麼是ControlTemplate? 在stackoverflow有句簡短的解釋 "A DataTemplate, therefore ...

  6. 去掉img标签周围的空白

    我们在页面布局的时候,明明已经去掉了所有标签的margin和padding,img标签周围依然会有空白,解决方法有以下几种: 1.给img标签设浮动: img{ float:left; } 2.将im ...

  7. Windows下安装PHP开发环境

    一.Apache 因为Apache官网只提供源代码,如果要使用必须得自己编译,这里我选择第三方安装包Apache Lounge. 进入Apachelounge官方下载地址:http://www.apa ...

  8. centos下对文件某些特定字符串分组统计出现次数

    假如现有数据: { "@timestamp": "2018-10-13T21:55:58+08:00", "remote_addr": &q ...

  9. 移动端使用的WebKit私有属性(转)

    <!DOCTYPE HTML><html><head> <meta charset="utf-8"> <title>无标 ...

  10. 4 springboot 集成swagger2

    Swagger:实时生成在线接口文档,方便测试和沟通 官网地址:https://swagger.io/ 引入依赖 <dependency> <groupId>io.spring ...