CORS会在任何地方返回代理文本，而不是所需的目标资源 [英] CORS anywhere returning proxy text, not desired target resource

问题描述

我正在尝试使用节点，express和

对于熟悉arcgis-js-api的用户，您还可以预先配置代理的使用:

  urlUtils.addProxyRule({urlPrefix:'maps.disasters.nasa.gov'，proxyUrl:'http://localhost:3030/proxy/'，}); 

如果我这样做，则网络选项卡显示对 localhost:3030/proxy/< url> 的调用返回的是index.html页面，而不是所需的json./p>

为什么当我直接通过浏览器访问url而不是从前端文件调用该URL时，代理为什么能提供预期/所需的结果?感谢您的阅读.

解决方案

我检查了浏览器控制台，发现该URL被发送到代理而不是发送给代理

http://localhost:3030/proxy/https://maps.disasters.nasa.gov/ags04/rest/services/ca_fires_202008/sentinel2/MapServer?f = json

看起来像这样

http://localhost:3030/proxy/https:/maps.disasters.nasa.gov/ags04/rest/services/ca_fires_202008/sentinel2/MapServer?f = json

不确定为什么会发生这种情况，但是作为一种快速解决方案，您可以替换

  req.url = req.url.replace('/proxy/'，'/'); 

使用

  req.url = req.url.replace('/proxy/https:/'，'/https://'); 

I am trying to set up a proxy using node, express, and an instance of cors-anywhere for my arcgis-js-api app. My server file looks like this:

import express from 'express';
import cors from 'cors';
import corsAnywhere from 'cors-anywhere';

const { PORT } = process.env;
const port = PORT || 3030;

var app = express();

let proxy = corsAnywhere.createServer({
    originWhitelist: [], // Allow all origins
    requireHeaders: [], // Do not require any headers.
    removeHeaders: [], // Do not remove any headers.
});

app.use(cors());

app.get('/proxy/:proxyUrl*', (req, res) => {
    req.url = req.url.replace('/proxy/', '/');
    proxy.emit('request', req, res);
});

app.get('*', (req, res) => {
    res.sendFile(path.resolve(__dirname, 'index.html'));
});

app.listen(port, () => {
    console.log(`App listening on port ${port}`);
});

When I go to http://localhost:3030/proxy/https://maps.disasters.nasa.gov/ags04/rest/services/ca_fires_202008/sentinel2/MapServer?f=json, I get to my target json no problem, with access-control-allow-origin: * correctly tacked on.

In my front end html (an arcgis-js-api app), I am calling that same url:

var layer = new MapImageLayer({
  url: 'http://localhost:3030/proxy/https://maps.disasters.nasa.gov/ags04/rest/services/ca_fires_202008/sentinel2/MapServer?f=json',
});

My network tab shows a response not of the expected JSON, but of the text of the cors-anywhere proxy:

For those familiar with the arcgis-js-api, you can also preconfigure use of a proxy:

urlUtils.addProxyRule({
  urlPrefix: 'maps.disasters.nasa.gov',
  proxyUrl: 'http://localhost:3030/proxy/',
});

If I do it this way, the network tab shows that the call to the localhost:3030/proxy/<url> is returning the index.html page, not the desired json.

Why is the proxy giving the expected/required result when I access the url directly through the browser, but not when being called from my front end file? Thanks for reading.

解决方案

I checked the browser console and noticed that the url being sent to the proxy instead of this

http://localhost:3030/proxy/https://maps.disasters.nasa.gov/ags04/rest/services/ca_fires_202008/sentinel2/MapServer?f=json

looks like this

http://localhost:3030/proxy/https:/maps.disasters.nasa.gov/ags04/rest/services/ca_fires_202008/sentinel2/MapServer?f=json

Not sure why it's happening, but as a quick fix you can replace

req.url = req.url.replace('/proxy/', '/');

with

req.url = req.url.replace('/proxy/https:/', '/https://');

这篇关于CORS会在任何地方返回代理文本，而不是所需的目标资源的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！