搭建nginx代理,为前端页面跨域调用接口
前端同学因开发需要,本地搭建的服务需要调用其它域名的接口,在帮助正确配置后,已能正常使用。
这里写一篇博客,记录一下。
前端页面地址为127.0.0.1:9813/a.html
接口地址http://test.cas.com/news/auth
让前端在他自己电脑安装好nginx后,在nginx.conf文件加入下面配置:
server{
#任意一不在使用中的端口都行
listen 3389;
server_name www.l.com;
#/表示所有请求www.l.com都会进入如下处理
location / {
#所有请求www.l.com都会被转发给test.cas.com域名下
proxy_pass http://test.cas.com/news/auth;
#以下配置是允许代理服务允许跨域
add_header Access-Control-Allow-Origin *;
add_header Access-Control-Allow-Headers "Origin, X-Requested-With, Content-Type, Accept";
add_header Access-Control-Allow-Methods "GET, POST, OPTIONS";
}
hosts文件新增绑定: 127.0.0.1 www.l.com
前端页面代码示例:
<html>
<body>
<h2>Index</h2>
<div id="show"></div>
<script src="https://common.cnblogs.com/scripts/jquery-2.2.0.min.js"></script>
<script type="text/javascript">
$(function () {
//代理服务会自动把参数转发给test.cas.com域名下
$.get("http://www.l.com:3389?callback=jQuery31109208535942584586_1499060137214&newsTypeId=100", {}, function (result) {
$("#show").html(result);
})
})
</script>
</body>
</html>
转载于:https://www.cnblogs.com/wscsq789/p/9306530.html
搭建nginx代理,为前端页面跨域调用接口相关推荐
- 通过 Nginx 代理转发配置实现跨域(API 代理转发)
通过 Nginx 代理转发配置实现跨域(API 代理转发) 阅读 2285 收藏 119 2017-04-08 原文链接:www.thinktxt.com 1元视频体验视频通话10000分钟cloud ...
- ajaxsetup获取ajax的url_跨域调用接口的方法之一:$.ajaxSetup()
跨域查询接口的数据,之前在公司时有发生过,产生的原因是,本地请求的域名或IP地址不一致,解除方法,也是修改域名和IP地址.比如: 接口中的数据来自IP地址:192.168.1.23/get.php 如 ...
- Nginx 代理解决前端跨域问题
目录 一.什么是 nginx 二.nginx 的用途 三.代理 1.正向代理 2.反向代理 四.nginx.conf 配置文件的基本结构 五.nginx 的内置变量 六.nginx 解决跨域的原理 七 ...
- 前端常见跨域问题解决方案
前端常见跨域解决方案(全) 什么是跨域? 跨域是指一个域下的文档或脚本试图去请求另一个域下的资源,这里跨域是广义的. 广义的跨域: 1.) 资源跳转: A链接.重定向.表单提交 2.) 资源嵌入: & ...
- 前端处理跨域的几种方式
什么是跨域? 跨域是指一个域下的文档或脚本试图去请求另一个域下的资源,这里跨域是广义的. 广义的跨域: 1.资源跳转:A链接.重定向.表单提交 2.资源嵌入: <link>.<scr ...
- 前端解决跨域的九种方法
什么是跨域? 跨域是指一个域下的文档或脚本试图去请求另一个域下的资源,这里跨域是广义的. 广义的跨域: 1.资源跳转:A链接.重定向.表单提交 2.资源嵌入: <link>.<scr ...
- 前端解决跨域问题(9个方法)
什么是跨域? 跨域,是指浏览器不能执行其他网站的脚本.它是由浏览器的同源策略造成的,是浏览器对JavaScript实施的安全限制. 这里说明一下,无法跨域是浏览器对于用户安全的考虑,如果自己写个没有同 ...
- niginx反向代理解决前后端跨域问题
1.代理和跨域 1.1 正向代理 1)用户希望代理服务器帮助其和要访问服务器之间实现通信,需要: a.用户IP报文的目的IP=代理服务器IP: b.用户报文端口号=代理服务器监听端口号: c.HTTP ...
- 前端面试——跨域问题
跨域问题 浏览器的同源策略 同源是指"协议+域名+端口"三者都相同,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,浏览器很容易受到XSS.CSFR等攻击. http:// ...
- 前端解决跨域问题的8种方案(最新最全)
.同源策略如下: URL 说明 是否允许通信 http://www.a.com/a.js http://www.a.com/b.js 同一域名下 允许 http://www.a.com/lab/a.j ...
最新文章
- javascript高级程序设计之函数表达式
- 【Paper】2017_水下潜航器编队海洋勘测的协调控制方法研究
- 模型的燃料,数据采样的秘密
- linux中shell变量$#,$@,$0,$1,$2的含义解释:
- 实现Android-JNI本地C++调试
- C++自定义直方图均衡化
- php小于neq qe,PHP模板判断语句eq相等 ne、neq不相等, gt大于, lt小于
- 前端学习(2645):懂代码之header表头页之未读消息
- java lambda表达式详解_Lambda表达式详解
- php面试php数组变ahp,关于PHP字符串的一道面试题
- mysql 目录更改 php_树莓派搭建LAMP,然后更改根目录
- 【SYZOI Round1】滑稽的树
- 企业架构-发布在线文档【企业架构框架-TOGAF v0.2.pdf】
- DirectX修复工具V4.1公测!
- Java读取计算 PPT,Word,excel的页数
- 推荐多款好看的报表表单配色方案
- win10 网络重置
- oracle rac 成本及架构,Oracle Extended RAC 架构实战
- C# 实现俄罗斯方块
- 以卖货为目的得消费返利是合法的吗?又该如何操作?