Upload Files To S3 from Browser and Secure AWS Creds

Question

i am developing a small application in ASP.net MVC ,in which i am uploading file to s3 directly from browser ,below is my code , but the problem is since it is in JavaScript my Access key and Secret key is expose , is there any way i can hide it or is there any other way of uploading file to s3 without exposing Access key and Secret key and i have to upload the file from browser only.

<script src="https://sdk.amazonaws.com/js/aws-sdk-2.1.24.min.js"></script>
<script>
     
    //AWS access info
    AWS.config.update({
        accessKeyId: '************************',
        secretAccessKey: '***********************'
    });


    AWS.config.region = 'us-west-2';

    $(document).ready(function () {
        $("#uploadForm").submit(function () {
            var bucket = new AWS.S3({ params: { Bucket: '*************' } });
            var uploadFiles = $('#upFile')[0];
            var upFile = uploadFiles.files[0];
            if (upFile) {
                
                var uploadParams = { Key: upFile.name, ContentType: upFile.type, Body: upFile, 'Access-Control-Allow-Credentials': '*' };
                bucket.upload(uploadParams).on('httpUploadProgress', function (evt) {
                    console.log("File Uploading: " + parseInt((evt.loaded * 100) / evt.total) + '%');
                }).send(function (err, data) {
                    
                });
            }
            return false;
        });
    });
</script>

 
<div class="container body-content">
    <form id="uploadForm" method='post' enctype="multipart/form-data">
        <h3>Upload File</h3><br />
        <input type='file' name="upFile" id="upFile" required="" />
        <br>
        <input type='submit' value='Upload' />
    </form>

Answer 1

Do the upload logic on the server side. There is a .net, java, python, c++, ruby etc. implementation for connecting to amazon AWS depending on whatever backend you are using.