问题描述

之前要测试一个http的接口,在postman中测试成功,但使用ajax调用却跨域。于是通过使用ngin反向代理的方式来解决ajax调用跨域问题

测试页面的内容

<html>
<head>
<script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.4.1/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#b01").click(function(){
$.ajax({
type : "POST",
url : "http://xxx.xxx.xx.xx:8770/kfeinvoice/finance/invoiceViewByFinance",
data : '{"originalOrderNo": "123456","dataSource": "01","queryType": "01","invoiceCode": "", "invoiceNo": ""}',
contentType : "application/json",
dataType : "json",
complete:function(msg) {
console.log(msg) $("#myDiv").html(JSON.stringify(msg.responseJSON))
$("#myDiv").append("<p>"+msg.responseText+"</p>")
}
});
});
});
</script>
</head>
<body> <div id="myDiv"><h2>通过 AJAX 改变文本</h2></div>
<button id="b01" type="button">改变内容</button> </body>
</html>

nginx中的vhost,xx.conf的配置

server {
listen 8770;
server_name serv.com;
index index.html; location ^~ /v/ {
alias D:/xxx/;
try_files $uri $uri/ /index.html;
} location / {
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_pass http://abc.xxx.com;
} access_log D:/data0/logs/www.access.log main;
}

nginx启动后,访问[http://localhost:8770/v/index.html]测试,返回结果正常。

20191204-使用nginx解决ajax测试调用接口跨域问题的更多相关文章

  1. Springboot如何优雅的解决ajax+自定义headers的跨域请求

    1.什么是跨域 由于浏览器同源策略(同源策略,它是由Netscape提出的一个著名的安全策略.现在所有支持JavaScript 的浏览器都会使用这个策略.所谓同源是指,域名,协议,端口相同.),凡是发 ...

  2. Springboot如何优雅的解决ajax+自定义headers的跨域请求[转]

    1.什么是跨域 由于浏览器同源策略(同源策略,它是由Netscape提出的一个著名的安全策略.现在所有支持JavaScript 的浏览器都会使用这个策略.所谓同源是指,域名,协议,端口相同.),凡是发 ...

  3. 解决前后端调用,跨域二次请求Access-Control-Max-Age

    发现前后端分离的项目中,前端发起一个请求到后端,在Chrome浏览器下面debug的时候,Network下面看到同一个url有两条请求,url有两条请求,第一条请求的Method为OPTIONS,第二 ...

  4. axios解决调用后端接口跨域问题

    vue-cli通过是本地代理的方式解决接口跨域问题的.但是在vue-cli的默认项目配置中这个代理是没有配置的,如果现在项目中使用,必须手动配置config/index.js文件 ... proxyT ...

  5. ajax调用webservice 跨域问题

    用js或者jquery跨域调用接口时 对方的接口需要做jsonp处理,你的ajax jsonp调用才可以 egg 接口中已经做了jsonp处理,所以可以跨域调用 //$.ajax({ // url: ...

  6. JAVA联调接口跨域解决办法

    JAVA联调接口跨域解决办法 第一种代码: HttpResponse response = new BasicHttpResponse(HttpVersion.HTTP_1_1,HttpStatus. ...

  7. 上传文件,使用FormData进行Ajax请求,jsoncallback跨域

    通过传统的form表单提交的方式上传文件: <form id= "uploadForm" action= "http://localhost:8080/cfJAX_ ...

  8. 使用nginx反向代理处理前后端跨域访问

    本文主要解决:使用nginx反向代理处理前后端跨域访问的问题 1.何为跨域访问? 以下类型为跨域访问 1)不同域名间访问 www.zuiyoujie.com和www.baidu.com 2)同域名不同 ...

  9. 前后分离调用API跨域

    前后分离调用API接口跨域问题 什么是跨域?  跨域是指一个域下的文档或脚本试图去请求另一个域下的资源,这里跨域是广义的. 广义的跨域: 资源跳转:A链接.重定向.表单提交. 资源嵌入: <li ...

随机推荐

  1. PHP mysqli_num_fields() 函数

    mysqli_num_fields() 函数返回结果集中字段(列)的数量. 语法 mysqli_num_fields(result); 参数 描述 result 必需.规定由 mysqli_query ...

  2. (十七)线程,connect的第五个参数

    采用多线程,将需要处理的后台数据放入子线程,为了能够跨线程调用,一种方法是使用类似线程锁对线程进行保护,另外一种方法使用Qt的信号槽机制.Qt的信号槽机制采用connect函数进行连接,connect ...

  3. const 与指针 的用法

    请找出下面程序中有哪些错误: 1 2 3 4 5 6 7 8 9 10 11 12 13 int main() {    int i=10;    int j=1;    const int *p1; ...

  4. Hdu Bomb(数位DP)

    Bomb Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 131072/65536 K (Java/Others) Total Submiss ...

  5. sass,compass学习笔记总结

    最近在进行百度前端技术学院的任务,知道自己基础薄弱,可没想到弱到这种地步,同时在安装各种软件的同时遇到了各种坑,查阅了各种资料,一个个解决的时候也发现自己凌乱了.学习总结,在脑海中形成自己的学习系统才 ...

  6. 转:Jmeter文件上传、下载

    一.上传/下载的过程.        上传的过程就是你把你本地的文件,扔到服务器上的这么一个过程.        下载呢,就是把服务器上的文件拿过来,然后存到你本地的这么一个过程.        总结 ...

  7. c++继承子类构造函数问题

    c++中子类在继承基类的时候需要在构造函数中初始化变量.如果基类没有构造函数或者只有不带参数的构造函数,那么子类中的构造函数就不需要调用基类的构造函数了. 个人总结了两点子类中构造函数必须调用父类的构 ...

  8. python 系统模块 OS

    os.system("系统命令")  调用系统命令 os.system("task kill /f /im 系统的进程") 关闭系统进程 os.listdir( ...

  9. Github提交PR(pull request)过程

    PR 想一想, 也可以想执行6.7.8, 再执行4.5. 避免原仓库和fork仓库的冲突 fork到自己的仓库 git clone到本地 git remote add upstream [原项目地址] ...

  10. 微信支付宝xposed个人收款免签支付源码

    源码介绍: 个人免签支付是指使用自己的微信支付宝账号作为个人网站的收款账号,网站订单支付成功后,网站能实时收到成功回调信息.        系统基于xposed逆向微信.支付宝.云闪付来实现个人收款免 ...