nginx来解决"C:\Program Files\Google\Chrome\Application\chrome.exe" --args --disable-web-security --user-data-dir=C:\Program Files\Google\Chrome\Application\
angular.json 同级的目录下面的新建proxy.config.json 文件，内容如下：{
"/api": {
"target": "http://localhost:8080",
"secure": false
}
}
说明：当我们访问angular的web服务地址：http://localhost:4200/api的时候，其实就相等于访问http://localhost:8080的地址；如下，在angular的服务中配置地址，其实就是访问http://localhost:8080/ctp/trades
return this.http.get(`/api/ctp/trades`);
angular.json文件，在对象key 等于 serve 中的 options 下增加一项"options": {
"proxyConfig": "proxy.config.json"
}
package.json, 使上面的配置启动生效 "start": "ng serve --proxy-config proxy.config.json",
npm start
nginx提供http服务，同时提供反向代理nginx来实现<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></script>
<title>Document</title>
</head>
<body>
<button id="button">ajax request</button>
</body>
<script type="text/javascript">
$("button").click(function (){
let url
url = "http://localhost:8080/api/admin/users"
$.get(url, function (result) {
console.log(result)
})
console.log("clicked")
})
</script>
</html>
nginx来解决，我们不要直接在上面代码url地址写url = "http://localhost:8080/api/admin/users", 把它改成url = "http://localhost/api/admin/users" 或者 /api/admin/users，改完之后，正确的代码为：<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></script>
<title>Document</title>
</head>
<body>
<button id="button">ajax request</button>
</body>
<script type="text/javascript">
$("button").click(function (){
let url = "/api/admin/users"
$.get(url, function (result) {
console.log(result)
})
console.log("clicked")
})
</script>
</html>
nginx的配置文件nginx.conf 中 ，修改server字段的某些东西 server {
listen 80;
server_name localhost;
#charset koi8-r;
#access_log logs/host.access.log main;
location / {
root D:\web\
index index.html index.htm;
try_files $uri $uri/ /index.html;
# proxy_pass http://MyServers;
}
location /api/ {
proxy_pass http://localhost:8080;
}
我们看最后面的三行，具体的意思就是：当我们访问地址http://localhost/api/的时候，其实访问的是：http://localhost:8080的这个地址，通过这么一层转换，浏览器就不会报跨域错误的问题了