In fine uploader, how to have S3 bucket different per environment - amazon-s3

Question

I am using fine uploader to uploaded files to S3.
Based on my experience, fine uploader forces to hard code s3 bucket name in the java script itself or it may be my misundestanding!. My challenge is that I have different bucket per environment. does that mean I have to use separate java script (like below) per environment such local, dev,test,etc? Is there any option in which I can pass bucket name from the server side configuration ?
Local
$('#fine-uploader').fineUploaderS3({
template: 'qq-template',
autoUpload: false,
debug: true,
request: {
endpoint: "http://s3.amazonaws.com/bucket_local",
accessKey: "AKxxxxxxxxxxBIA",
},
)}
Dev
$('#fine-uploader').fineUploaderS3({
template: 'qq-template',
autoUpload: false,
debug: true,
request: {
endpoint: "http://s3.amazonaws.com/bucket_dev",
accessKey: "AKxxxxxxxxxxBIA",
},
)}
Test
$('#fine-uploader').fineUploaderS3({
template: 'qq-template',
autoUpload: false,
debug: true,
request: {
endpoint: "http://s3.amazonaws.com/bucket_test",
accessKey: "AKxxxxxxxxxxBIA",
},
)}

Answer 1

Based on my experience, fine uploader forces to hard code s3 bucket name in the java script itself or it may be my misundestanding!
Yes, this is definitely a misunderstanding.
Normally, you would specify your bucket as a URL via the request.endpoint option. You can specify a default value here and then override it at almost any time, for all subsequent files or one or more specific files, via the setEndpoint API method. You can call this method from, for example, an onSubmit callback handler, and even delegate to your server for the bucket by returning a Promise in your callback handler and resolving the Promise once your have called setEndpoint.
Fine Uploader attempts to determine the bucket name from the request.endpoint URL. If this is not possible (such as if you are using a CDN as an endpoint), you will need to supply the bucket name via the objectProperties.bucket option. This too can be dynamically updated, as the option value may be a function, and you may even return a Promise from this function if you would like to delegate to an async task to determine the bucket name (such as if you need to get the bucket name from a server endpoint using an ajax call). Fine Uploader S3 will call your bucket function before it attempts to upload each file, passing the ID of the file to your function.

Answer 2

I set s3_url as hidden value in html, and value set at server based on environment config.
request: {
endpoint: $('#s3_url').val()
}