Typescript fetch()的标头类型？
Typescript fetch()的标头类型是Headers。
Headers是一个内置的浏览器 API，用于表示和操作 HTTP 请求或响应的头部信息。它提供了一组方法来添加、获取、删除和遍历头部字段。
Headers的分类：
- 请求头部：包含了客户端向服务器发送请求时的信息，如User-Agent、Accept、Content-Type等。
- 响应头部：包含了服务器返回给客户端的响应信息，如Content-Type、Content-Length、Cache-Control等。
- 通用头部：既可以出现在请求头部中，也可以出现在响应头部中，如Date、Connection、Content-Encoding等。
Typescript中使用fetch()方法发送HTTP请求时，可以通过Headers对象来设置请求的头部信息。可以使用Headers的构造函数来创建一个新的Headers对象，并使用其方法来添加、获取和删除头部字段。
示例代码：
const headers = new Headers();
headers.append('Content-Type', 'application/json');
headers.append('Authorization', 'Bearer token');
fetch('https://api.example.com', {
method: 'POST',
headers: headers,
body: JSON.stringify({ data: 'example' })
})
.then(response => response.json())
.then(data => console.log(data))
.catch(error => console.error(error));在上述示例中，我们创建了一个Headers对象，并使用append()方法添加了两个头部字段：Content-Type和Authorization。然后，我们使用fetch()方法发送了一个POST请求，并将headers对象传递给请求的headers参数。
Headers的应用场景：
- 设置请求的Content-Type，指定请求的数据格式。
- 添加身份验证信息，如Authorization头部字段。
- 控制缓存行为，如Cache-Control头部字段。
- 设置跨域请求的CORS（跨源资源共享）相关头部字段。
腾讯云相关产品和产品介绍链接地址：
- 云服务器（CVM）：https://cloud.tencent.com/product/cvm
- 云数据库 MySQL 版：https://cloud.tencent.com/product/cdb_mysql
- 云原生容器服务（TKE）：https://cloud.tencent.com/product/tke
- 人工智能平台（AI Lab）：https://cloud.tencent.com/product/ailab
- 物联网开发平台（IoT Explorer）：https://cloud.tencent.com/product/iothub
- 移动推送服务（信鸽）：https://cloud.tencent.com/product/tpns
- 对象存储（COS）：https://cloud.tencent.com/product/cos
- 区块链服务（TBC）：https://cloud.tencent.com/product/tbc
- 腾讯云游戏引擎（GSE）：https://cloud.tencent.com/product/gse
- 腾讯云直播（CSS）：https://cloud.tencent.com/product/css
相关·内容
1回答
我使用Typescript Fetch包装器来做post和get请求，并在post时获取空对象(get工作得很好)(在我使用Vanilla Js之前，一切都工作得很好) Nodejs： const express = require('express');
const fs = require('fs');
const app = express();
app.use(function (req, res, next) {
res.header('Access-Control-Allow-Origin', '*');
浏览 62提问于2021-10-31得票数 0
回答已采纳
我想将content-type强制转换为application/json，但是我有一个"no-cors“模式，实际上content-type的返回值是: text/plain;charset=UTF-8当我传递头文件时它是一样的，所以我不知道该怎么做。 我已经尝试过使用fetch或Axios，URL是HTTP格式的，而我在本地工作，所以这可能是问题所在？我已经试过Postman了，效果很好。 fetch('http://link', {
method: 'POST',
credentials:
浏览 41提问于2019-04-24得票数 3
我有以下代码，运行良好：
import {inject} from 'aurelia-framework';
import {HttpClient, json} from 'aurelia-fetch-client';
@inject(HttpClient)
export class Items {
heading = 'Items';
apiKey = "";
constructor(http) {
http.configure(config => {
config
.
浏览 2提问于2015-12-07得票数 12
回答已采纳
1回答
我知道有很多CORS的帖子和解决方案，我已经看了很多遍了。没有运气在几个小时后解决我的CORS问题，我决定在这里发布:)
我的客户端角方法导入并初始化了包
...import { AngularFireFunctions } from "@angular/fire/functions";
constructor(...
private afn: AngularFireFunctions,
) {}
initCloudFunctions() {
let cmd = "helloWorld";
const callable = t
浏览 3提问于2020-04-12得票数 1
1回答
我正在尝试接收带有"Content-Type":"text/css".but的报头，我得到的响应是"text/plain“。这是我的代码
addEventListener('fetch', event => {
event.respondWith(handleRequest(event.request))
})
async function handleRequest(request) {
return new Response('body{display:none}', {status: 200},{
浏览 0提问于2020-09-23得票数 1
我想了解为什么AngularJS $http服务不能工作，fetch API也能工作。
下面是AngularJS代码：
const $http = angular.element(document.body).injector().get('$http')
$http({
method: 'GET',
url: 'http://192.168.1.126:8080/saiku/rest/saiku/admin/datasources/',
headers: {
'Authorization': 'Bas
浏览 0提问于2018-05-02得票数 0
1回答
以下是我要做的事：
我使用Ajax调用从数据库中选择消息，响应PHP中的内容，并尝试在Ajax成功时获得回显的html。但不起作用。这是密码。
JQUERY:
function SelectMessages()
{
console.log("Selecting messages");
console.log("Talk = " + talk);
$.ajax({
url: "select_messages.php",
type: "GET",
data:
浏览 4提问于2016-06-29得票数 1
回答已采纳
1回答
我使用一个公共请求库node-fetch来获取大量文档，包括文档。但couchDB服务器返回状态代码415 (不支持的媒体类型)。请求中的错误是什么？ 是否不允许包含文档？身体是不是不正确？还有别的吗？ public getDocuments(databaseName: string, ids: string[]): Promise<ICouchDBDocumentDoc[]> {
return fetch(`${this.baseUrl}/${databaseName}/_bulk_get?include_docs=true`, {
headers: t
浏览 17提问于2019-09-19得票数 0
1回答
我希望将“数据”列表从我的javascript传递到python应用程序，而不是使用列表"Data“来发送JavaScript代码
function fetch()
{
var jsonObj={'email':"testuser4@test.tld",'Data': ['Name','Phone']};
$.ajax({
url:'http://192.168.56.102:5000/fetch',
浏览 2提问于2017-04-13得票数 0
回答已采纳
1回答
你好，亲爱的苏社区。
我有一个问题，折磨了我几个月，却没有解决办法。
我试图在HTTP/2端点上发出请求，该端点使用一些以冒号开头的头。示例：
:method: "POST"
我尝试过python(hyper，requests)、php(guzzle)和js(fetch)。据推测，我已经使用js实现了所需的结果，但是CORS策略返回给我一个“不透明”的结果。
任何帮助都会很棒的！
JS结果假定正确的“不透明”
fetch("https://www.example.com/users/sign_in",
{
"cred
浏览 3提问于2019-08-13得票数 11
我构建了一个GraphQL服务器，如下所示，
import express from 'express';
import graphqlHTTP from 'express-graphql';
import { schema } from './data/schema';
const app = express();
app.use(express.static(__dirname + '/public'));
app.get('/', function(req, res) {
res.sendFile(&
浏览 1提问于2018-10-20得票数 1
回答已采纳
我试图编码POST REST请求，如上面的邮递员截图所示。
这是我的代码：
import { fromFetch } from 'rxjs/fetch';
import { switchMap } from 'rxjs/operators';
interface FetchRequest<TBody> {
method?: FetchMethod;
body?: TBody;
headers?: FetchHeaders;
isBlobRequest?: boolean;
}
export const req
浏览 3提问于2022-06-26得票数 0
回答已采纳
我有一个API端点，我从我的React应用程序中调用。API在同一个域上。类似于：
https://www.example.com
https://www.example.com/api/update-something
我使用cross-fetch来执行这个请求。
我本来希望在我的服务器日志上看到一个Origin头。事实上，我本来希望看到Origin: https://www.example.com的。
但我得到的是：
Origin: undefined
// AND I ALSO GET THESE HEADERS
"sec-fetch-dest":"empty
浏览 5提问于2021-02-09得票数 6
回答已采纳
1回答
我创建了一个非常基本的服务工作者，它记录fetch事件上的请求头：
self.addEventListener('fetch', event => {
console.log("- Fetch -");
for (const pair of event.request.headers.entries()) {
console.log(pair[0]+ ': '+ pair[1]);
}
});
在主页上，我获取的页面如下所示：
function fetchPage() {
fetch(location.href);
浏览 6提问于2019-11-28得票数 6
回答已采纳
正如标题中所示，我正在尝试使用以下命令将文件上传到Spring Rest控制器： handleOnChange() {
let inputFile = document.getElementById("file-input");
this.file.file = inputFile.files[0];
this.file.filename = inputFile.value;
}
render() {
return (
<div className="file-input">
浏览 110提问于2021-10-13得票数 1
我有一个小脚本，从数据库读取数据，阵列他们，并保存为.txt文件。最后，用户被重定向到该文件。现在，当用户被重定向到.txt文件下载框出现时，如何实现？
<?php
// Preden zacnemo, dobi novico iz baze!
$MOD_NEWS_SAVETXT_getnews = mysql_query("SELECT * FROM NEWS WHERE NEWSid = '{$_GET['id']}'") or die(mysql_error());
// Nardimo while in priredimo
浏览 4提问于2009-08-06得票数 3
CSV文件中的所有行都转换为JSON对象，这些对象被添加到结果数组中，然后将数组转换为JSON，并生成相应的JSON输出文件。
我得到TS错误：
TypeScript error: Type 'undefined' cannot be used as an index type. TS2538
/* Empty object to store result in key value pair */
const jsonObject = {};
/* Store the current array element */
浏览 3提问于2022-05-05得票数 1
我正在使用React，Typescript和一个自制的RESTapi。
我试图从React中的客户端向我的应用程序接口发出PUT请求，但我一直收到错误消息"SyntaxError:意外的token B in JSON at position 0“。对API的PUT调用不包含主体，也不应该包含主体，这是因为我在api中创建请求的方式。我已经确认fetch中的url是正确的，并且当直接在我的API中测试它时，API调用工作得很好。因此，问题似乎出在我在客户端进行PUT调用的方式上
下面是我的客户的PUT调用。
提前谢谢你！
function putProductInBasket(id:
浏览 23提问于2021-05-22得票数 0
我正在尝试将一个小型FastAPI web应用程序从JQuery AJAX转换为获取API。
AJAX调用向服务器发送一些JSON，服务器通过后端的一个函数运行。原始的JQuery代码如下所示：
static run_task_one(E1, E2, E3, n1, n2, success, error) {
$.ajax({
url: "/run/task/one",
type: "POST",
data: JSON.stringify({
浏览 4提问于2022-10-05得票数 1
我对来自服务工作者的fetch请求和来自常规脚本的fetch请求之间的区别感到困惑。
我添加了一个服务工作者来拦截链接到另一个域上的mp3的音频元素发出的请求，但是请求失败了，因为印前检查请求不成功。但是，如果我从脚本发出相同的请求，它看起来是成功的，因为没有发出任何印前检查请求。
以下是上述问题的一个故障示例：
代码在这里：
相关代码摘录如下：
--index.html--
...
<audio src="https://traffic.libsyn.com/thefeed/126_thefeed.mp3?dest-id=149503" crossorigin="
浏览 0提问于2018-08-23得票数 3
我不知道这里是否讨论过这个问题，但有些事情是奇怪的。我在Windows 10中运行这个版本的Chrome : 86.0.4240.198 (官方版本)(64位)
我有一个域，比如p.com，它正在从Google中获取一个PDF文件，它的网址如下：
已经有这样的CORS设置：
[{"maxAgeSeconds": 3600, "method": ["GET", "HEAD", "OPTIONS"], "origin": ["*"], "responseHeader":
浏览 1提问于2020-12-08得票数 0
回答已采纳
我有以下脚本：
$("#spid").blur(function() {
$.ajax({
url: 'getsponsor.php',
type: "POST",
dataType:'json',
data: ({ spid: $("#spid").val() }) ,
contentType: 'application/json; charset=utf-8',
success: function (re
浏览 1提问于2018-08-31得票数 0
回答已采纳
1回答
我正在尝试开发一个将JSON数据发送到PHP服务器并从中获取响应的应用程序。为此，我使用了JavaScript 库。
下面是我的示例代码：
const fetch = require("node-fetch");
let data = JSON.stringify(something);
fetch("https://example.com/api", {
method: "post",
body: data,
headers: { 'Content-Type
浏览 4提问于2020-06-01得票数 0
回答已采纳
我正在使用Quagga JS扫描仪，并尝试获取由barcode.monster应用程序接口操作产生的条形码。
但我收到一个名为"opaque“的错误，状态为0。知道这是什么吗？
网址：
Quagga.onDetected(function(data) {
// //Once barcode detecterd, fetch from barcode.monster
fetch('https://barcode.monster/api/' + data.codeResult.code, {
mode: 'no-cors',
headers
浏览 0提问于2021-08-25得票数 0
1回答
使用角js读取sql数据
、、、
我试图从sql表中读取数据的角度，似乎找不到我的问题，因为我的调试器不认识它，附加是html和php文件正在使用，任何这里将非常感谢。以下是代码：
HTML+JS
<div ng-app="" ng-controller="customersController" class="container">
<p><input type="text" ng-model="name" class="form-control"></p>
<tabl
浏览 3提问于2014-09-16得票数 0
1回答
我尝试使用HTMLUnit进行解析。我创建了web客户端：
val webClient = WebClient(BrowserVersion.FIREFOX);
webClient.addRequestHeader("X-Requested-With", "XMLHttpRequest")
webClient.addRequestHeader(
"User-Agent",
"Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/
浏览 3提问于2022-08-04得票数 0
1回答
我正在尝试从我的React应用程序上传图像文件。继续犯400个错误，我不明白为什么。这是我的TypeScript函数的React代码：
public setImage = (args: ChangeEvent<HTMLInputElement>) => {
const image = args.target.files[0];
let formData: FormData = new FormData();
formData.append("profileImage", image, image.name
浏览 6提问于2020-10-28得票数 0
我使用以下代码来请求该文件：
function getData(imageEndpoint) {
return fetch(imageEndpoint, {
mode: 'cors'
})
.then(response => {
console.log(response);
})
.then(data => {
if (!('caches' in window)) {
return caches.open(cacheName)
.then(cache =&
浏览 0提问于2018-05-12得票数 0
7回答
我在Google扩展中，拥有"*://*/*"的权限，我正在尝试从XMLHttpRequest切换到。
扩展存储用户输入登录数据，这些数据曾经直接放入XHR对HTTP的open()调用中，但是在Fetch下不能再直接用作参数。对于HTTP，绕过这一限制非常简单，因为您可以手动设置授权头：
fetch(url, {
headers: new Headers({ 'Authorization': 'Basic ' + btoa(login + ':' + pass) })
} });
然而，需要更多的交互性；您需要读取服务器发
浏览 4提问于2017-04-11得票数 127
回答已采纳
我正在尝试通过fetch请求从我的服务器发送一些头到我的前端。
在控制器函数中，我显式地发送了一些报头，如下所示：
exports.getItems = async (ctx) => {
ctx.set('Search-type', 'category');
};
在postman中，当我向我的服务器发出get请求时，我会得到以下标头：
Connection →keep-alive
Content-Length →6442
Content-Type →application/json; charset=utf-8
Date →Thu, 19
浏览 4提问于2018-04-20得票数 0
1回答
我有一个基本的Netlify表单()，它包含name、email和message字段。具有以下提交功能：
const handleSubmit = event => {
event.preventDefault();
const data = {};
const scopedForm = [...formState];
let isValidForm = validateForm(scopedForm);
setFormState([...scopedForm]);
if (!isValidForm) return false;
浏览 4提问于2020-07-24得票数 2
回答已采纳
1回答
我试图通过从flipkart获取python请求获取一个pdf流。但在运行label.status_code时，我将得到415。
我的代码：
class FlipkartAPI:
def __init__(self, token):
self.token = token
self.session = self.get_session()
def get_session(self):
session = requests.Session()
session.headers.update({'Authoriz
浏览 3提问于2015-08-11得票数 1
回答已采纳
每当请求出现时，我都会从Node.js服务器发送大量数据。使用快车。
router.post('/api/test', (req, res) => {
console.log("Started api servicing");
let interval = setInterval(() => {
res.write("Message");
}, 500);
setTimeout(() => {
clearInterval(interval);
re
浏览 4提问于2019-12-13得票数 1
1回答
我被困在这个基本的CORS问题上，但似乎没有任何帮助。
在无服务器CORS生存指南()中尝试一切
在无服务器离线环境下一切正常工作
在这里，我得到了相同的所有预期响应头。
浏览器中的错误-
访问从源获取'‘'’已被CORS策略阻止:请求头字段访问-控制-允许-原产地不允许访问-控制-允许-头在飞行前响应中。
我的设置->
我正在使用这个样板->
Serverless.yml-
provider:
name: aws
runtime: nodejs16.x
memorySize: 512
timeout: 30
enviro
浏览 8提问于2022-07-04得票数 -2
回答已采纳
我有一个为mywebsite.com和app.mywebsite.com服务的rails API，它配置了rack-cors，允许我从两者发出请求。应用编程接口位于api.mywebsite.com。 如果我从mywebsite.com调用端点，一切都会正常工作。但是，如果我随后从app.myswebsite.com发出相同的调用，则会得到错误： Access to fetch at 'https://api.mywebsite.com/api/v1/endpoint' from origin 'https://app.mywebsite.com' has b
浏览 75提问于2021-10-22得票数 1
回答已采纳
我在使用javascript fetch的GET或POST请求上遇到CORS头fetch的问题
Access to fetch at 'https://192.168.1.77/api/contract/list' from origin 'https://192.168.1.77:8090' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque resp
浏览 16提问于2022-02-04得票数 -1
我刚开始使用react，我正在尝试向API端点发出post请求。我在端点url的package.json中设置了代理，下面是fetch函数：
const requestOptions = {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify({
username: username,
password: password,
}),
};
const res = await fet
浏览 0提问于2020-07-28得票数 1
我搜索了几个小时，但是Apache似乎没有解决我的需求的方法。我需要检查请求头是否存在，并根据它来定义重写规则。我可以检查头值是否为空，但如果报头不存在，则该条件不考虑报头的存在。我已经尝试过if else指令，但也没有成功，因为Apache似乎只关注于它的值。
如果标头值为空，但如果这些标头不存在，则此操作无效。
RewriteCond %{HTTP:Sec-Fetch-Dest} ^$ [NC]
RewriteCond %{HTTP:Sec-Fetch-Mode} ^$ [NC]
RewriteCond %{HTTP:Sec-Fetch-Site} ^$ [NC]
RewriteCond
浏览 5提问于2022-09-07得票数 2
嗨，我有这个PHP代码(自定义脚本)来查询来自RightNow事件的FileAttachment网址，
<?php
define("CUSTOM_SCRIPT", true);
define(DEBUG, false);
define(COMMIT, true);
ini_set('display_errors',1);
error_reporting(E_ALL ^ E_NOTICE);
$ip_dbreq = true;
require_once( get_cfg_var("doc_root")."/ConnectPHP/Co
浏览 27提问于2017-03-08得票数 0
我有行动
export function searchInWiki(search) {
const myRequest = new Request(API_URL + search);
const myInit = {
method: 'POST',
mode: 'cors',
headers: {
'Access-Control-Allow-Origin':'*',
'Content-Type':'multipart/form-data',
'Access-
浏览 0提问于2016-12-09得票数 1
我已经创建了一个App (WASM)作为一个PWA。
它配置为HTTPS和，而不是托管的 ASP.NET Core。
我使用的代码在控制台版本中进行了测试，运行良好。
public void PostOnApi()
{
HttpClient httpClient = new HttpClient();
httpClient.DefaultRequestHeaders.Clear();
httpClient.DefaultRequestHeaders.Add("Accept", "application/json");
var by
浏览 2提问于2022-05-02得票数 0
我试图使用表单数据发出post请求，其中包含一个文件和一个Json对象。
为此，我将Content-Type设置为未定义的，根据下面的post
这将导致浏览器将内容类型设置为多部分/窗体数据，并正确填充边界。
但是，在(springboot)服务器端，我得到以下错误消息：
解决了由Handler执行引起的异常: org.springframework.web.HttpMediaTypeNotSupportedException：无效mime类型“未定义”：不包含'/'
因此，浏览器似乎不能正确地管理“未定义”内容类型。
下面是客户端的fetch命令：
浏览 1提问于2018-03-26得票数 1
回答已采纳
当'body‘部分填入适当的参数时，对Django Rest API框架的post请求通过Postman工作。但这不适用于以下JavaScript代码： var data = {emp_id:50,emp_name:'test',password:'pass123'};
fetch('http://127.0.0.1:8000/signup/',{
method:"POST",
body: JSON.stringify(data),
mode:"no-cors",
浏览 11提问于2019-02-22得票数 3
1回答
为什么某些获取请求要求您不仅包括一个URL，还需要包含一个具有属性(如方法或头)的对象？
似乎每次遇到这种情况，方法属性值总是被设置为'POST‘。是否有这种情况是不正确的？标题在幕后做什么？
fetch('https://.....', {
method: 'POST',
headers: {
'example': 'example',
'example2': 'example2'
}
}) ....
浏览 21提问于2022-04-24得票数 0
回答已采纳
1回答
我正在为我的公司的内部使用设置一个PWA。我应该使用什么方法将承载令牌附加到dom或web工作者的所有请求中。
我正在使用的这个方法在发布form或json时会像预期的那样工作，但是我想要一个更干净或更友好的方法，因为我不相信text回退就足够了。
我在谷歌的workbox.js服务工作者模块中寻找一个函数，看看是否可以设置一个拦截，在向我的服务器发出请求时总是附加Bearer，因为这将解决我为什么在这里结束的问题。此代码基于。没有什么需要获取和重新添加到新请求中的post数据，从而有效地删除了整个POST体。
这就是我最后得到的代码。
self.addEventListener( '
浏览 1提问于2019-02-11得票数 7
回答已采纳
我正在使用PHP和JQUERY菜单的混合，现在我试图实现一个CMS后端系统，当我离开我的公司陪产假。
到目前为止，我有5部分代码：
它有"0“，因为NULLSub-Header，是headerVisible，，它列出了来自父类别的ID，并且URL不是空的链接，这有"0”，因为SubID和URL不是空的，但是对于CSS看起来像headerVisible，，这要么是1，要么是0，如果记录显示或不显示顺序，这就按记录的升序来计算。
因此，我需要SQL来读取数据库的每一行(TinyINT，所以只有大约10条记录)，并决定该行是标头、子头还是链接。
我可以让数据库找到所有的标题，然后将子
浏览 1提问于2011-08-21得票数 0
1回答
我有一个webapp react.js / redux / webpackt / es6...和来自gorilla的go中的多路复用的api。
当我调用下面的函数时，我的头也是空的，内容也是。
我在我的webapp应用程序中使用这个包进行呼叫
"isomorphic-fetch": "^2.2.1",
我的呼叫示例
export function Login(userData) {
return dispatch => {
fetch(API + '/login', {
method: 'post',
浏览 0提问于2016-02-06得票数 6
我正在尝试使用Lambda函数来获取网页，然后同时返回内容和响应头。下面是我的代码，当被Gateway API触发时总是返回“内部服务器错误”，我对如何构造response对象感到困惑，它似乎没有任何关于它的文档。任何点击都是高度赞赏的！
const fetch = require('node-fetch');
exports.handler = async (event) => {
// TODO implement
let r = await fetch('http://www.google.com');
let buffer
浏览 11提问于2020-06-05得票数 1
回答已采纳
我有以下代码:
const formdata = new FormData();
formdata.append("image", {
uri: this.state.photoUri,
type: 'image/jpeg',
name: 'imageddd.jpeg',
});
await fetch('https://mysite/upload.php',{
method: 'post',
headers: {
浏览 1提问于2020-04-19得票数 0
2回答
<?php
$result = mysqli_query($con, "SELECT * FROM cse");
$mail_data = "";
while ($row = mysqli_fetch_array($result)) {
$Hallticket_No = $row['Hallticket No'];
$Name = $row['Name'];
$Email_ID = $row['Email-ID'];
$Jntu
浏览 0提问于2013-06-28得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
即时通信 IM活动推荐
腾讯云开发者
