前端同学因开发需要，本地搭建的服务需要调用其它域名的接口，在帮助正确配置后，已能正常使用。

这里写一篇博客，记录一下。

前端页面地址为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>

搭建nginx代理，为前端页面跨域调用接口的更多相关文章

  1. 配置nginx反向代理服务器，解决浏览器跨域调用接口的限制问题

    配置nginx反向代理服务器,解决浏览器跨域调用接口的限制问题 - 大venn的博客 - CSDN博客https://blog.csdn.net/u011135260/article/details/ ...

  2. 调用ajax 跨域调用接口

    //ajax 跨域请求数据 function ajaxType (){ $.ajax({ url: "http://127.0.0.1:9090/spring_mvc/HttpClient/ ...

  3. 跨域调用接口的方法之一：$.ajaxSetup()

    跨域查询接口的数据,之前在公司时有发生过,产生的原因是,本地请求的域名或IP地址不一致,解除方法,也是修改域名和IP地址.比如: 接口中的数据来自IP地址:192.168.1.23/get.php 如 ...

  4. 跨域调用接口——WebClient通过get和post请求api

    AJAX不可以实现跨域请求,经过特殊处理才行.一般后台可以通过WebClient实现跨域请求~ //get 请求        string url = string.Format("htt ...

  5. 使用CORS解决flask前端页面跨域问题

    from flask import Flask from flask_cors import CORS app = Flask(__name__) CORS(app) @app.route(" ...

  6. nginx 前后端分离 代理转发，解决跨域问题

    场景 适用于公司有前端,项目采用前后端分离.类似于我们 后端 springboot 提供接口,前端专门写html调用相应的接口,解决跨域问题 配置说明 worker_processes 1; even ...

  7. ajax——CORS跨域调用REST API 的常见问题以及前后端的设置

    RESTful架构是目前比较流行的一种互联网软件架构,在此架构之下的浏览器前端和手机端能共用后端接口. 但是涉及到js跨域调用接口总是很头疼,下边就跟着chrome的报错信息一起来解决一下. 假设:前 ...

  8. 跨域调用webservice

    本人第一次在博客园写博客. 最近研究js的跨域调用,举个小例子. ASP.net 中webservice 源代码 /// <summary>    /// Service1 的摘要说明   ...

  9. jquery中的jsonp跨域调用

                                                    jquery jsonp跨域调用接口

随机推荐

  1. C#Doc写入 XML文件

    HTML是XML的先驱,XML延续了HTML的简单性的优点.XML不是用来替代HTML的, XML和HTML为不同的目的而设计: XML被设计用来描述数据,其焦点是数据的内容.HTML被设计用来显示数 ...

  2. 开源应用框架BitAdminCore：更新日志20180903

    索引 NET Core应用框架之BitAdminCore框架应用篇系列 框架演示:https://www.bitadmincore.com 框架源码:https://github.com/chenyi ...

  3. uwp获取版本信息win10 VersionInfo

    using Windows.System.Profile; Después vamos a agregar una propiedad que va a contener un mensaje con ...

  4. JavaSe 之三目运算符应用

    刚学习Java基本知识,对于三目运算符的应用,尝试了做出求某年份中月份的天数. /*自己随意定义一个年份和月份,使用三目运算符 取得当前月份具体天数.并且输出在控制台. 注意哦:大月31天,小月30天 ...

  5. A - 确定比赛名次（拓扑）

    点击打开链接 有N个比赛队(1<=N<=500),编号依次为1,2,3,....,N进行比赛,比赛结束后,裁判委员会要将所有参赛队伍从前往后依次排名,但现在裁判委员会不能直接获得每个队的比 ...

  6. Substr函数助你免杀php脚本

    主要利用substr函数和url编解码 本文作者:i春秋签约作家Laimooc 1]安全狗: 新研究的php脚本木马:最新版安全狗扫描如下: 成功看到:扫描已完成,未发现网页木马以及其他威胁(开心吗, ...

  7. Windows 计划任务之消息提醒

    Windows 计划任务之消息提醒 你肯定也有这种需求.想做一个计划任务,却发现老式消息提醒已经被微软禁止了. 或者就是很单纯的希望给系统弹出一个消息框而并非CMD的echo命令. so...how ...

  8. java_I/O字符流

    I/O流(Stream) INPUT:输入流,从文件里读OUPUT:输出流,写内容到文件 IO流分为:字符流和字节流 字符流:处理纯文本文件. 字节流:处理可以所有文件. 字符输出流测试: @Test ...

  9. 架构师养成记--19.netty

    一.Netty初步 为什么选择Netty? 和NIO比较,要实现一个通信要简单得很多,性能很好.分布式消息中间件.storm.Dubble都是使用Netty作为底层通信. Netty5.0要求jdk1 ...

  10. 多线程atomicInteger

    并发编程的3个重要概念 1.原子性: 一个操作或者多个操作,要么全部成功,要么全部失败 1.java中保证了基本数据类型的读取和赋值,保证了原子性,这些操作不可终端 a=10 原子性 b=a 不满足 ...