我有一个问题,一直困扰我近1个月。我会诚实,我不是前端开发人员。所以这里的问题。
我有一个Azure API管理,它 Package 了第三方Map提供程序。该APIM由React.js + Axios开发的前端使用。每次前端调用 Package 了Azure APIM的API时,都会导致详细信息的错误:
x1c 0d1x的数据
的
的
CORS策略已阻止访问位于 [APIM URL] 从源 [FE ORIGIN] 的XMLHttpRequest:所请求的资源上不存在“控制-允许-源”标头。
以下是我在all操作上实现的Azure APIM策略:
<policies>
<inbound>
<base />
<cors allow-credentials="false">
<allowed-origins>
<origin>[FE ORIGIN]</origin>
<origin>http://localhost:3000/</origin>
<origin>http://localhost:3001/</origin>
</allowed-origins>
<allowed-methods preflight-result-max-age="300">
<method>GET</method>
<method>POST</method>
<method>DELETE</method>
<method>OPTIONS</method>
<method>PUT</method>
</allowed-methods>
<allowed-headers>
<header>content-type</header>
<header>accept</header>
<header>transactionId</header>
<header>authorization</header>
<header>userId</header>
<header>oid</header>
<header>userRoles</header>
</allowed-headers>
</cors>
</inbound>
<backend>
<base />
</backend>
<outbound>
<base />
<set-header name="Access-Control-Allow-Origin" exists-action="override">
<value>@(context.Request.Headers.GetValueOrDefault("Origin",""))</value>
</set-header>
<set-header name="Access-Control-Allow-Credentials" exists-action="override">
<value>false</value>
</set-header>
</outbound>
<on-error>
<base />
</on-error>
</policies>
字符串
下面是Axios代码的一部分:
const handleSearch = useMemo(() => {
const searchHandler = (value: string) => {
if (value.length >= DELAY_CHAR) {
const searchUrl = `${BASE_URL}?q=${value}&at=-0.789275,113.921327&limit=${MAX_ROW}`;
axios
.get(searchUrl)
.then((res) => {
const { items } = res.data;
if (items && items.length > 0) {
const opts: Opts[] = [];
items.forEach((r) => {
opts.push({
position: r.position,
value: r.address.label,
});
});
setOptions(opts);
}
})
.catch(() => {
return null;
});
}
};
return debounce(searchHandler, DELAY_IN_MS);
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [DELAY_IN_MS]);
型
我已经尝试了许多选项,甚至在新创建的API中 Package 第三方API。所以我的任何帮助对我来说都意义重大。非常感谢您之前,我希望信息足够。
1条答案
按热度按时间8tntrjer1#
所以,经过几个小时的尝试和错误,我们终于找到了根本原因。注意
<inbound>
部件上的<base />
,我们删除了该部件和viola,它成功了。老实说,我不明白为什么,但它解决了这个问题。下面是最终的入站策略:字符串