从本地服务器前端运行 axios 脚本

Question

我有一个托管在本地主机上的前端。一旦用户在该前端填写了所有数据，他们单击一个按钮，然后启动一个名为 startBot() 的函数，该函数使用 axios。如果我只是使用命令行而不是服务器运行 startBot，则脚本可以完美运行，但是当我使用服务器中的函数时，axios 会使用我的浏览器详细信息来发送信息。这是我的代码： 这是当用户单击按钮运行 startBot() 时运行的函数：

const lodash = require('lodash');
const fuzzyset = require('fuzzyset.js');
var helperFunctions = require("./helperFunctions");

const DELAY = 1500;

const getSupremeProducts = async () => {

    let supremeHome = `?p=${new Date().getTime()}`;

    await helperFunctions.redirectTo(
        supremeHome, 
        DELAY, 
        "Successfully connected to Supreme!", 
        "Error accessing Supreme site, retrying...");

    // direct link to the backend of the site
    let backendLink = "/mobile_stock.json";

    const products = await helperFunctions.redirectTo(
        backendLink, 
        DELAY, 
        "Successfully connected to backend!", 
        "Error accessing Supreme site, retrying...");

    return products.data;
}

这里是 helperFunctions 文件：

const axios = require("axios");
const cheerio = require("cheerio");
const qs = require('qs');

// constants
const RETRY_DELAY = 1000;

axios.defaults.withCredentials = true;

// creating a simple axios session so all cookies are stored throughout the checkout process
const session = axios.create({
    baseURL: `https://www.supremenewyork.com`,
    headers: {
        'user-agent': 'Mozilla/5.0 (iPhone; CPU iPhone OS 13_2_3 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/13.0.3 Mobile/15E148 Safari/604.1',
        'x-requested-with': 'XMLHttpRequest',
        'Connection': 'keep-alive'
    }
  });

// timer function for delays
const timer = ms => new Promise( res => setTimeout(res, ms));

// function for simple get requests
const redirectTo = async (redirectLink, delay, successfullMessage, errorMessage) => {

    while(true){

        try{
            const getRedirect = await session.get(redirectLink);

            if(getRedirect.status === 200){
                if(successfullMessage != null){
                    console.log(successfullMessage);
                }
                await timer(delay);
                return getRedirect;
            }

            else {
                console.log(errorMessage)
                await timer(delay);
            }
        }

        catch(err){
            console.log(err);
            await timer(delay);
        }
    }
}

现在，当我在没有服务器的终端中运行 getSupremeProducts() 时，它运行良好，但是从前端运行它会搞砸一切（顺便说一句，我使用的是 webpack，这就是我可以运行节点模块脚本的原因来自 html) 并导致此错误：

非常感谢任何帮助！我只需要弄清楚如何从前端运行此代码，但让 axios 不使用服务器详细信息来运行代码。

Answer 1

出于安全原因，浏览器会限制从脚本发起的跨域 HTTP 请求。那是 CORS，您必须更改远程服务器中的 HEADERS 以允许来自您的域和端口的请求。如果您无法控制它，那么有几个选项*。

• 在服务器允许的域中添加您的本地地址和端口
• 如果您只是在本地开发并且无法控制服务器，您可以在浏览器上暂时禁用 CORS！
• 创建一个本地代理服务器，您的前端向代理服务器发出请求，代理服务器向远程服务器发出请求（我通常坚持使用这个，只要确保它具有允许的主机名和端口等的第一点）

您可以在此处阅读更多信息 (https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS)