我正在使用fetch polyfill和'no-cors'模式并获得响应状态0.在开发人员工具中,我可以看到响应具有所请求的数据.
客户端代码:
const BASE_CONFIG = {
credentials: 'include',
mode: 'no-cors'
};
let checkStatus = (response) => {
if (response.status >= 200 && response.status < 300) {
return response;
} else {
var error = new Error(response.statusText);
error.response = response;
throw error;
}
};
function GET(url, urlParams={}, config={}) {
let requestConfig = {
method: 'get'
};
Object.assign(requestConfig, BASE_CONFIG, config);
return fetch(url, requestConfig)
.then(checkStatus)
.then(parseJSON);
}
GET('http://other.domain,{})Beckend nodejs(Express.js)简化的响应处理程序:
function getData(req, res) {
var responseData = {data: 'test'};
res.header("Access-Control-Allow-Origin", "*"); …我正在尝试获取fetch API请求的重定向响应位置片段.但如果可能的话,我无法想象如何访问它.
上下文是我在隐式流中执行OpenID Connect请求,用于WebRTC Identity Proxy断言生成.OIDC规范将请求的答案定义为:
使用Implicit Flow时,所有响应参数都将添加到重定向URI的片段组件中
HTTP/1.1 302找到位置:https ://client.example.org/cb# access_token = SlAV32hkKG ...
所以我在手动模式下设置了获取请求.但响应是一个不透明的重定向过滤响应,它隐藏了位置标题.(https://fetch.spec.whatwg.org/#concept-filtered-response-opaque-redirect)
其他获取模式是错误,其后无效.虽然XHR会自动跟随重定向,但也无济于事.我可能会从fetch API中遗漏一些东西,但它似乎是故意隐藏的东西.
有人能给我一种方法来访问这些信息(或确认这是不可能的)？
是否有替代fetch和XHR来发出此请求,这将允许访问重定向位置标头？
我正在研究前端的Reactjs redux和后端的Rails api.
所以现在我用Fetch api方法调用api,但问题是我无法获得可读的错误信息,就像我在网络选项卡中得到的一样
这是我的功能
export function create_user(user,userInfoParams={}) {
return function (dispatch) {
dispatch(update_user(user));
return fetch(deafaultUrl + '/v1/users/',
{
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json'
},
method: "POST",
body: JSON.stringify(userInfoParams)
})
.then(function(response) {
console.log(response);
console.log(response.body);
console.log(response.message);
console.log(response.errors);
console.log(response.json());
dispatch(update_errors(response));
if (response.status >= 400) {
throw new Error("Bad response from server");
}
})
.then(function(json){
console.log("succeed json re");
// We can dispatch many times!
// Here, we update the app state with the results of the API call.
dispatch(update_user(json));
});
} …我正在使用fetch并将whatwg-fetchpolyfill包含在我的应用程序中.
我也TextDecoder按照Jake Archibald的博客中描述的那样使用了!解码响应,但我不确定使用什么polyfill.
(目前Safari抱怨ReferenceError: Can't find variable: TextDecoder)
我猜有一个polyfill TextDecoder,但我找不到它......
在chrome中,开发人员工具对于xhr请求(网络选项卡)的"重放xhr"非常有用.我已经开始在我的代码中使用fetch,并且chrome开发人员工具不允许"重放"获取请求,它怎么可能？难道我做错了什么？
我有点难过.我忘记了怎么做.我有一个名为ext.get()的函数,它接受url的参数.它从网址获取响应.ext.get()函数用于将响应作为json返回.我不认为这样做.
ext.get = (url) => {
let myHeaders = new Headers();
let options = {
method: 'GET',
headers: myHeaders,
mode: 'cors'
};
//fetch get
fetch(url, options).then(response => {
console.log(JSON.stringify(response.json()))
return JSON.stringify(response.json())
});
};
以最简单的方式使用fetch-API时,Chrome无法正确收集垃圾.难道我做错了什么？
for (i = 0; i < 100; i++) {
fetch('https://upload.wikimedia.org/wikipedia/commons/3/3d/LARGE_elevation.jpg')
.then(response => {
console.log('Memory-bloating')
})
}
https://jsfiddle.net/dozrpcvj/12/
这个JSFiddle用1.4GB填充内存,直到手动垃圾收集或关闭选项卡才会释放.如果你将迭代次数增加到1000,它"下载"14GB(来自自己的磁盘)而不是垃圾收集,它开始填充磁盘上的交换文件.
我做错了什么或这是Chrome中的错误？在使用Safari进行测试时,它还会使用1.4GB的硬盘驱动器,但一旦完成就会开始进行垃圾回收.
PS.您不能使用内存分析器,因为它告诉您只使用几MB的数据,即使活动监视器或Chromes自己的任务管理器说1.4GB.
我正在使用 fetch 使用 API，但收到 CORS 错误。我尝试了多个标题，但我不明白问题是什么。
我不是 API 的所有者，所以我无法更改它，但会检查它返回的响应access-control-allow-origin。
以下是我的请求方法：
export const execPOST = (url, body) => {
return fetch(url, {
method: "POST",
headers: {
"Access-Control-Allow-Origin": "*",
"Content-Type": "application/json"
},
body: JSON.stringify(body)
});
};
响应是：
Request URL: http://api
Request Method: OPTIONS
Status Code: 405 Method Not Allowed
Remote Address: ip
Referrer Policy: no-referrer-when-downgrade
Response Headers:
Access-Control-Allow-Origin: *
上面的回复还不足以满足我的请求吗？
控制台错误：
选项net::ERR_ABORTED 405（不允许方法）从源
http://api获取的访问已被 CORS 策略阻止：对预检请求的响应未通过访问控制检查：它没有 HTTP 正常状态。'http://api''http://localhost:3000'
我使用它来工作（同时开发）"https://cors-anywhere.herokuapp.com/"，但我不认为我应该将它用于生产环境。
我找到了很多关于这个问题的材料，但是除了实现后端来发出请求或使用其他东西作为代理来发出请求等等之外，没有任何其他有效的方法......
情况是这样的：我有证书、密钥、公钥和私钥。我正在构建一个与另一个系统集成的应用程序。我的系统是在 Azure 上运行的 Next.js 应用程序。它向在其他地方运行的外部服务器发出 API 请求。 我知道我的证书/密钥很好，因为当我使用 Insomnia API 客户端时请求有效（200 响应和数据返回）。
然而，尝试在 Node 中执行此操作时，我不断收到 400 错误。我尝试过使用核心fetch和https功能并使用该node-fetch包来做到这一点。我还查看了该request软件包（因为互联网上有这样的示例），但该软件包一年多前已被弃用，因此我认为不应使用它。
这是我尝试使用的一些代码的示例。我将证书/密钥存储/tmp/certs在我的本地系统上并且它们正在加载（我一直在大量记录）。我使用过各种不同的方法requestOptions，但似乎没有任何效果。
import fs from 'fs'
import fetch from 'node-fetch'
const requestOptions = {
method: 'GET',
port: 443,
cert: fs.readFileSync("/tmp/certs/ct.crt", 'utf-8'),
key: fs.readFileSync("/tmp/certs/ct.key", 'utf-8')
};
const res = await fetch("https://url.com?unique_ID=1234&key=abcd", requestOptions);
检查res总是会出现 400。此时我已经尝试了多种不同的方法。这看起来应该是一个微不足道的常见用例......我做错了什么以及我应该如何构建这个请求？
帮助我，Stack Overflow，你是我唯一的希望！
我正在使用 SWR 获取数据来填充表。我正在使用以下代码：
const { data: items, error } = useSWR(fetchAllItems.name, fetchAllItems)
fetcher 函数看起来像这样
async function fetchAllItems() {
const response = await fetch('http://localhost:3000/items')
const data = await response.json()
return data
}
该表还具有添加新项目的选项。创建新项目后，我调用 mutate 让 SWR 获取新数据。在开发模式下运行它时，一切都很好，但是当使用 next start 而不是 next dev 时，它不会获取数据。在网络选项卡中，它显示 0 个请求，因此看起来 fetcher 函数从未被调用。
获取数据的服务器运行正常。我已经使用邮递员对此进行了测试，它返回了所有项目。也可以从下一个应用程序访问它，因为创建新项目效果很好。
编辑：经过更多调试后，我将范围缩小到这样一个事实：当使用 next start 而不是 next dev 时，SWR 永远不会验证。
编辑2：可以在此处找到具有最小可重现示例的codesandbox https://codesandbox.io/s/elated-cherry-3ugqyi?file=/package.json。De Codesandbox 使用（调用下一个开发）运行程序npm run dev，因此一切正常。但是，当使用npm run build && npm run startuseSWR 运行它时，不再调用 fetcher 函数。
编辑3：我已经解决了这个问题，但不明白如何解决。我将 fetcher 函数更改为以下内容：
function fetchAllItems() …