JavaScript/jQuery FileUploader - Specify a Header for the Request
Use the uploadHeaders property to specify a header for the request.
jQuery
JavaScript
$(function() { $("#file-uploader").dxFileUploader({ // uploadHeaders: { YourHeaderName: "YourHeaderValue" } }); });
Angular
app.component.html
app.component.ts
app.module.ts
<dx-file-uploader> <!-- ... --> [uploadHeaders]="{ YourHeaderName: 'YourHeaderValue' }" </dx-file-uploader>
import { Component } from '@angular/core'; @Component({ selector: 'app-root', templateUrl: './app.component.html', styleUrls: ['./app.component.css'] }) export class AppComponent { constructor() { } }
import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; import { AppComponent } from './app.component'; import { DxFileUploaderModule } from 'devextreme-angular'; @NgModule({ declarations: [AppComponent], imports: [ BrowserModule, DxFileUploaderModule ], providers: [ ], bootstrap: [AppComponent] }) export class AppModule { }
Vue
App.vue
<template> <DxFileUploader> <!-- ... --> :upload-headers="headers" </DxFileUploader> </template> <script> import 'devextreme/dist/css/dx.light.css'; import {DxFileUploader} from 'devextreme-vue/file-uploader'; export default { components: { DxFileUploader }, data() { return { headers:{ YourHeaderName: 'YourHeaderValue' } } }, } </script>
React
App.js
import React from 'react'; import 'devextreme/dist/css/dx.light.css'; import FileUploader from 'devextreme-react/file-uploader'; class App extends React.Component { headers = { YourHeaderName: 'YourHeaderValue' } render() { return ( <FileUploader ... uploadHeaders={this.headers}> </FileUploader> ); } } export default App;
ASP.NET MVC Controls
Razor C#
@(Html.DevExtreme().FileUploader() .UploadHeaders(headers) ) </form> <script> var headers = { YourHeaderName: 'YourHeaderValue' } </script>
Feedback