1
0
mirror of https://github.com/ascribe/onion.git synced 2024-06-30 13:41:57 +02:00

fix csrf bug with fineuploaders props

This commit is contained in:
Tim Daubenschütz 2015-07-02 16:51:22 +02:00
parent 3ae94a2100
commit 29fdb1e0d7
3 changed files with 52 additions and 30 deletions

View File

@ -44,7 +44,7 @@ var ReactS3FineUploader = React.createClass({
}),
signature: React.PropTypes.shape({
endpoint: React.PropTypes.string
}),
}).isRequired,
uploadSuccess: React.PropTypes.shape({
method: React.PropTypes.string,
endpoint: React.PropTypes.string,
@ -67,7 +67,7 @@ var ReactS3FineUploader = React.createClass({
method: React.PropTypes.string,
endpoint: React.PropTypes.string,
customHeaders: React.PropTypes.object
}),
}).isRequired,
session: React.PropTypes.shape({
endpoint: React.PropTypes.bool
}),
@ -106,20 +106,6 @@ var ReactS3FineUploader = React.createClass({
isBrowserPreviewCapable: fineUploader.supportedFeatures.imagePreviews
}
},
signature: {
endpoint: AppConstants.serverUrl + 's3/signature/',
customHeaders: {
'X-CSRFToken': getCookie('csrftoken')
}
},
deleteFile: {
enabled: true,
method: 'DELETE',
endpoint: AppConstants.serverUrl + 's3/delete',
customHeaders: {
'X-CSRFToken': getCookie('csrftoken')
}
},
cors: {
expected: true,
sendCredentials: true
@ -152,10 +138,24 @@ var ReactS3FineUploader = React.createClass({
getInitialState() {
return {
filesToUpload: [],
uploader: new fineUploader.s3.FineUploaderBasic(this.propsToConfig())
uploader: new fineUploader.s3.FineUploaderBasic(this.propsToConfig()),
csrfToken: getCookie('csrftoken')
};
},
// since the csrf header is defined in this component's props,
// everytime the csrf cookie is changed we'll need to reinitalize
// fineuploader and update the actual csrf token
componentWillUpdate(nextProps, nextState) {
let potentiallyNewCSRFToken = getCookie('csrftoken');
if(this.state.csrfToken !== potentiallyNewCSRFToken) {
this.setState({
uploader: new fineUploader.s3.FineUploaderBasic(this.propsToConfig()),
csrfToken: potentiallyNewCSRFToken
});
}
},
propsToConfig() {
let objectProperties = this.props.objectProperties;
objectProperties.key = this.requestKey;
@ -192,13 +192,6 @@ var ReactS3FineUploader = React.createClass({
};
},
getCookie(name) {
let value = '; ' + document.cookie;
let parts = value.split('; ' + name + '=');
if (parts.length === 2) {
return parts.pop().split(';').shift();
}
},
requestKey(fileId) {
let filename = this.state.uploader.getName(fileId);
return new Promise((resolve, reject) => {
@ -207,7 +200,7 @@ var ReactS3FineUploader = React.createClass({
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json',
'X-CSRFToken': this.getCookie('csrftoken')
'X-CSRFToken': getCookie('csrftoken')
},
credentials: 'include',
body: JSON.stringify({
@ -264,7 +257,7 @@ var ReactS3FineUploader = React.createClass({
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json',
'X-CSRFToken': this.getCookie('csrftoken')
'X-CSRFToken': getCookie('csrftoken')
},
credentials: 'include',
body: JSON.stringify({

View File

@ -557,6 +557,20 @@ let FileUploader = React.createClass({
'pk': this.props.edition.other_data ? this.props.edition.other_data.id : null
}
}}
signature={{
endpoint: AppConstants.serverUrl + 's3/signature/',
customHeaders: {
'X-CSRFToken': getCookie('csrftoken')
}
}}
deleteFile={{
enabled: true,
method: 'DELETE',
endpoint: AppConstants.serverUrl + 's3/delete',
customHeaders: {
'X-CSRFToken': getCookie('csrftoken')
}
}}
areAssetsDownloadable={true}
areAssetsEditable={this.props.editable}/>
</Property>

View File

@ -30,6 +30,7 @@ import ReactS3FineUploader from './ascribe_uploader/react_s3_fine_uploader';
import DatePicker from 'react-datepicker/dist/react-datepicker';
import { mergeOptions } from '../utils/general_utils';
import { getCookie } from '../utils/fetch_api_utils';
let RegisterPiece = React.createClass( {
mixins: [Router.Navigation],
@ -66,7 +67,7 @@ let RegisterPiece = React.createClass( {
// once the currentUser object from UserStore is defined (eventually the user was transitioned
// to the login form via the slider and successfully logged in), we can direct him back to the
// register_piece slide
if(state.currentUser && state.currentUser.email) {
if(state.currentUser && state.currentUser.email || this.state.currentUser && this.state.currentUser.email) {
this.refs.slidesContainer.setSlideNum(0);
// we should also make the fineuploader component editable again
this.setState({
@ -158,8 +159,8 @@ let RegisterPiece = React.createClass( {
render() {
return (
<SlidesContainer ref="slidesContainer">
<div
onClick={this.changeSlide}
<div
onClick={this.changeSlide}
onFocus={this.changeSlide}>
<h3 style={{'marginTop': 0}} onClick={this.changePage}>Lock down title</h3>
<Form
@ -266,7 +267,21 @@ let FileUploader = React.createClass({
setIsUploadReady={this.props.setIsUploadReady}
isReadyForFormSubmission={this.props.isReadyForFormSubmission}
areAssetsDownloadable={false}
areAssetsEditable={this.props.editable}/>
areAssetsEditable={this.props.editable}
signature={{
endpoint: AppConstants.serverUrl + 's3/signature/',
customHeaders: {
'X-CSRFToken': getCookie('csrftoken')
}
}}
deleteFile={{
enabled: true,
method: 'DELETE',
endpoint: AppConstants.serverUrl + 's3/delete',
customHeaders: {
'X-CSRFToken': getCookie('csrftoken')
}
}}/>
);
}
});