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

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

前端页面地址为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. SQL Server Job

    1. SQL Server Job创建:(SQL Server 代理 - 作业)鼠标右键.新建作业. 2.[常规]选项:定义作业名称.和说明信息. 3:[步骤]选项:新建步骤 4:定义步骤名称.设置对 ...

  2. c#设计模式之装饰器模式(Decorator Pattern)

    引子 在面向对象语言中,我们常常会听到这样一句话:组合优于继承.那么该如何去理解这句话呢? 下面我将以游戏装备为模型用简单的代码去展示它 先创建一个装备的抽象类,然后创建刀枪2个具体的业务子类 pub ...

  3. ASP.NET MVC学习目录

    一.ASP.NET MVC原理详解 1.了解MVC架构模式 3.学习ASP.NET MVC的必备语言知识 4.MVC中的razor语法详解 5.ASP.NET MVC路由系统机制详细讲解 6.ASP. ...

  4. windows server 2008 站点系列--AD的站点建立与子网的管理(zhuanzai)

    本次课程将给大家介绍AD中站点和子网的功能.站点和子网之间的关联,以及相关的设置步骤. 应用背景介绍: contoso公司的总部在西安(Xian),陕南的汉中(Shannan)和陕北的榆林(Shanb ...

  5. 「BZOJ4318」OSU!

    题目链接 戳我 \(Solution\) 我们考虑每增加一个\(1\)会对答案有什么影响: \[E((x+1)^3)-E(x^3)=E(3x^2+3x+1)=3E(x^2)+3E(x)+1\] 所以我 ...

  6. 初识Mybatis框架

    mybatis框架  主要是对数据库进行操作的 编写sql语句 使我们对数据库的crud操作更加简洁方便!! 1.使用mybatis框架 进行第一个项目 查询数据库 并返回数据 :(简单) (1)搭建 ...

  7. win10开始菜单任务栏点击无反应

    win+r,输入powershell,确定,输入Stop-Process -Name explorer,回车(这行代码是结束explorer进程,结束后它会自动重启)

  8. 字符串模式匹配算法2 - AC算法

    上篇文章(http://www.cnblogs.com/zzqcn/p/3508442.html)里提到的BF和KMP算法都是单模式串匹配算法,也就是说,模式串只有一个.当需要在字符串中搜索多个关键字 ...

  9. SQL 中用户建立与权限授予

    SQL 中用户建立与权限授予 一.原有 如果大家对我的博客动态非常关注的话,应该又看到我弄了一个随机MAN信息的小工具.但是呢,那个工具还有待加强(显示效果不是那么的好). 所以我就希望可以显示一些简 ...

  10. Dota2App--第三天

    一.要实现的功能 1.新特性页面 1.1.是否进入新特性界面的两种情况 1)第一次安装此APP,进入新特性界面 2)不是第一次安装,但是有版本更新,进入新特性界面 1.2.具体的代码实现 //0.版本 ...