利用nginx实现html跨域请求第三方接口
利用nginx实现html跨域请求第三方接口
- what: 利用nginx实现html跨域请求第三方接口
- where: win
- when: 2022.4.28
- who: JRT
- why: 记录
- how:
目标
在本地利用nginx和html实现html的跨域请求
nginx配置
server {
listen 5400;
server_name localhost;
#charset koi8-r;
#access_log logs/host.access.log main;
location / {
add_header Access-Control-Allow-Methods *;
root html;
index index.html index.htm;
}
location /api {
proxy_pass https://1.1.1.1:50000/;
}
html写法
<html>
<head></head>
<body>
<form id="form1">
<input type="text" name="CompanyDB" id="CompanyDB"/> <br>
<input type="text" name="UserName" id="UserName"/> <br>
<input type="text" name="Password" id="Password"/> <br>
<button type="button" onclick="sub()">提交</button>
</form>
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script type="text/javascript">
function sub() {
var data={};
data.CompanyDB=$("#CompanyDB").val();
data.UserName=$("#UserName").val();
data.Password=$("#Password").val();
alert("1000");
alert(data)
alert(JSON.stringify(data));
$.ajax({
//请求方式
type: "POST",
//请求的媒体类型
contentType: "application/json;charset=UTF-8",
url: '/api/b1s/v1/Login',
data: JSON.stringify(data),
//请求成功
success: function (result) {
console.log(result.status);
console.log(result);
console.log("bbb");
},
//请求失败,包含具体的错误信息
error: function (e) {
console.log(e.status);
console.log(e.responseText);
console.log("aaa");
}
});
}
</script>
</body>
</html>