[{"data":1,"prerenderedAt":767},["ShallowReactive",2],{"page:\u002Fextensions\u002Fkubb-labs\u002Fplugin-axios\u002Fguides\u002Fserialization":3},{"id":4,"title":5,"body":6,"description":749,"extension":757,"frontmatter":758,"heading":5,"meta":759,"navigation":760,"order":761,"path":762,"seo":763,"sitemap":764,"source":4,"stem":765,"__hash__":766},"extensions\u002Fextensions\u002Fkubb-labs\u002Fplugin-axios\u002Fguides\u002Fserialization.md","Configure serialization",{"type":7,"value":8,"toc":748},"minimark",[9,22,27,36,51,196,202,206,235,242,257,272,376,380,400,409,519,525,556,619,629,639,643,654,693,703,738],[10,11,12,13,17,18,21],"p",{},"The generated client encodes parameters using OpenAPI ",[14,15,16],"code",{},"style"," and ",[14,19,20],{},"explode",", serializes request bodies by content type, and decodes responses by media type. Each generated operation carries its parameter styles and content types, so most requests need no extra setup.",[23,24,26],"h2",{"id":25},"override-parameter-serialization","Override parameter serialization",[10,28,29,30,35],{},"Check the ",[31,32,34],"a",{"href":33},"https:\u002F\u002Fkubb.dev\u002Fdocs\u002F5.x\u002Freference\u002Fserialization#parameter-styles","default parameter styles and encoding"," before replacing a serializer.",[10,37,38,39,42,43,46,47,50],{},"Override ",[14,40,41],{},"serializer.query",", ",[14,44,45],{},".body",", or ",[14,48,49],{},".path"," on the client. Omitted functions retain their defaults:",[52,53,57],"pre",{"language":54,"code":55,"class":56},"typescript","import { client } from '.\u002Fgen\u002F.kubb\u002Fclient'\nimport qs from 'qs'\n\nclient.setConfig({\n  serializer: {\n    query: (params) => qs.stringify(params, { arrayFormat: 'brackets' }),\n  },\n})","highlights",[14,58,60,87,88,87,100,87,102,87,117,87,131,87,183,87,192],{"class":59},"language-typescript",[61,62,65,69,73,77,80,83],"span",{"class":63,"style":64},"line","display: inline",[61,66,68],{"style":67},"color:#d73a49;--hls-dark:#f97583","import ",[61,70,72],{"style":71},"color:#005cc5;--hls-dark:#79b8ff","{ ",[61,74,76],{"style":75},"color:#24292e;--hls-dark:#e1e4e8","client ",[61,78,79],{"style":71},"} ",[61,81,82],{"style":67},"from ",[61,84,86],{"style":85},"color:#032f62;--hls-dark:#9ecbff","'.\u002Fgen\u002F.kubb\u002Fclient'","\n",[61,89,90,92,95,97],{"class":63,"style":64},[61,91,68],{"style":67},[61,93,94],{"style":75},"qs ",[61,96,82],{"style":67},[61,98,99],{"style":85},"'qs'",[61,101],{"class":63,"style":64},[61,103,104,107,110,114],{"class":63,"style":64},[61,105,106],{"style":75},"client",[61,108,109],{"style":67},".",[61,111,113],{"style":112},"color:#6f42c1;--hls-dark:#b392f0","setConfig",[61,115,116],{"style":71},"({",[61,118,119,122,125,128],{"class":63,"style":64},[61,120,121],{"style":71},"  ",[61,123,124],{"style":71},"serializer",[61,126,127],{"style":67},": ",[61,129,130],{"style":71},"{",[61,132,133,136,139,141,144,147,150,153,156,158,161,163,165,167,169,172,174,177,180],{"class":63,"style":64},[61,134,135],{"style":71},"    ",[61,137,138],{"style":71},"query",[61,140,127],{"style":67},[61,142,143],{"style":71},"(",[61,145,146],{"style":75},"params",[61,148,149],{"style":71},") ",[61,151,152],{"style":67},"=> ",[61,154,155],{"style":75},"qs",[61,157,109],{"style":67},[61,159,160],{"style":112},"stringify",[61,162,143],{"style":71},[61,164,146],{"style":75},[61,166,42],{"style":67},[61,168,72],{"style":71},[61,170,171],{"style":71},"arrayFormat",[61,173,127],{"style":67},[61,175,176],{"style":85},"'brackets' ",[61,178,179],{"style":71},"})",[61,181,182],{"style":67},",",[61,184,185,187,190],{"class":63,"style":64},[61,186,121],{"style":67},[61,188,189],{"style":71},"}",[61,191,182],{"style":67},[61,193,194],{"class":63,"style":64},[61,195,179],{"style":71},[10,197,198,199,201],{},"A serializer set this way runs for every call, but you can pass ",[14,200,124],{}," on a single call to\noverride only that request.",[23,203,205],{"id":204},"encode-request-bodies","Encode request bodies",[10,207,208,209,212,213,216,217,212,220,223,224,42,226,42,228,42,231,234],{},"The request content type decides how the body is encoded. The default serializer handles the\ncommon types: a plain object becomes JSON, ",[14,210,211],{},"multipart\u002Fform-data"," becomes ",[14,214,215],{},"FormData",", and\n",[14,218,219],{},"application\u002Fx-www-form-urlencoded",[14,221,222],{},"URLSearchParams",". Binary and already-encoded bodies\n(",[14,225,215],{},[14,227,222],{},[14,229,230],{},"Blob",[14,232,233],{},"ArrayBuffer",", typed arrays, and strings) pass through\nuntouched.",[10,236,237,238,241],{},"When an operation declares a single request content type, Kubb sets it on the generated function,\nso you pass only the body. For an operation that accepts more than one, set ",[14,239,240],{},"contentType"," on the\ncall.",[243,244,246,247,249,250,253,254,256],"blockquote",{"as":245},"note","When the body is ",[14,248,215],{},", the runtime removes any ",[14,251,252],{},"Content-Type"," header so the transport sets\nit with the multipart boundary. You do not need to set ",[14,255,211],{}," yourself, and a\nvalue you set is dropped for that request.",[10,258,259,260,263,264,267,268,271],{},"To encode a content type the default serializer does not handle, register a codec for that media\ntype. ",[14,261,262],{},"codecs"," is keyed by content type. Each entry takes a ",[14,265,266],{},"serialize"," for the request body, a\n",[14,269,270],{},"deserialize"," for the response, or both:",[52,273,275],{"language":54,"code":274,"class":56},"import { client } from '.\u002Fgen\u002F.kubb\u002Fclient'\nimport { stringify } from 'yaml'\n\nclient.setConfig({\n  codecs: {\n    'application\u002Fyaml': { serialize: (body) => stringify(body) },\n  },\n})",[14,276,277,87,291,87,307,87,309,87,319,87,329,87,364,87,372],{"class":59},[61,278,279,281,283,285,287,289],{"class":63,"style":64},[61,280,68],{"style":67},[61,282,72],{"style":71},[61,284,76],{"style":75},[61,286,79],{"style":71},[61,288,82],{"style":67},[61,290,86],{"style":85},[61,292,293,295,297,300,302,304],{"class":63,"style":64},[61,294,68],{"style":67},[61,296,72],{"style":71},[61,298,299],{"style":75},"stringify ",[61,301,79],{"style":71},[61,303,82],{"style":67},[61,305,306],{"style":85},"'yaml'",[61,308],{"class":63,"style":64},[61,310,311,313,315,317],{"class":63,"style":64},[61,312,106],{"style":75},[61,314,109],{"style":67},[61,316,113],{"style":112},[61,318,116],{"style":71},[61,320,321,323,325,327],{"class":63,"style":64},[61,322,121],{"style":71},[61,324,262],{"style":71},[61,326,127],{"style":67},[61,328,130],{"style":71},[61,330,331,333,336,338,340,342,344,346,349,351,353,355,357,359,362],{"class":63,"style":64},[61,332,135],{"style":71},[61,334,335],{"style":85},"'application\u002Fyaml'",[61,337,127],{"style":67},[61,339,72],{"style":71},[61,341,266],{"style":71},[61,343,127],{"style":67},[61,345,143],{"style":71},[61,347,348],{"style":75},"body",[61,350,149],{"style":71},[61,352,152],{"style":67},[61,354,160],{"style":112},[61,356,143],{"style":71},[61,358,348],{"style":75},[61,360,361],{"style":71},") }",[61,363,182],{"style":67},[61,365,366,368,370],{"class":63,"style":64},[61,367,121],{"style":67},[61,369,189],{"style":71},[61,371,182],{"style":67},[61,373,374],{"class":63,"style":64},[61,375,179],{"style":71},[23,377,379],{"id":378},"decode-responses","Decode responses",[10,381,382,383,385,386,388,389,391,392,395,396,399],{},"The runtime reads the response ",[14,384,252],{}," and decodes the body by it: JSON is parsed, text\nstays a string, and a binary type becomes a ",[14,387,230],{},". The negotiated media type is on the result as\n",[14,390,240],{},", so a ",[14,393,394],{},"switch (result.contentType)"," narrows ",[14,397,398],{},"data"," for an operation that returns\nmore than one.",[10,401,402,403,405,406,408],{},"To decode a media type the runtime does not handle, register a codec's ",[14,404,270],{}," for it.\n",[14,407,270],{}," receives the raw body and the content type and returns the parsed value. It runs\nbefore validation, so the schema checks the parsed value:",[52,410,412],{"language":54,"code":411,"class":56},"import { client } from '.\u002Fgen\u002F.kubb\u002Fclient'\n\nclient.setConfig({\n  codecs: {\n    'application\u002Fxml': { deserialize: (raw) => new DOMParser().parseFromString(raw as string, 'application\u002Fxml') },\n  },\n})",[14,413,414,87,428,87,430,87,440,87,450,87,507,87,515],{"class":59},[61,415,416,418,420,422,424,426],{"class":63,"style":64},[61,417,68],{"style":67},[61,419,72],{"style":71},[61,421,76],{"style":75},[61,423,79],{"style":71},[61,425,82],{"style":67},[61,427,86],{"style":85},[61,429],{"class":63,"style":64},[61,431,432,434,436,438],{"class":63,"style":64},[61,433,106],{"style":75},[61,435,109],{"style":67},[61,437,113],{"style":112},[61,439,116],{"style":71},[61,441,442,444,446,448],{"class":63,"style":64},[61,443,121],{"style":71},[61,445,262],{"style":71},[61,447,127],{"style":67},[61,449,130],{"style":71},[61,451,452,454,457,459,461,463,465,467,470,472,474,477,480,483,485,488,490,493,496,499,501,503,505],{"class":63,"style":64},[61,453,135],{"style":71},[61,455,456],{"style":85},"'application\u002Fxml'",[61,458,127],{"style":67},[61,460,72],{"style":71},[61,462,270],{"style":71},[61,464,127],{"style":67},[61,466,143],{"style":71},[61,468,469],{"style":75},"raw",[61,471,149],{"style":71},[61,473,152],{"style":67},[61,475,476],{"style":67},"new ",[61,478,479],{"style":112},"DOMParser",[61,481,482],{"style":71},"()",[61,484,109],{"style":67},[61,486,487],{"style":112},"parseFromString",[61,489,143],{"style":71},[61,491,492],{"style":75},"raw ",[61,494,495],{"style":67},"as ",[61,497,498],{"style":75},"string",[61,500,42],{"style":67},[61,502,456],{"style":85},[61,504,361],{"style":71},[61,506,182],{"style":67},[61,508,509,511,513],{"class":63,"style":64},[61,510,121],{"style":67},[61,512,189],{"style":71},[61,514,182],{"style":67},[61,516,517],{"class":63,"style":64},[61,518,179],{"style":71},[10,520,521,522,524],{},"Like the other config, ",[14,523,262],{}," can also be passed on a single call, and a per-call entry merges\nover the client one for that content type.",[10,526,527,528,530,531,534,535,42,538,541,542,42,545,42,548,551,552,555],{},"When the runtime picks the wrong parse mode because a response omits its ",[14,529,252],{}," or sets a\nmisleading one, force the mode with ",[14,532,533],{},"responseType"," on the call. It accepts ",[14,536,537],{},"'json'",[14,539,540],{},"'text'",",\n",[14,543,544],{},"'blob'",[14,546,547],{},"'arraybuffer'",[14,549,550],{},"'document'",", and ",[14,553,554],{},"'formdata'",":",[52,557,559],{"language":54,"code":558,"class":56},"const { data } = await downloadInvoice({ path: { id: '123' }, responseType: 'blob' })\n\u002F\u002F data is a Blob even when the server leaves Content-Type unset",[14,560,561,87,613],{"class":59},[61,562,563,566,568,571,573,576,579,582,585,588,590,592,595,597,600,602,604,606,608,611],{"class":63,"style":64},[61,564,565],{"style":67},"const ",[61,567,72],{"style":71},[61,569,570],{"style":75},"data ",[61,572,79],{"style":71},[61,574,575],{"style":67},"= ",[61,577,578],{"style":67},"await ",[61,580,581],{"style":112},"downloadInvoice",[61,583,584],{"style":71},"({ ",[61,586,587],{"style":71},"path",[61,589,127],{"style":67},[61,591,72],{"style":71},[61,593,594],{"style":71},"id",[61,596,127],{"style":67},[61,598,599],{"style":85},"'123' ",[61,601,189],{"style":71},[61,603,42],{"style":67},[61,605,533],{"style":71},[61,607,127],{"style":67},[61,609,610],{"style":85},"'blob' ",[61,612,179],{"style":71},[61,614,615],{"class":63,"style":64},[61,616,618],{"style":617},"color:#6a737d;--hls-dark:#6a737d","\u002F\u002F data is a Blob even when the server leaves Content-Type unset",[10,620,621,625,626,109],{},[31,622,624],{"href":623},"https:\u002F\u002Fkubb.dev\u002Fextensions\u002Fkubb-labs\u002Fplugin-axios\u002Fguides\u002Fserver-sent-events","Server-sent events"," covers ",[14,627,628],{},"responseType: 'stream'",[10,630,631,632,17,634,636,637,109],{},"For bidirectional formats, supply both ",[14,633,266],{},[14,635,270],{}," in the media type codec, then set the operation's request and response ",[14,638,240],{},[23,640,642],{"id":641},"validate-responses","Validate responses",[10,644,645,646,649,650,653],{},"Enable ",[14,647,648],{},"validator"," on the client plugin and register ",[14,651,652],{},"pluginZod"," in the same configuration. Validation is disabled by default.",[52,655,657],{"language":54,"code":656,"class":56},"import { pluginAxios } from '@kubb\u002Fplugin-axios'\n\npluginAxios({ validator: 'zod' })",[14,658,659,87,675,87,677],{"class":59},[61,660,661,663,665,668,670,672],{"class":63,"style":64},[61,662,68],{"style":67},[61,664,72],{"style":71},[61,666,667],{"style":75},"pluginAxios ",[61,669,79],{"style":71},[61,671,82],{"style":67},[61,673,674],{"style":85},"'@kubb\u002Fplugin-axios'",[61,676],{"class":63,"style":64},[61,678,679,682,684,686,688,691],{"class":63,"style":64},[61,680,681],{"style":112},"pluginAxios",[61,683,584],{"style":71},[61,685,648],{"style":71},[61,687,127],{"style":67},[61,689,690],{"style":85},"'zod' ",[61,692,179],{"style":71},[10,694,695,698,699,702],{},[14,696,697],{},"'zod'"," validates the success response body, and the error body when a non-2xx call does not\nthrow. Use the object form to opt in per direction, where ",[14,700,701],{},"request"," validates the request\nbody before the call goes out:",[52,704,706],{"language":54,"code":705,"class":56},"pluginAxios({ validator: { request: 'zod', response: 'zod' } })",[14,707,708],{"class":59},[61,709,710,712,714,716,718,720,722,724,726,728,731,733,735],{"class":63,"style":64},[61,711,681],{"style":112},[61,713,584],{"style":71},[61,715,648],{"style":71},[61,717,127],{"style":67},[61,719,72],{"style":71},[61,721,701],{"style":71},[61,723,127],{"style":67},[61,725,697],{"style":85},[61,727,42],{"style":67},[61,729,730],{"style":71},"response",[61,732,127],{"style":67},[61,734,690],{"style":85},[61,736,737],{"style":71},"} })",[10,739,740,741,744,745,109],{},"With a validator set, Kubb passes the matching schema to each generated call, and the runtime\nparses the body through it. A body that does not match throws a ",[14,742,743],{},"ParseError"," with the schema's\n",[14,746,747],{},"issues",{"title":749,"searchDepth":750,"depth":750,"links":751},"",5,[752,754,755,756],{"id":25,"depth":753,"text":26},2,{"id":204,"depth":753,"text":205},{"id":378,"depth":753,"text":379},{"id":641,"depth":753,"text":642},"md",{},{},true,null,"\u002Fextensions\u002Fkubb-labs\u002Fplugin-axios\u002Fguides\u002Fserialization",{"title":5},{"loc":762},"extensions\u002Fkubb-labs\u002Fplugin-axios\u002Fguides\u002Fserialization","zYFDARzvAb9ALu-_232to1iTHPWY8iOkjcF4Ap0I5JE",1792868502119]