jquery,ajax接口跨域

本地开发使用jquery,ajax请求接口，出现跨域问题。

1.方案一： 设置浏览器跨域限制。

• 如谷歌浏览器，点击快捷方式 ，右键选择属性，在快捷方式一栏中修改【目标】如下 "C:\Program Files\Google\Chrome\Application\chrome.exe" --allow-file-access-from-files --user-data-dir="D:\files\MyChromeUserdata"

2.方案二： 本地启动node.

• 第一步，初始化 npm init

• 第二步， 安装express,http-proxy-middleware

• npm i express http-proxy-middleware --save-dev

• package.js

{
  "name": "node",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "node index.js"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "express": "^4.18.2",
    "http-proxy-middleware": "^2.0.6"
  }
}

• index.js

const express = require('express');
// const proxy = require('http-proxy-middleware');
// http-proxy-middleware版本1.0.5的时候默认导出的不是proxy的函数了，需要用以下注释的方式调用
const { createProxyMiddleware: proxy } = require('http-proxy-middleware');
const path = require('path');
const { port=8000, proxy:proxyConfig={} } = require('./serverConfig');
 
const app = express();
 
app.use('/', express.static(path.join(__dirname, 'static')))

Object.keys(proxyConfig).map(key=>{
    app.use(key, proxy(proxyConfig[key]));
})
 
app.listen(port, ()=>{
    console.log(`server is running on port ${port}`);
})

• serverConfig.js

module.exports = {
    /**
     * port-服务启动的端口
     */
    port:3100,
 
    /**
     * 代理的配置-可以设置多个代理
     * @param key - 代理的匹配路径
     * target-代理的目标地址
     * changeOrigin-是否改变来源
     * ws-是否支持socket
     * pathRewrite-路径重写
     */
    proxy:{
        '/api':{
            target:"http://127.169.54.36:10881",
            changeOrigin:true,
            pathRewrite:{
                // "old-path":"new-path",
                "/api":""
            }
        }
    }
}